@font-face {
    font-family: 'Conv_verdanab';
    src: url('../font/verdanab.eot');
    src:url('../font/verdanab.woff') format('woff'), url('../font/verdanab.ttf') format('truetype'), url('../font/verdanab.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Conv_ComicSansMS3';
    src:    url('../font/ComicSansMS3.eot'),
            url('../font/ComicSansMS3.woff')format('woff'),
            url('../font/comicsansms3.ttf') format('truetype'),
            url('../font/ComicSansMS3.svg') format('svg');
    font-weight: normal;
}

@font-face {
    font-family: 'Conv_verdana';
    src: url('../font/verdana.eot');
    src: url('../font/verdana.woff') format('woff'), url('../font/verdana.ttf') format('truetype'), url('../font/verdana.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}



@font-face {
    font-family: 'Conv_comic';
    src: url('../font/comic.eot');
    src: url('../font/comic.woff') format('woff'), url('../font/comic.ttf') format('truetype'), url('../font/comic.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Conv_comicbd';
    src: url('../font/comicbd.eot');
    src: url('../font/comicbd.woff') format('woff'), url('../font/comicbd.ttf') format('truetype'), url('../font/comicbd.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}




body {
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}

body *:not(textarea){
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}


input::-ms-clear {
	display: none;
}


.disabled {
    cursor: default;
}


.tabbed:focus{
    box-shadow: 0px 0px 0px 2px #ffff00;
    border-radius: 2px !important;
    outline: 0;
}


textarea.tabbed:focus{
    box-shadow: 0px 0px 0px 0px;
    border-radius: 0px !important;
    outline: 0;
}


.container {
	position: fixed;
	left: 0;
	top: 0;
}


.container {
	position: fixed;
	left: 0;
	top: 0;
}


.container a{
    text-decoration:none;
}

.container #mainGame {
    position: relative;
    width: 816px;
    height: 611px;
    overflow: hidden;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

#mainGame .screen {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    display: none;
}

#mainGame .screen.active {
    display: block;
}

/*------------------------------------preloader------------------------------------*/
/*#preloader
{
    background:#ffffff;
    background-size:100% 100%;
}

#preloader .process
{
    background:url(../images/loader.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 272px;
    height: 25px;
    position: absolute;
    top: 338px;
    left: 305px;
}

#preloader span
{
    position:absolute;
    font-size: 18px;
    text-align: center;
    font-family: 'Conv_verdana';
    font-weight: bold;
    top: 50%;
    left: 50%;
}
*/

/*------------------------------------screen1------------------------------------*/

#screen1 {
    background:url(../images/screen1/bg.png) no-repeat;
    background-size:100% 100%;
}


.bold{
    font-family: 'Conv_verdanab';
}


.blueboat1 {
    background: url(../images/screen1/blueboat1.png) no-repeat;
    position: absolute;
    width: 70px;
    height: 78px;
    left: 421px;
    top: 318px;
    animation:boat1 2s steps(19) infinite;
    -webkit-animation:boat1 2s steps(19) infinite;
    -moz-animation:boat1 2s steps(19) infinite;
    -ms-animation:boat1 2s steps(19) infinite;
    -o-animation:boat1 2s steps(19) infinite;
}

@keyframes boat1{
        from{background-position: 0 0;}
        to{ background-position: -1330px 0;}
}

@-webkit-keyframes boat1{
        from{background-position: 0 0;}
        to{ background-position: -1330px 0;}
}

@-moz-keyframes boat1{
        from{background-position: 0 0;}
        to{ background-position: -1330px 0;}
}

@-ms-keyframes boat1{
        from{background-position: 0 0;}
        to{ background-position: -1330px 0;}
}

@-o-keyframes boat1{
        from{background-position: 0 0;}
        to{ background-position: -1330px 0;}
}


.blueboat2 {
    background: url(../images/screen1/blueboat1.png) no-repeat;
    position: absolute;
    width: 70px;
    height: 78px;
    right: 70px;
    top: 368px;
    animation: boat1 2s steps(19) infinite;
    -webkit-animation: boat1 2s steps(19) infinite;
    -moz-animation: boat1 2s steps(19) infinite;
    -ms-animation: boat1 2s steps(19) infinite;
    -o-animation: boat1 2s steps(19) infinite;
    transform: rotate(73deg);
    -webkit-transform: rotate(73deg);
    -moz-transform: rotate(73deg);
    -ms-transform: rotate(73deg);
    -o-transform: rotate(73deg);
}


.blueboat3{
    background: url(../images/screen1/blueboat2.png) no-repeat;
    position: absolute;
    width: 70px;
    height: 78px;
    left: 308px;
    top: 326px;
    animation: boat2 2s steps(19) infinite;
    -webkit-animation: boat2 2s steps(19) infinite;
    -moz-animation: boat2 2s steps(19) infinite;
    -ms-animation: boat2 2s steps(19) infinite;
    -o-animation: boat2 2s steps(19) infinite;
}


@keyframes boat2{
        from{ background-position: 0 0; }
        to{ background-position: -1026px 0;}
}

@-webkit-keyframes boat2{
        from{ background-position: 0 0; }
        to{ background-position: -1026px 0;}
}

@-moz-keyframes boat2{
        from{ background-position: 0 0; }
        to{ background-position: -1026px 0;}
}

@-ms-keyframes boat2{
        from{ background-position: 0 0; }
        to{ background-position: -1026px 0;}
}

@-o-keyframes boat2{
        from{ background-position: 0 0; }
        to{ background-position: -1026px 0;}
}


.redboat1{
    background: url(../images/screen1/redboat1.png) no-repeat;
    position: absolute;
    width: 152px;
    height: 131px;
    right: 126px;
    top: 135px;
    animation: redboat1 6s steps(79) infinite;
    -webkit-animation: redboat1 6s steps(79) infinite;
    -moz-animation: redboat1 6s steps(79) infinite;
    -ms-animation: redboat1 6s steps(79) infinite;
    -o-animation: redboat1 6s steps(79) infinite;
    transform: rotate(44deg);
    -webkit-transform: rotate(44deg);
    -moz-transform: rotate(44deg);
    -ms-transform: rotate(44deg);
    -o-transform: rotate(44deg);
}


@keyframes redboat1{
        from{ background-position: 0 0; }
        to{ background-position: -12008px 0; }
}

@-webkit-keyframes redboat1{
        from{ background-position: 0 0; }
        to{ background-position: -12008px 0; }
}

@-moz-keyframes redboat1{
        from{ background-position: 0 0; }
        to{ background-position: -12008px 0; }
}

@-ms-keyframes redboat1{
        from{ background-position: 0 0; }
        to{ background-position: -12008px 0; }
}

@-o-keyframes redboat1{
        from{ background-position: 0 0; }
        to{ background-position: -12008px 0; }
}


.redboat{
    background: url(../images/screen1/redboat2.png) no-repeat;
    position: absolute;
    width: 83px;
    height: 85px;
    
}


.redboat2{
    left: 319px;
    top: 259px;
    animation: redboat2 2s steps(19) infinite;
    -webkit-animation: redboat2 2s steps(19) infinite;
    -moz-animation: redboat2 2s steps(19) infinite;
    -ms-animation: redboat2 2s steps(19) infinite;
    -o-animation: redboat2 2s steps(19) infinite;
}


@keyframes redboat2{
        from{ background-position: 0 0; }
        to{ background-position: -1577px 0;}
}

@-webkit-keyframes redboat2{
        from{ background-position: 0 0; }
        to{ background-position: -1577px 0;}
}

@-moz-keyframes redboat2{
        from{ background-position: 0 0; }
        to{ background-position: -1577px 0;}
}

@-ms-keyframes redboat2{
        from{ background-position: 0 0; }
        to{ background-position: -1577px 0;}
}

@-o-keyframes redboat2{
        from{ background-position: 0 0; }
        to{ background-position: -1577px 0;}
}

.redboat3{
    left: 475px;
    top: 336px;
    animation: redboat2 2s steps(19) infinite;
    -webkit-animation: redboat2 2s steps(19) infinite;
    -moz-animation: redboat2 2s steps(19) infinite;
    -ms-animation: redboat2 2s steps(19) infinite;
    -o-animation: redboat2 2s steps(19) infinite;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}


.redboat4{
    left: 579px;
    top: 512px;
    animation: redboat2 2s steps(19) infinite;
    -webkit-animation: redboat2 2s steps(19) infinite;
    -moz-animation: redboat2 2s steps(19) infinite;
    -ms-animation: redboat2 2s steps(19) infinite;
    -o-animation: redboat2 2s steps(19) infinite;
    transform: rotate(20deg);
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -ms-transform: rotate(20deg);
    -o-transform: rotate(20deg);
}


.skyblueboat{
    background: url(../images/screen1/skyblueboat.png) no-repeat;
    position: absolute;
    width: 66px; 
    height: 72px;    
}


.skyblueboat1{
    left: 487px;
    top: 256px;
    animation: skyblueboat1 2s steps(19) infinite;
    -webkit-animation: skyblueboat1 2s steps(19) infinite;
    -moz-animation: skyblueboat1 2s steps(19) infinite;
    -ms-animation: skyblueboat1 2s steps(19) infinite;
    -o-animation: skyblueboat1 2s steps(19) infinite;
}


@keyframes skyblueboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1254px 0;}
}

@-webkit-keyframes skyblueboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1254px 0;}
}

@-moz-keyframes skyblueboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1254px 0;}
}

@-ms-keyframes skyblueboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1254px 0;}
}

@-o-keyframes skyblueboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1254px 0;}
}


.skyblueboat2{
    left: 562px;
    top: 480px;
    animation: skyblueboat1 2s steps(19) infinite;
    -webkit-animation: skyblueboat1 2s steps(19) infinite;
    -moz-animation: skyblueboat1 2s steps(19) infinite;
    -ms-animation: skyblueboat1 2s steps(19) infinite;
    -o-animation: skyblueboat1 2s steps(19) infinite;
    transform: rotate(216deg);
    -webkit-transform: rotate(216deg);
    -moz-transform: rotate(216deg);
    -ms-transform: rotate(216deg);
    -o-transform: rotate(216deg);
}


.greenboat{
    background: url(../images/screen1/greenboat.png) no-repeat;
    position: absolute;
    width: 76px; 
    height: 72px;    
}


.greenboat1{
    left: 301px;
    top: 377px;
    animation: greenboat1 2s steps(19) infinite;
    -webkit-animation: greenboat1 2s steps(19) infinite;
    -moz-animation: greenboat1 2s steps(19) infinite;
    -ms-animation: greenboat1 2s steps(19) infinite;
    -o-animation: greenboat1 2s steps(19) infinite;
    transform: rotate(120deg);
    -webkit-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    -o-transform: rotate(120deg);
}


@keyframes greenboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1444px 0;}
}

@-webkit-keyframes greenboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1444px 0;}
}

@-moz-keyframes greenboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1444px 0;}
}

@-ms-keyframes greenboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1444px 0;}
}

@-o-keyframes greenboat1{
        from{ background-position: 0 0; }
        to{ background-position: -1444px 0;}
}


.greenboat2{
    left: 722px;
    top: 280px;
    animation: greenboat1 2s steps(19) infinite;
    -webkit-animation: greenboat1 2s steps(19) infinite;
    -moz-animation: greenboat1 2s steps(19) infinite;
    -ms-animation: greenboat1 2s steps(19) infinite;
    -o-animation: greenboat1 2s steps(19) infinite;
    transform: rotate(67deg);
    -webkit-transform: rotate(67deg);
    -moz-transform: rotate(67deg);
    -ms-transform: rotate(67deg);
    -o-transform: rotate(67deg);
}


.fish{
    background: url(../images/screen1/fishsprite.png) no-repeat;
    position: absolute;
    width: 133px;
    height: 171px;
    left: 596px;
    top: 235px;
    animation: fish 12s steps(179) infinite;
    -webkit-animation: fish 12s steps(179) infinite;
    -moz-animation: fish 12s steps(179) infinite;
    -ms-animation: fish 12s steps(179) infinite;
    -o-animation: fish 12s steps(179) infinite;
}


@keyframes fish{
    from{background-position: 0 0;}
    to{background-position: -23807px 0; }
}

@-webkit-keyframes fish{
    from{background-position: 0 0;}
    to{background-position: -23807px 0; }
}

@-moz-keyframes fish{
    from{background-position: 0 0;}
    to{background-position: -23807px 0; }
}

@-ms-keyframes fish{
    from{background-position: 0 0;}
    to{background-position: -23807px 0; }
}

@-o-keyframes fish{
    from{background-position: 0 0;}
    to{background-position: -23807px 0; }
}


#screen1 .popup1{
    background:url(../images/screen1/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 275px;
    height: 133px;
    left: 381px;
    top: 277px;
    display:none;
}

#screen1 .popup1-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 15px;
    color: #000000;
    top: 23px;
    left: 36px;
    width: 208px;
    letter-spacing: 0px;
}


#screen1 .popup2{
    background:url(../images/screen1/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 175px;
    height: 139px;
    left: 435px;
    top: 281px;
    display:none;
}


#screen1 .popup2-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 15px;
    font-weight: normal;
    color: #000000;
    top: 33px;
    left: 55px;
    letter-spacing: 0px;
}


#screen1 .tryagain-btn{
    background:url(../images/button/tryagain/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 115px;
    height: 38px;
    top: 72px;
    left: 32px;
}


#screen1 .tryagain-btn span{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 14px;
    color: #FFFFFF;
    top: 9px;
    left: 20px;
    letter-spacing: 1px;
}


#screen1 .tryagain-btn:hover, .tryagain-btn:focus{
    background:url(../images/button/tryagain/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);
}


#screen1 .tryagain-btn:active{
    background:url(../images/button/tryagain/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}



#screen1 .continue-btn{
    background:url(../images/button/countinou/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 107px;
    height: 35px;
    left: 59px;
    bottom: 13px;
}


#screen1 .continue-btn:hover,.continue-btn:focus{
    background:url(../images/button/countinou/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}

#screen1 .continue-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 17px;
}


#screen1 .text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    font-weight: normal;
    color: #000000;
    width: 184px;
    top: 139px;
    left: 16px;
    line-height: 20px;
}


#screen1 .text2{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 14px;
    color: #000000;
    width: 183px;
    top: 361px;
    left: 18px;
}


#screen1 .text3{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    width: 183px;
    top: 405px;
    left: 18px;
    line-height: 19px;
}


#screen1 .text4{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 12px;
    color: #FFFFFF;
    top: 153px;
    left: 268px;
    letter-spacing: 1px;
}


#screen1 .text5{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 13px;
    color: #FFFFFF;
    top: 553px;
    left: 742px;
    letter-spacing: 1px;
}


#screen1 .mainboat{
    background:url(../images/screen1/mainboat.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 27px;
    height: 51px;
    left: 265px;
    top: 188px;
    z-index:2;
}


.boatwave {
    position: absolute;
    width: 40px;
    height: 77px;
    right: -4px;
    top: -27px;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    display:none;
}


.boatwave1 {
    background: url(../images/screen1/boatwave/1.svg) no-repeat;
    background-size:100% 100%;
}


.boatwave2 {
    background: url(../images/screen1/boatwave/2.svg) no-repeat;
    background-size:100% 100%;
}

.boatwave3 {
    background: url(../images/screen1/boatwave/3.svg) no-repeat;
    background-size:100% 100%;
}

.boatwave4 {
    background: url(../images/screen1/boatwave/4.svg) no-repeat;
    background-size:100% 100%;
}

.boatwave5 {
    background: url(../images/screen1/boatwave/5.svg) no-repeat;
    background-size:100% 100%;
}

/*------------------------------------screen2------------------------------------*/

#screen2 {
    background:url(../images/screen2/bg.png)no-repeat;
    background-size:100% 100%;
}


#screen2 .text5{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 17px;
    color: #000000;
    width: 200px;
    top: 304px;
    left: 577px;
    line-height: 27px;
}


.next-btn{
    background:url(../images/button/next/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 96px;
    height: 38px;
    right: 14px;
    bottom: 5px;
}


 .next-btn:not(.disabled):hover,.next-btn:not(.disabled):focus
 {
    background:url(../images/button/next/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.next-btn:not(.disabled):active{
    background:url(../images/button/next/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.next-btn  span{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 20px;
}


.next-btn.disabled{
    background:url(../images/button/next/4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    cursor:default;
}

/*------------------------------------screen3------------------------------------*/

#screen3 {
    background:url(../images/screen3/bg.png) no-repeat;
    background-size:100% 100%;
}


.popup1{
    background:url(../images/screen3/sc3_popup.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 400px;
    height: 172px;
    left: 40px;
    top: 66px;
}


.popup1-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 14px;
    width: 321px;
    line-height: 18px;
}



.back-btn{
    background:url(../images/button/back/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 96px;
    height: 38px;
    left: 14px;
    bottom: 5px;
}


.back-btn.disabled{
    background:url(../images/button/back/4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    cursor:default;
}


.back-btn:not(.disabled):hover,.back-btn:not(.disabled):focus{
    background:url(../images/button/back/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.back-btn:not(.disabled):active{
    background:url(../images/button/back/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}

 .back-btn span{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 40px;
}


.replay-btn{
    background:url(../images/button/replay/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 138px;
    height: 38px;
    left: 116px;
    bottom: 5px;
}


.replay-btn.disabled{
    background:url(../images/button/replay/4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    cursor:default;
}


 .replay-btn:not(.disabled):hover , .replay-btn:not(.disabled):focus
 {
    background:url(../images/button/replay/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.replay-btn:not(.disabled):active{
    background:url(../images/button/replay/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.replay-btn span{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 28px;
}



/*------------------------------------screen4------------------------------------*/

#screen4 {
    background:url(../images/screen4/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen4  .popup{
    background:url(../images/screen4/popup.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 680px;
    height: 100px;
    left: 9px;
    top: 4px;
}


#screen4  .popup-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 15px;
    left: 14px;
    width: 159px;
    line-height: 17px;
}


#screen4 .popup-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 15px;
    left: 209px;
    width: 261px;
    line-height: 17px;
}


#screen4 .popup-text3{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 23px;
    left: 497px;
    width: 181px;
    line-height: 17px;
}

#screen4  .men1{
    background:url(../images/screen4/menpic.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 108px;
    height: 123px;
    right: 23px;
    top: 0px;
}


#screen4  .popup2{
    background:url(../images/screen4/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 325px;
    height: 95px;
    left: 254px;
    top: 310px;
}


.popuptext{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 13px;
    color: #000000;
    line-height: 19px;  
}


.popuptext1{
    top: 120px;
    left: 13px;
    width: 121px;
}


.popuptext2{
    top: 120px;
    left: 182px;
    width: 266px;
    
}


 .popuptext3{
    top: 310px;
    left: 13px;
    width: 245px;
}


 .popuptext4{
    top: 318px;
    left: 270px;
    width: 290px;
}


 .popuptext5{
    top: 308px;
    left: 584px;
    width: 200px;
}


 .popuptext6{
    top: 489px;
    left: 44px;
    width: 360px;
}



/*------------------------------------screen5------------------------------------*/

#screen5 {
    background:url(../images/screen4/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen5 .men2{
    background:url(../images/screen5/menpic2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 108px;
    height: 123px;
    right: 23px;
    top: 0px;
}


#screen5 .popup1{
    background:url(../images/screen5/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 652px;
    height: 90px;
    left: 37px;
    top: 9px;
}


#screen5 .popup1.pop4{
    background:url(../images/screen5/popup4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 566px;
    height: 90px;
    left: 130px;
    top: 9px;
}


#screen5 .popup1-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 20px;
    left: 14px;
    width: 256px;
    line-height: 17px;
}


#screen5 .popup1-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 20px;
    left: 313px;
    width: 287px;
    line-height: 17px;
}

#screen5 .popup1-text3{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 20px;
    left: 22px;
    width: 199px;
    line-height: 17px;
    display: none;
}

#screen5 .popup1-text4{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 10px;
    left: 260px;
    width: 287px;
    line-height: 17px;
    display: none;
}



.popup2{
    background:url(../images/screen4/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 325px;
    height: 95px;
    left: 254px;
    top: 310px;
    z-index:1;
}


 .popuptext{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 13px;
    color: #000000;
    line-height: 19px;
    z-index:6;  
}


#screen5 .popup3{
    background:url(../images/screen5/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 204px;
    height: 103px;
    right: 127px;
    bottom: 115px;
}



.boat{
    background:url(../images/screen5/boat.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 203px;
    height: 103px;
    right: 127px;
    bottom: 115px;
    z-index:0;
    display:none;
}


.boat-text{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 13px;
    color: #000000;
    width: 187px;
    right: 114px;
    bottom: 83px;
    line-height: 20px;
    z-index: 7;
    display:none;
}


.plan{
    background:url(../images/screen5/plan.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 203px;
    height: 103px;
    right: 127px;
    bottom: 115px;
    z-index:0;
    display:none;
}


.plan-text{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 13px;
    color: #000000;
    width: 170px;
    right: 131px;
    bottom: 82px;
    line-height: 20px;
    z-index: 7;
    display:none;
}


.paddle{
    background:url(../images/screen5/paddle.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 203px;
    height: 103px;
    right: 127px;
    bottom: 115px;
    z-index:0;
    display:none;
}


.paddle-text{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 13px;
    color: #000000;
    width: 170px;
    right: 131px;
    bottom: 64px;
    line-height: 20px;
    z-index: 7;
    z-index: 7;
    display:none;
}


.color{
    position: absolute;
    width: 304px;
    height: 130px;
    right: 25px;
    bottom: 88px;
    z-index: 0;
    display:none;
}

.color span{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 97px;
    left: 235px;
}


.boatcolor {
    background:url(../images/screen5/boatcolor.svg) no-repeat;
    background-size:100% 100%;
}


.plancolor{
    background:url(../images/screen5/planecolor.svg) no-repeat;
    background-size:100% 100%;
}


.paddlecolor{
    background:url(../images/screen5/paddlecolor.svg) no-repeat;
    background-size:100% 100%;
}



#screen5 .popup4{
    background:url(../images/screen5/popup3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 204px;
    height: 65px;
    right: 114px;
    bottom: 70px;
    z-index:6;
}


#screen5 .popup5{
    background:url(../images/screen5/popup3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 204px;
    height: 85px;
    right: 114px;
    bottom: 51px;
    display:none;
    z-index:6;
}



.end-btn{
    background:url(../images/button/end/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 83px;
    height: 36px;
}


 .end-btn:not(.active):hover , .end-btn:not(.active):focus{
    background:url(../images/button/end/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.end-btn:not(.active):active{
    background:url(../images/button/end/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.end1-btn{
    right: 20px;
    bottom: 181px;
}


.end1-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 18px;
}


.end2-btn{
    right: 20px;
    bottom: 145px;
}


.end2-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 18px;
}


.end3-btn{
    right: 20px;
    bottom: 109px;
}


.end3-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 18px;
}


.ok-btn{
    background:url(../images/button/ok/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 83px;
    height: 36px;
    right: 20px;
    bottom: 72px;
}

.ok-btn.disabled
{
    background:url(../images/button/ok/4.svg) no-repeat;
    background-size:100% 100%;
    cursor:default;
}


.ok-btn:not(.disabled):hover, .ok-btn:not(.disabled):focus{
    background:url(../images/button/ok/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.ok-btn:not(.disabled):active
{
    background:url(../images/button/ok/3.svg) no-repeat;
    background-size:100% 100%;
}


.ok-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 28px;
}


/*------------------------------------screen6------------------------------------*/

#screen6{
    background:url(../images/screen6/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen6 .popup1{
    background:url(../images/screen6/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 408px;
    height: 280px;
    left: 52px;
    top: 48px;
}
   

#screen6  .popup1-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 15px;
    width: 298px;
    line-height: 19px;
}


#screen6  .popup1-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 137px;
    left: 15px;
    width: 281px;
    line-height: 16px;
}


#screen6 .para-list{    
    position: absolute;
    top: 165px;
    width: 270px;
    height: 60px;
    text-align: left;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
}



/*------------------------------------screen7------------------------------------*/

#screen7{
    background:url(../images/screen7/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen7 .popup1{
    background:url(../images/screen7/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 404px;
    height: 168px;
    left: 59px;
    top: 48px;
}
   

#screen7  .popup1-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 22px;
    width: 312px;
    line-height: 19px;
}


#screen7 .popup2{
    background:url(../images/screen7/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 264px;
    height: 79px;
    left: 147px;
    top: 226px;
}


.aboutad-btn{
    background:url(../images/button/aboutadjective/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 242px;
    height: 40px;
    left: 10px;
    top: 18px; 
}


.aboutad-btn:hover , .aboutad-btn:focus {
    background:url(../images/button/aboutadjective/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


 .aboutad-btn:active{
    background:url(../images/button/aboutadjective/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.aboutad-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 9px;
    left: 60px;
}


/*----------------------------------------greenpopup start---------------------------------*/

.adpopup{
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:3;
}


.greenpopup{
    background:url(../images/screen7/greenpopup.svg) no-repeat;
    background-size:100% 100%;
    display:none;
}


.text1{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 36px;
    left: 218px;
}


.text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 90px;
    left: 186px;
    width: 230px;
    line-height: 19px;
}


.disableScreen{
    background:rgba(0,0,0,0.5);
    width:100%;
    position:absolute;
    z-index:2;
}

.replay2-btn{
    background:url(../images/button/replay2/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 85px;
    height: 38px;
    left: 332px;
    bottom: 27px;
}


 .replay2-btn:hover, .replay2-btn:focus{
    background:url(../images/button/replay2/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.replay2-btn:active{
    background:url(../images/button/replay2/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.replay2-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 14px;
}


.cross-btn{
    background:url(../images/button/cross/close0001.png) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 38px;
    height: 37px;
    left: 666px;
    top: 16px;
	color:transparent;
}


.cross-btn:hover, .cross-btn:focus{
    background:url(../images/button/cross/close0002.png) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.cross-btn:active{
    background:url(../images/button/cross/close0003.png) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.cross-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 14px;
	color:transparent;
}


#video1{
    position: absolute;
    top: 77px;
    left: 435px;
    width: 245px;
    height: 234px;
}


/*----------------------------------------greenpopup end---------------------------------*/


/*------------------------------------screen8------------------------------------*/

#screen8{
    background:url(../images/screen4/bg.png) no-repeat;
    background-size:100% 100%;
}

#screen8  .disabledScreen
{
    height:100px;
    display:block;
    z-index:8;
}


#screen8 .aboutad-btn{
    top: 568px;
    left: 458px;        
}


/*--------------------------------------------screen8 bluepopup1----------------------------------------*/

#screen8 .bluepopup1{
    background:url(../images/screen8/bluepopup.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display: none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen8 .men1{
    background:url(../images/screen8/men1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 48px;
    top: 29px;
}


#screen8 .popup1{
    background:url(../images/screen8/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 240px;
    height: 164px;
    left: 160px;
    top: 15px;
}


#screen8 .popup1-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 32px;
    width: 188px;
    line-height: 16px;
}


#screen8 .popup3{
    background:url(../images/screen8/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 326px;
    height: 115px;
    left: 25px;
    top: 181px;
}


#screen8 .popup3-text{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 17px;
    left: 12px;
    width: 325px;
    line-height: 20px;

}


#screen8 .popup3-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 17px;
    left: 12px;
    width: 305px;
    line-height: 20px;
    display:none;
}


 .whatkind-btn{
    background:url(../images/screen8/textbox/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 83px;
    height: 18px;
}


 .whatkind-btn span{
    position: absolute;
    font-family: 'Conv_comicbd';
    font-size: 14px;
    color: #003399;
    top: 0px;
    left: 3px;
    width: 80px;
}


 .whatkind-btn:hover, .whatkind-btn:focus{
    background:url(../images/screen8/textbox/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute; 
}


 .whatkind-btn:active{
    background:url(../images/screen8/textbox/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.whatkind-btn1{
    top: 39px;
    left: 63px;
    display:block;
}


.menu{    
    height: 60px;
    width: 88px;
    position: absolute;
    display:none;
    text-align:center;
}


.menu1
{    
    left: 61px;
    top: 19px;
}


.option
{    
    height: 20px;
    width: 90px;
    position: absolute;
    background-color: #FEE7A5;
    border:1px solid #000000;
}

.menu3 .option
{    
    height: 20px;
    width: 105px;
    position: absolute;
    background-color: #FEE7A5;
    border:1px solid #000000;
}


.option:hover, .option:focus
{    
    background-color:#ffffff;
    border:1px solid #000000;
}


.option:active
{    
    background-color:#CC0000;
    border:1px solid #000000;
}


.option:active span
{    
   color:#ffffff;
}


.option span{
    font-family: 'Conv_comicbd';
    font-size: 14px;
    color: #003399;

}


.option1{
    left: 0px;
    top: 0px;
}


.option2{
    left: 0px;
    top: 20px;
}

.option3{
    left: 0px;
    top: 40px;
}


#screen8 .popup4{
    background:url(../images/screen8/popup4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 266px;
    height: 124px;
    left: 425px;
    top: 62px;
    display:none;
}


#screen8 .popup4-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 15px;
    width: 250px;
    line-height: 17px;
    display: none;
}


#screen8 .popup4-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 15px;
    color: #000000;
    top: 18px;
    left: 15px;
    width: 250px;
    line-height: 17px;
    display:none;
}


#screen8 .men2{
    background:url(../images/screen8/men2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 48px;
    top: 29px;
    display:none;
}



 .popup5{
    background:url(../images/screen8/popup5.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 165px;
    height: 89px;   
}


.popupgood{
    left: 170px;
    top: 38px;
    display:none;
}


#screen8 .popup5-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 31px;
}



/*--------------------------------------------screen8 bluepopup2----------------------------------------*/

.bluepopup2{
    background:url(../images/screen8/bluepopup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display: none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
    transform-origin: 50px 250px;
    -webkit-transform-origin: 50px 250px;
    -moz-transform-origin: 50px 250px;
    -ms-transform-origin: 50px 250px;
    -o-transform-origin: 50px 250px;
}


.bluepopup2men1{
    background:url(../images/screen8/men1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 39px;
    top: 35px;
    transform: rotate(14deg);
    -webkit-transform: rotate(14deg);
    -moz-transform: rotate(14deg);
    -ms-transform: rotate(14deg);
    -o-transform: rotate(14deg);
}


#screen8 .popup6{
    background:url(../images/screen8/popup6.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 190px;
    height: 203px;
    left: 136px;
    top: 25px;
}


#screen8 .popup6-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 36px;
    width: 156px;
    line-height: 15px;
}


#screen8 .popup7{
    background:url(../images/screen8/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 284px;
    height: 105px;
    left: 355px;
    top: 165px;
}


#screen8 .popup7-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 13px;
    left: 12px;
    width: 268px;
    line-height: 20px;
}


#screen8 .popup7-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 13px;
    left: 12px;
    width: 263px;
    line-height: 20px;
    display:none;
}


.whatkind-btn2{
    top: 15px;
    left: 139px;
}


.menu2{
    left: 136px;
    top: -7px;
}
   

#screen8 .popup8{
    background:url(../images/screen8/popup4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 304px;
    height: 120px;
    left: 44px;
    top: 236px;
}


#screen8 .popup8-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 11px;
    left: 11px;
    width: 288px;
    line-height: 17px;
    display:none;
}


#screen8 .popup8-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 10px;
    left: 13px;
    width: 276px;
    line-height: 17px;
}


.popupgood1{
    left: 136px;
    top: 61px;
    display:none;
}


/*--------------------------------------------screen8 bluepopup3----------------------------------------*/

.bluepopup3{
    background:url(../images/screen8/bluepopup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display:none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen8 .popup9{
    background:url(../images/screen8/popup7.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 198px;
    height: 196px;
    left: 124px;
    top: 23px;
}


#screen8 .popup9-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 31px;
    width: 161px;
    line-height: 16px;
}


#screen8 .popup10{
    background:url(../images/screen8/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 375px;
    height: 105px;
    left: 324px;
    top: 187px;
}


#screen8 .popup10-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 9px;
    left: 20px;
    width: 314px;
    line-height: 21px;
    display:none;
}

    


#screen8 .popup10-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color:#000000;
    top: 9px;
    left: 20px;
    width: 314px;
    line-height: 21px;
}


.whatkind-btn3{

   left: 113px;
   top: 54px;
}


.menu3{
     left: 109px;
    top: 32px;
}


#screen8 .popup11{
    background:url(../images/screen8/popup4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 294px;
    height: 110px;
    left: 27px;
    top: 230px;
    display: none;
}


#screen8 .popup11-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 16px;
    left: 17px;
    width: 269px;
    line-height: 16px;
    display:none;
}


#screen8 .popup11-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 13px;
    left: 17px;
    width: 263px;
    line-height: 17px;
}


.popupgood2{
    background:url(../images/screen8/popup8.svg) no-repeat;
    background-size:100% 100%;
    width: 177px;
    height: 98px;
    left: 138px;
    top: 92px;
    display: none;
}


/*--------------------------------------------screen8 bluepopup4----------------------------------------*/

.bluepopup4{
    background:url(../images/screen8/bluepopup3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display:none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen8 .popup12{
    background:url(../images/screen8/popup9.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 241px;
    height: 155px;
    left: 144px;
    top: 39px;
}


#screen8 .popup12-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 13px;
    left: 37px;
    width: 196px;
    line-height: 16px;
}


#screen8 .popup13{
    background:url(../images/screen8/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 266px;
    height: 112px;
    left: 403px;
    top: 182px;
}


#screen8 .popup13-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 16px;
    color: #000000;
    top: 12px;
    left: 17px;
    width: 227px;
    line-height: 21px;
}

    
#screen8 .popup13-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 9px;
    left: 20px;
    width: 225px;
    line-height: 22px;
    display:none;
}


.whatkind-btn4{
    left: 48px;
    top: 36px;
}


.menu4 {
    left: 61px;
    top: 19px;
}


.menu4  .option{
    width: 64px;
    left: -8px;
}



#screen8 .popup14{
    background:url(../images/screen8/popup10.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 272px;
    height: 140px;
    left: 50px;
    top: 207px;
    display: none;
}


#screen8 .popup14-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 20px;
    left: 17px;
    width: 239px;
    line-height: 16px;
    display:none;
}


#screen8 .popup14-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 17px;
    width: 245px;
    line-height: 17px;
}


.popupgood3{
    background:url(../images/screen8/popup11.svg) no-repeat;
    background-size:100% 100%;
    width: 161px;
    height: 93px;
    left: 139px;
    top: 67px;
    display: none;
}


/*--------------------------------------------screen8 bluepopup5----------------------------------------*/

.bluepopup5{
    background:url(../images/screen8/bluepopup5.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display: none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


.mansmaile{
    background:url(../images/screen8/mansmaile.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 121px;
    height: 135px;
    left: 33px;
    top: 24px;
}


.popup15{
    background:url(../images/screen8/popup12.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 362px;
    height: 101px;
    left: 130px;
    top: 41px;
}


.popup15-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    width: 130px;
    top: 22px;
    left: 44px;
    line-height: 17px;
}


.popup15-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    width: 141px;
    top: 19px;
    left: 213px;
    line-height: 16px;
}
   

#screen8 .popup16{
    background:url(../images/screen8/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 465px;
    height: 91px;
    left: 110px;
    top: 260px;
}


#screen8 .popup16-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 16px;
    color: #000000;
    top: 12px;
    left: 40px;
    width: 382px;
    line-height: 21px;
}

    
#screen8 .popup16-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 16px;
    color: #000000;
    top: 12px;
    left: 41px;
    width: 382px;
    line-height: 21px;
    display:none;   
}


.whatkind-btn5{
    left: 53px;
    top: 14px;
}


.menu5{
    left: 50px;
    top: -8px;
}


#screen8 .popup17{
    background:url(../images/screen8/popup13.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 188px;
    height: 141px;
    left: 506px;
    top: 27px;
    display: none;
}


#screen8 .popup17-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 14px;
    left: 13px;
    width: 170px;
    line-height: 16px;
    display:none;
}


#screen8 .popup17-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 14px;
    left: 10px;
    width: 180px;
    line-height: 16px;      
}


#screen8 .popup18{
    background:url(../images/screen8/popup14.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 364px;
    height: 140px;
    left: 151px;
    top: 21px;
    display: none;
}


#screen8 .popup18-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 12px;
    left: 46px;
    width: 300px;
    line-height: 16px;
}


/*------------------------------------Animation--------------------------------*/

.ani{
    transform:scale(1) !important;
    -webkit-transform:scale(1) !important;
    -moz-transform:scale(1) !important;
    -ms-transform:scale(1) !important;
    -o-transform:scale(1) !important;
}


/*------------------------------------screen9------------------------------------*/

#screen9{
    background:url(../images/screen9/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen9 .aboutad-btn{
    top: 257px;
    left: 147px;        
}


#screen9 .aboutad-text{
    top: 9px;
    left: 41px;     
}


.bgpopuptext{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 120px;
    left: 177px;
    width: 213px;
    line-height: 19px;
}



/*------------------------------------orangepopup------------------------------------*/

.orangepopup{
    background:url(../images/screen9/orangepopup.svg) no-repeat;
    background-size:100% 100%;
    position:absolute;
    display: none;
}


#screen9 .text1 {
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 17px;
    top: 39px;
    left: 226px;
}

#screen9 .text2 {
    font-size: 14px;
    top: 88px;
    left: 200px;
    width: 196px;
}
   

#screen9 .replay2-btn {
    left: 330px;
    bottom: 80px;
}


#screen9 .cross-btn {
    left: 650px;
    top: 24px;  
}


#video2{
    position: absolute;
    top: 73px;
    left: 436px;
    width: 227px;
    height: 226px;
}


/*------------------------------------screen10------------------------------------*/

#screen10{
    background:url(../images/screen4/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen10 .aboutad-btn{
    width: 193px;
    height: 40px;
    left: 508px;
    top: 567px;
}
       

#screen10 .aboutad-text{
     top: 9px;
    left: 17px;     
}


/*------------------------------------screen10 bluepopup1------------------------------------*/

#screen10 .bluepop1{
    background:url(../images/screen8/bluepopup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display:none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen10 .bluepopup2men1{
    background:url(../images/screen8/men1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 39px;
    top: 35px;
    transform: rotate(14deg);
    -webkit-transform: rotate(14deg);
    -moz-transform: rotate(14deg);
    -ms-transform: rotate(14deg);
    -o-transform: rotate(14deg);
}



#screen10 .popup1{
    background:url(../images/screen10/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 209px;
    height: 160px;
    left: 140px;
    top: 48px;
}


#screen10 .popup1-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 12px;
    left: 35px;
    width: 170px;
    line-height: 17px;
}


#screen10 .popup3{
    background:url(../images/screen10/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 288px;
    height: 130px;
    left: 353px;
    top: 166px;
}


#screen10 .popup3-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 11px;
    left: 14px;
    width: 255px;
    line-height: 21px;
}


#screen10 .popup6{
    background:url(../images/screen10/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 288px;
    height: 109px;
    left: 353px;
    top: 166px;
    z-index: 2;
    display: none;
}


#screen10 .popup6-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 11px;
    left: 10px;
    width: 271px;
    line-height: 21px;
    z-index: 2;
}



.didwhat-btn{
    position: absolute;
    background-color: #FEE7A5;
    border:1px solid #000000;
    width: 77px;
    height: 18px;
}


.didwhat-btn span{
    position: absolute;
    font-family: 'Conv_comicbd';
    font-size: 14px;
    color: #003399;
    top: -1px;
    left: 5px;
}


.didwhat-btn:hover, .didwhat-btn:focus{
    background-color:#00CC33;
    border:1px solid #000000; 
}


.didwhat-btn:active{
    background-color:#80E699;
    border:1px solid #000000;
}


.didwhat-btn1{
    top: 178px;
    left: 404px;
}


.list{    
    height: 60px;
    width: 88px;
    position: absolute;
    text-align:center;
    
}


.list1{    
    left: 390px;
    top: 156px;
    display: none;
}


.choise{    
    height: 23px;
    width: 65px;
    position: absolute;
    background-color: #FEE7A5;
    border:1px solid #000000;
}


.choise:hover, .choise:focus
{    
    background-color:#ffffff;
    border:1px solid #000000;
}


.choise:active
{    
    background-color:#CC0000;
    border:1px solid #000000;
}


.choise:active span
{    
   color:#ffffff;
}


.choise span{
    font-family: 'Conv_comicbd';
    font-size: 15px;
    color: #003399;
    top: -1px;
    
}


.choise1{
    left: 0px;
    top: 0px;
    text-align:center;
}


.choise2{
    left: 0px;
    top: 24px;
    text-align:center;
}

.choise3{
    left: 0px;
    top: 48px;
    text-align:center;
}


#screen10 .popup4{
    background:url(../images/screen10/greenpop.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 289px;
    height: 114px;
    left: 30px;
    top: 224px;
    display:none;
}


#screen10 .popup4-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 17px;
    width: 252px;
    line-height: 17px;
}


#screen10 .popup4-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 17px;
    width: 263px;
    line-height: 17px;
    display:none;   
}


#screen10 .popup5{
    background:url(../images/screen10/goodpopup.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 165px;
    height: 89px;
    top: 64px;
    left: 140px;
    display: none;
}


#screen10 .popup5-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 34px;
}



/*------------------------------------screen10 bluepopup2------------------------------------*/

#screen10 .bluepop2{
    background:url(../images/screen10/contantpop2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display:none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen10 .popup7{
    background:url(../images/screen10/popup3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 200px;
    height: 140px;
    left: 123px;
    top: 27px;
}


#screen10 .popup7-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 32px;
    width: 162px;
    line-height: 17px;
}


#screen10 .popup8{
    background:url(../images/screen10/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 375px;
    height: 110px;
    left: 326px;
    top: 185px;
}


#screen10 .popup8-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 11px;
    left: 19px;
    width: 331px;
    line-height: 22px;
}


#screen10 .popup8-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 11px;
    left: 19px;
    width: 331px;
    line-height: 22px;
    display:none;
}


#screen10 .popup8-text3{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 11px;
    left: 19px;
    width: 331px;
    line-height: 22px;
    display: none;
}


.didwhat-btn2{
    left: 384px;
    top: 242px;
    display:none;
}


.list2{
    left: 355px;
    top: 223px;
    display: none;
}


.list2 .choise{    
    height: 23px;
    width: 80px;
}
   

.didwhat-btn3{
    left: 441px;
    top: 263px;
    display:none;
}


.list3{
    left: 415px;
    top: 241px;
}


.list3 .choise{    
    height: 23px;
    width: 85px;
}



#screen10 .popup9{
    background:url(../images/screen10/greenpop.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 280px;
    height: 139px;
    left: 36px;
    top: 182px;
}


#screen10 .popup9-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 17px;
    width: 245px;
    line-height: 18px;
}


#screen10 .popup9-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 17px;
    width: 245px;
    line-height: 18px;
    display:none;
}

#screen10 .popup9-text3{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 17px;
    width: 245px;
    line-height: 18px;
    display:none;
}


#screen10 .popup9-text4{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 17px;
    width: 245px;
    line-height: 18px;
    display: none;
}


#screen10 .popup10{
    background:url(../images/screen10/popup4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 200px;
    height: 136px;
    left: 122px;
    top: 23px;
    display: none;
}


#screen10 .popup10-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 23px;
    left: 44px;
    width: 148px;
    line-height: 17px;
}

#screen10 .popup10-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 23px;
    left: 44px;
    width: 148px;
    line-height: 17px;
    display: none;
}


#screen10 .popup11{
    background:url(../images/screen10/popup5.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 186px;
    height: 101px;
    left: 136px;
    top: 81px;
	display: none;
}


#screen10 .popup11-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 23px;
    left: 39px;
    width: 148px;
    line-height: 17px;
}



/*------------------------------------screen10 bluepopup3------------------------------------*/

#screen10 .bluepop3{
    background:url(../images/screen8/bluepopup5.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display: none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen10 .popup12{
    background:url(../images/screen10/popup6.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 366px;
    height: 100px;
    left: 129px;
    top: 42px;
}


#screen10 .popup12-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 15px;
    left: 46px;
    width: 119px;
    line-height: 17px;
}


#screen10 .popup12-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 15px;
    left: 207px;
    width: 148px;
    line-height: 17px;
}



#screen10 .popup13{
    background:url(../images/screen10/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 471px;
    height: 92px;
    left: 106px;
    top: 260px;
}


#screen10 .popup13-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 12px;
    left: 47px;
    width: 358px;
    line-height: 22px;
}


#screen10 .popup13-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 12px;
    left: 47px;
    width: 358px;
    line-height: 22px;
    display:none;
}


#screen10 .popup13-text3{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 12px;
    left: 47px;
    width: 358px;
    line-height: 22px;
    display: none;
}



.didwhat-btn4{
    left: 287px;
    top: 273px;
    display:none;
}


.list4{
    left: 274px;
    top: 252px;
    display: none;
}


.list4 .choise{    
    height: 23px;
    width: 80px;
}


.didwhat-btn5{
     left: 153px;
    top: 296px;
    display:none;
}


.list5{
    left: 137px;
    top: 276px;
    display: none;
}


.list5 .choise{    
    height: 23px;
    width: 80px;
}


#screen10 .popup14{
    background:url(../images/screen10/greenpop2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 183px;
    height: 139px;
    left: 506px;
    top: 26px;
    display: none;
}


#screen10 .popup14-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 9px;
    left: 12px;
    width: 161px;
    line-height: 18px;
}


#screen10 .popup14-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 9px;
    left: 12px;
    width: 161px;
    line-height: 18px;
    display:none;
}


#screen10 .popup15{
    background:url(../images/screen10/greenpop2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 183px;
    height: 139px;
    left: 417px;
    top: 26px;
    display: none;
}


#screen10 .popup15-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 9px;
    left: 12px;
    width: 161px;
    line-height: 18px;
}


#screen10 .popup15-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 9px;
    left: 12px;
    width: 161px;
    line-height: 18px;
    display:none;
}


#screen10 .man1{
    background:url(../images/screen8/men1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 123px;
    height: 140px;
    left: 31px;
    top: 23px;
    transform: rotate(13deg);
    -webkit-transform: rotate(13deg);
    -moz-transform: rotate(13deg);
    -ms-transform: rotate(13deg);
    -o-transform: rotate(13deg);
}


#screen10 .popup16{
    background:url(../images/screen10/popup7.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 272px;
    height: 104px;
    left: 129px;
    top: 40px;
    display: none;
}


#screen10 .popup16-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 16px;
    left: 46px;
    width: 211px;
    line-height: 18px;
}


#screen10 .popup17{
    background:url(../images/screen10/popup8.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    top: 22px;
    left: 149px;
    width: 423px;
    height: 143px;
    display: none;
}


#screen10 .popup17-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 48px;
    width: 372px;
    line-height: 15px;
}


/*------------------------------------screen11------------------------------------*/

#screen11{
    background:url(../images/screen11/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen11 .aboutad-btn{
    top: 264px;
    left: 163px;        
}


#screen11 .aboutad-text{
    top: 9px;
    left: 26px; 
}


.bgpopuptext1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 113px;
    left: 84px;
    width: 316px;
    line-height: 19px;
}


/*------------------------------------orangepopup------------------------------------*/

.pinkpopup{
    background:url(../images/screen11/pinkpopup.svg) no-repeat;
    background-size:100% 100%;
    position:absolute;
    display:none;
}


#screen11 .text1 {
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 17px;
    top: 41px;
    left: 196px;
}

#screen11 .text2 {
    font-size: 14px;
    top: 101px;
    left: 193px;
    width: 164px;
}
   

#screen11 .replay2-btn {
    left: 278px;
    bottom: 50px;
}


#screen11 .cross-btn {
    left: 660px;
    top: 24px;  
}


#video3{
    position: absolute;
    top: 88px;
    left: 382px;
    width: 289px;
    height: 229px;
}


/*------------------------------------screen12------------------------------------*/

#screen12{
    background:url(../images/screen4/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen12 .aboutad-btn{
    width: 241px;
    height: 40px;
    left: 461px;
    top: 567px;
}
       

#screen12 .aboutad-text{
    top: 9px;
    left: 22px;
    width: 214px;   
}


/*------------------------------------screen12 bluepopup1------------------------------------*/

#screen12 .blpopup1{
    background:url(../images/screen8/bluepopup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display:none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen12 .men1{
    background:url(../images/screen8/men2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 39px;
    top: 35px;
    transform: rotate(14deg);
    -webkit-transform: rotate(14deg);
    -moz-transform: rotate(14deg);
    -ms-transform: rotate(14deg);
    -o-transform: rotate(14deg);
}


#screen12 .men2{
    background:url(../images/screen12/man2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 39px;
    top: 35px;
}


#screen12 .popup1{
    background:url(../images/screen12/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 210px;
    height: 157px;
    top: 40px;
    left: 141px;
}


#screen12 .popup1-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 34px;
    width: 163px;
    line-height: 15px;
}


#screen12 .popup3{
    background:url(../images/screen12/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 292px;
    height: 134px;
    top: 159px;
    left: 350px;
}


#screen12 .popup3-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 13px;
    width: 272px;
    line-height: 20px;
}

#screen12 .popup3-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 13px;
    width: 272px;
    line-height: 20px;
    display: none;
}


.connective-btn{
    position: absolute;
    background-color: #FEE7A5;
    border:1px solid #000000;
    width: 113px;
    height: 18px;
}


.connective-btn span{
    position: absolute;
    font-family: 'Conv_comicbd';
    font-size: 14px;
    color: #003399;
    top: -1px;
    left: 1px;
    width: 111px;
}


.connective-btn:hover, .connective-btn:focus{
    background-color:#00CC33;
    border:1px solid #000000; 
}


.connective-btn:active{
    background-color:#80E699;
    border:1px solid #000000;
}


.connective-btn1{
    top: 176px;
    left: 361px;
}


.list6{
    left: 379px;
    top: 158px;
    display: none;
}


.list6 .choise {    
    height: 23px;
    width: 75px;
}


#screen12 .popup4{
    background:url(../images/screen12/greenpop.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 272px;
    height: 142px;
    left: 51px;
    top: 206px;
    display: none;
}


#screen12 .popup4-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 252px;
    line-height: 17px;
}


#screen12 .popup4-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 252px;
    line-height: 17px;
    display:none;
}


#screen12 .popup5{
    background:url(../images/screen12/popup3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 169px;
    height: 91px;
    top: 68px;
    left: 140px;    
    display: none;
}


#screen12 .popup5-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 34px;
}


#screen12 .popup6{
    background:url(../images/screen12/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 292px;
    height: 112px;
    top: 159px;
    left: 350px;
}


#screen12 .popup6-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 15px;
    left: 13px;
    width: 272px;
    line-height: 20px;
}


/*------------------------------------screen12 bluepopup2------------------------------------*/

#screen12 .blpopup2{
    background:url(../images/screen10/contantpop2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display:none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen12 .men3{
    background:url(../images/screen8/men1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 26px;
    top: 32px;
    transform: rotate(2deg);
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    -o-transform: rotate(2deg);
}


#screen12 .popup6{
    background:url(../images/screen12/popup4.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 204px;
    height: 165px;
    top: 33px;
    left: 122px;
}


#screen12 .popup6-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 15px;
    left: 38px;
    width: 146px;
    line-height: 16px;
}


#screen12 .popup7{
    background:url(../images/screen12/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 372px;
    height: 134px;
    top: 183px;
    left: 327px;
}


#screen12 .popup7-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 18px;
    left: 13px;
    width: 324px;
    line-height: 20px;
}


.connective-btn2{
    top: 242px;
    left: 340px;
}


.list7{
    left: 354px;
    top: 220px;
    display: none;
}


.list7 .choise {    
    height: 23px;
    width: 78px;
}


#screen12 .popup8{
    background:url(../images/screen12/greenpop.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 272px;
    height: 142px;
    left: 33px;
    top: 206px;
}


#screen12 .popup8-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 252px;
    line-height: 17px;
}


#screen12 .popup8-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 252px;
    line-height: 17px;
    display:none;   
}


#screen12 .popup9{
    background:url(../images/screen12/popup5.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 169px;
    height: 91px;
    top: 76px;
    left: 133px; 
	display: none;	
}


#screen12 .popup9-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 35px;
    width: 132px;
}



#screen12 .popup10{
    background:url(../images/screen12/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 372px;
    height: 108px;
    top: 183px;
    left: 327px;
    display: none;
}


#screen12 .popup10-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 14px;
    left: 13px;
    width: 324px;
    line-height: 20px;
}


/*------------------------------------screen12 bluepopup3------------------------------------*/

#screen12 .blpopup3{
    background:url(../images/screen8/bluepopup3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display:none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}


#screen12 .men4{
    background:url(../images/screen8/men2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
    left: 41px;
    top: 36px;
    transform: rotate(13deg);
    -webkit-transform: rotate(13deg);
    -moz-transform: rotate(13deg);
    -ms-transform: rotate(13deg);
    -o-transform: rotate(13deg);
}
   

#screen12 .popup11{
    background:url(../images/screen12/popup6.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 210px;
    height: 112px;
    top: 50px;
    left: 141px;
}


#screen12 .popup11-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 15px;
    left: 38px;
    width: 161px;
    line-height: 16px;
}


#screen12 .popup12{
    background:url(../images/screen12/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 262px;
    height: 108px;
    top: 179px;
    left: 402px;
}


#screen12 .popup12-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 14px;
    left: 15px;
    width: 229px;
    line-height: 20px;
}


#screen12 .popup12-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 14px;
    color: #000000;
    top: 14px;
    left: 15px;
    width: 229px;
    line-height: 20px;
    display:none;
}


.connective-btn3{
    top: 194px;
    left: 418px;
    display:none;
}


.list8{
    left: 426px;
    top: 173px;
    display: none;
}


.list8 .choise {    
    height: 23px;
    width: 80px;
}


#screen12 .popup13{
    background:url(../images/screen12/greenpop.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 272px;
    height: 142px;
    left: 98px;
    top: 191px;
    display: none;
}


#screen12 .popup13-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 252px;
    line-height: 17px;
}


#screen12 .popup13-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 252px;
    line-height: 17px;
    display:none;
}


#screen12 .popup14{
    background:url(../images/screen12/popup8.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 169px;
    height: 91px;
    top: 67px;
    left: 140px;
    display: none;  
}


#screen12 .popup14-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 38px;
    width: 126px;
}




/*------------------------------------screen12 bluepopup4------------------------------------*/

#screen12 .blpopup4{
    background:url(../images/screen8/bluepopup5.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 722px;
    height: 376px;
    left: 49px;
    top: 60px;
    z-index:9;
    display: none;
    transform:scale(0.05);
    -webkit-transform:scale(0.05);
    -moz-transform:scale(0.05);
    -ms-transform:scale(0.05);
    -o-transform:scale(0.05);
    transition:transform 1s;
    -webkit-transition:transform 1s;
    -moz-transition:transform 1s;
    -ms-transition:transform 1s;
    -o-transition:transform 1s;
}



#screen12 .men5{
    background:url(../images/screen8/men2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 125px;
    height: 140px;
	left: 31px;
    top: 22px;
    transform: rotate(13deg);
    -webkit-transform: rotate(13deg);
    -moz-transform: rotate(13deg);
    -ms-transform: rotate(13deg);
    -o-transform: rotate(13deg);
}


#screen12 .popup15{
    background:url(../images/screen12/popup9.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 296px;
    height: 105px;
    top: 40px;
    left: 126px;
}


#screen12 .popup15-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 13px;
    left: 43px;
    width: 239px;
    line-height: 16px;
}


#screen12 .popup16{
    background:url(../images/screen12/popup2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 476px;
    height: 94px;
    top: 255px;
    left: 103px;
}


#screen12 .popup16-text1{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 16px;
    left: 43px;
    width: 378px;
    line-height: 22px;
}


#screen12 .popup16-text2{
    position: absolute;
    font-family: 'Conv_comic';
    font-size: 15px;
    color: #000000;
    top: 16px;
    left: 43px;
    width: 378px;
    line-height: 22px;
    display: none;
}



.connective-btn4{
    top: 273px;
    left: 146px;
    display:none;
}


.list9{
    left: 144px;
    top: 251px;
    display: none;
}


.list9 .choise {    
    height: 23px;
    width: 107px;
}


#screen12 .popup17{
    background:url(../images/screen12/greenpop.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 272px;
    height: 142px;
    left: 430px;
    top: 19px;
    display: none;
}


#screen12 .popup17-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 252px;
    line-height: 17px;
}


#screen12 .popup17-text2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 19px;
    left: 17px;
    width: 239px;
    line-height: 17px;
    display:none;
}


#screen12 .popup18{
    background:url(../images/screen12/popup10.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 175px;
    height: 91px;
    top: 51px;
    left: 151px;
    display: none;  
}


#screen12 .popup18-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 44px;
    width: 126px;
}


/*------------------------------------screen13------------------------------------*/

#screen13 {
    background:url(../images/screen13/screen13bg.png) no-repeat;
    background-size:100% 100%;
    
}

#screen13 .scrn13txt {
    position: absolute;
    height: 134px;
    width: 270px;
    top: 86px;
    left: 118px;
    
}

#screen13 .scrn13txt span {
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 13px;
    left: 6px;
    width: 260px;
    line-height: 17px;
    
}


/*------------------------------------screen14------------------------------------*/
#screen14 {
    background:url(../images/screen4/bg.png) no-repeat;
    background-size:100% 100%;
}


#screen14 .yellowpopup{
    background: url(../images/screen14/yellowpopup.svg) no-repeat;
    background-size: 100% 100%;
    position: absolute;
    width: 658px;
    height: 91px;
    left: 44px;
    top: 8px;
}

#screen14 .yellowpopup .txt1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 17px;
    left: 12px;
    width: 313px;
    line-height: 17px;
}

#screen14 .yellowpopup .txt2{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 25px;
    left: 351px;
    width: 268px;
    line-height: 1.4;
}


#screen14  .men1{
    background:url(../images/screen4/menpic.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 108px;
    height: 123px;
    right: 23px;
    top: 0px;
}

#screen14 .txtbox0{
    background: url(../images/screen12/popup2.svg) no-repeat;
    background-size: 100% 100%;
    position: absolute;
    width: 227px;
    height: 74px;
    right: 93px;
    bottom: 60px;
    z-index: 1;
}

#screen14 .txtbox0 textarea{
    position: absolute;
    width: 213px;
    height: 59px;
    top: 7px;
    left: 6px;
    resize: none;
    border: none;
    font-family: 'Conv_comic';
    font-size: 15px;
    overflow: hidden;
}

textarea::-webkit-input-placeholder{
    color:#000000;
    font-family: 'Conv_comic';

}

textarea:focus, input:focus{
    outline: none;
}

textarea::selection{
    background-color: #000000;
    color: white; 
}

/*------------------------------------screen15------------------------------------*/

#screen15{
    background:url(../images/screen15/screen15bg.png) no-repeat;
    background-size:100% 100%;  
}


.uptxt{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    
}


.uptxt1{
    top: 23px;
    left: 43px;
    width: 154px;
}


.uptxt2{
    top: 23px;
    left: 230px;
    width: 228px;
}


.uptxt3{
    top: 23px;
    left: 507px;
    width: 143px;
}


.righttxt{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 13px;
    color: #000000;
    line-height: 18px;
    
}


.righttxt1{
    top: 125px;
    left: 433px;
    width: 361px;
    word-spacing: -1px;
}


.righttxt2{
    top: 190px;
    left: 436px;
    width: 367px;
    word-spacing: -1px;
}


.righttxt3{
    top: 255px;
    left: 436px;
    width: 357px;
    word-spacing: -1px;
}


.righttxt4{
    top: 337px;
    left: 434px;
    width: 357px;
    word-spacing: -1px;
}


.righttxt5{
    top: 401px;
    left: 435px;
    width: 357px;
    word-spacing: -1px;
}


.righttxt6{
    bottom: 70px;
    left: 435px;
    width: 330px;
    word-spacing: -1px;
    line-height: 20px;
	word-break: break-word;
    height: 60px;
}


#screen15 .righttitle{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 13px;
    color: #000000;
    top: 100px;
    left: 564px;
}


#screen15 .lefttitle{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 13px;
    color: #000000;
    top: 100px;
    left: 164px;
    width: 360px;
}

#screen15 .lefttxt{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 13px;
    color: #000000;
    top: 125px;
    left: 39px;
    width: 360px;
    
}




#screen15 .green{
    background: linear-gradient(white 0%, #78f58b 40%);
    border: solid 1px #959284;
    border-radius: 15px;
    padding: 0 4px;
}

#screen15 .purple{
    background: linear-gradient(white 0%, #b67bdc 40%);
    border: solid 1px #8b63a6;
    border-radius: 15px;
    padding: 0 4px;
}


#screen15 .orange{
    background: linear-gradient(white 0%, #efb556 40%);
    border: solid 1px #b6aa95;
    border-radius: 15px;
    padding: 0 4px;
}



/*------------------------------------screen16------------------------------------*/

#screen16{
    background:url(../images/screen16/bg.png) no-repeat;
    background-size:100% 100%;  
}




.publish-btn{
    background:url(../images/button/publish/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 131px;
    height: 38px;
    left: 675px;
    bottom: 6px;
}

.publish-btn:hover, .publish-btn:focus{
    background:url(../images/button/publish/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}

.publish-btn:active{
    background:url(../images/button/publish/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.publish-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    left: 36px;
    top: 9px;
}


.cover-btn{
    background:url(../images/button/cover/1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 85px;
    height: 38px;
}


 .cover-btn:not(.disabled):hover, .cover-btn:not(.disabled):focus{
    background:url(../images/button/cover/2.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    transform:scale(1.05);  
    -webkit-transform:scale(1.05);  
    -moz-transform:scale(1.05);  
    -ms-transform:scale(1.05);  
    -o-transform:scale(1.05);  
}


.cover-btn:not(.disabled):active{
    background:url(../images/button/cover/3.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
}


.cover-text{
    position: absolute;
    font-family: 'Conv_verdanab';
    font-size: 15px;
    color: #000000;
    top: 8px;
    left: 11px;
}

.cover-btn1{
    left: 45px;
    top: 332px;
}

.cover-btn2{
    left: 167px;
    top: 332px;
}

.cover-btn3{
    left: 292px;
    top: 332px;
}

.cover-btn4{
    left: 45px;
    top: 501px;
}

.cover-btn5{
    left: 168px;
    top: 501px;
}

.cover-btn6{
    left: 291px;
    top: 501px;
}


#screen16 .popup1{
    background:url(../images/screen16/popup1.svg) no-repeat;
    background-size:100% 100%;
    position: absolute;
    width: 303px;
    height: 188px;
    top: 17px;
    left: 109px;
}


#screen16 .popup1-text1{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 14px;
    left: 37px;
    width: 272px;
    line-height: 19px;
}


.pic{
    position: absolute;
    width: 360px;
    height: 487px;
    top: 42px;
    left: 414px;
    display: none;
}

.pic1{
    background:url(../images/screen16/pic1.svg) no-repeat;
    background-size:100% 100%;
    display: block;
}


.pic2{
    background:url(../images/screen16/pic2.svg) no-repeat;
    background-size:100% 100%;
}

.pic3{
    background:url(../images/screen16/pic3.svg) no-repeat;
    background-size:100% 100%;
}

.pic4{
    background:url(../images/screen16/pic4.svg) no-repeat;
    background-size:100% 100%;
}

.pic5{
    background:url(../images/screen16/pic5.svg) no-repeat;
    background-size:100% 100%;
}

.pic6{
    background:url(../images/screen16/pic6.svg) no-repeat;
    background-size:100% 100%;
}


.txtbox textarea{
    position: absolute;
    width: 309px;
    height: 52px;
    top: 413px;
    left: 440px;
    font-size:22px;
    resize: none;
    border: none;
    font-family: 'Conv_comicbd';
    transform: rotate(6deg);
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    box-shadow: 0px 0px 6px 3px rgba(0,0,0,0.75);
    text-align:center;
    line-height:52px;
    overflow:hidden;
}


.txtbox textarea::-webkit-input-placeholder{
    font-family: 'Conv_comicbd';    
}


textarea:focus, input:focus{
    outline: none;
}


 .txtbox1 textarea{
    position: absolute;
    width: 150px;
    height: 40px;
    line-height:40px;
    top: 464px;
    left: 451px;
    resize: none;
    border: none;
    font-size: 15px;
    transform: rotate(-4deg);
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    box-shadow: 0px 0px 6px 3px rgba(0,0,0,0.75);
    text-align: center;
    overflow:hidden;
    
}


textarea:focus, input:focus{
    outline: none;

}


/*------------------------------------screen17------------------------------------*/

#screen17{
    background:url(../images/screen17/bg.png) no-repeat;
    background-size:100% 100%;  
}


.cover-btn7{
    left: 711px;
    top: 568px;
}

.cover-btn7 .cover-text{
    left: 22px;
}


#screen17 .pic{
    position: absolute;
    width: 360px;
    height: 487px;
    top: 32px;
    left: 26px;
}


#screen17 .txtbox textarea {
    top: 395px;
    left: 56px;
    cursor: default;
}
   

#screen17 .txtbox1 textarea {
    cursor: default;
    top: 449px;
    left: 71px;
}


#screen17 .right-text{
    position: absolute;
    font-family: 'Conv_verdana';
    font-size: 14px;
    color: #000000;
    top: 74px;
    left: 615px;
    width: 173px;
    line-height: 19px;
}

    

/*------------------------------------footer------------------------------------*/

.footer {
    position: absolute;
    top: 620px;
    min-width: 816px;
    height: 50px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}


.footer .fter{
    position:relative;
    width:816px;
    margin:auto;
}


.footer .copyright {
    position: relative;
    text-align: center;
    font-size: 12px;
    margin-top: 0px;
    font-family: arial;
}


.footer .logo{
    position: absolute;
    top: 0;
    left: 0;
    width: 108px;
    height:48px;
    background: url('../images/support_files/tlf_logo.png') no-repeat;
    cursor:pointer;
}


.footer .link {
    position: absolute;
    width: 88px;
    height:31px;
    background: url('../images/support_files/link.png') no-repeat;
    top:0;
    right:0;
    cursor:pointer;
}

.footer .link a {
    position:absolute;
    width: 88px;
    height:31px;
}


@media print{
    .one{
        background-color: #ffffff !important;
        -webkit-print-color-adjust: exact ;
        -ms-print-color-adjust: exact ;
        -moz-print-color-adjust: exact ;
        -o-print-color-adjust: exact ;
        print-color-adjust: exact ;
    }

}