*{
    margin:0px;
    padding:0px;
}
img{
    display:block;
}
a,a:hover {
    text-decoration: none;
}
body
{
    margin: 0px;
    font-size:14px;
    font-family:'Arial Normal','Arial';
    font-size: 62.5%;/*10 ÷ 16 × 100% = 62.5%*/
    width:100%;
    background-color:#000;
}

.cont2_a{
    margin-left:45%;
    margin-top:46.1%;
    padding-top:10%;
    width: 10%;
    display: block;
    position: absolute;
    border-radius:50%;
    z-index: 3;
    opacity: 0.5;
    background-color: red;
}
#light{
    margin-left:25%;
    margin-top:89.8%;
    width: 49.7%;
    display: block;
    position: absolute;
    float:none;
    z-index: 10;
}
#top{
    margin-left:35.5%;
    margin-top:5%;
    width: 29%;
    display: block;
    position: absolute;
    float:none;
    z-index: 9;

}

#pcCode{
    margin-left:26%;
    margin-top:10%;
    width:50%;
    display: block;
    position: absolute;
}


#stop{
    margin-left:67%;
    margin-top:13%;
    border-radius:50%;
    width: 5%;
    display: block;
    position: absolute;
    z-index: 3;
}

#modal-1{
    width: 80%;
    height: 80%;
}

#modal-1-1{
    width: 100%;
    height: 100%;
}


.title {
    position: relative;
    width: 100%;
    height: 100%;
    background-image: url(../img/phone/header.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.characters {
    position: relative;
    width: 100%;
    height: 100%;
    background-image:url(../img/phone/body.png);
    background-repeat:no-repeat;
    background-size:100% 100%;
}


.news {
    position: relative;
    width: 100%;
    height: 100%;
    background-image: url(../img/phone/foot.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;

}
.img100{
    width:100%;
}

.cont0{
}

.cont0 #icon2{
    position: absolute;
    width: 20%;
    margin-left: 2%;
}

.cont0 #dnow{
    position: absolute;
    width: 31%;
    margin-left: 65%;
    top: 2%;
}

.cont1{
}

.cont1 .logo{
    position: absolute;
    top: 77%;
    width: 35%;
    margin-left: 34%;
}

.cont1 #play{
    position: absolute;
    top: 52%;
    width: 35%;
    margin-left: 45.5%;
}

.cont2 #apk{
    position: absolute;
    top: 90%;
    width: 33%;
    margin-left: 51%;
}

.cont2 #app{
    position: absolute;
    top: 90%;
    width: 32%;
    margin-left: 17%;
}

.cont3{
    position: absolute;
    top: 9%;
}

.cont4{
}
.cont4 img{
    position: absolute;
    top: 55%;
    width: 14%;
}
.cont4 #img41{
    margin-left: 8%;
    filter: grayscale(1);
    z-index:7;
}
.cont4 #img42{
    margin-left: 23%;
    filter: grayscale(1);
    z-index:8;
}
.cont4 #img43{
    width: 24%;
    margin-top: -7%;
    margin-left: 37%;
    filter: grayscale(0);
    z-index:9;
}
.cont4 #img44{
    margin-left: 62%;
    filter: grayscale(1);
    z-index:8;
}
.cont4 #img45{
    margin-left: 79%;
    filter: grayscale(1);
    z-index:7;
}

.cont5{
    position: absolute;
    top: 56%;
    width: 100%;
}
.cont5 .left{
    width: 7%;
    float: left;
}
.cont5 .right{
    width: 7%;
    float: right;
}

.cont6{
    margin-left: 5%;
    width: 90%;
    position: absolute;
    top: 66%;
}

.cont910{
    position: absolute;
    top: 31%;
}
.cont10{
    transition-duration: 1000ms;
    transform:translate3d(0, 0px, 0px);
}

.cont10 div{
    position: relative;
    width:100%;
    padding:2%;
    float:right;
}
#div1{
}

#div2{
    margin-right: -200%;
}
#div3{
    margin-right: -300%;
}
#div4{
    margin-right: -400%;
}
#div5{
    margin-right: -500%;
}

.cont12{
    position: absolute;
    right: 32%;
    top: 61%;
}

.cont12 div{
    display: inline-block;
    margin-left: 23px;
    background-image: url(../img/common/black.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 22px;
    height: 22px;
    vertical-align: middle;
    cursor: pointer;
    transition: all .2s;
}

.cont12 .on{
    display: inline-block;
    margin-left: 23px;
    background-image: url(../img/common/yellow.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 22px;
    height: 22px;
    vertical-align: middle;
    cursor: pointer;
    transition: all .2s;
}

.cont13{
    position: absolute;
    top: 60%;
    width: 70%;
    margin-left: 15%;
}
.cont13 .left{
    width: 7%;
    float: left;

}
.cont13 .right{
    width: 7%;
    float: right;
}

.cont8{
    position: absolute;
    margin-left: 35%;
    width: 30%;
    top: 72%;
}

.cont9{
    position: absolute;
    margin-left: 31%;
    width: 38%;
    top: 78%;
}

.cont14{
    position: absolute;
    top: 97%;
    right: 1%;
    font-size: 12px;
}

.foot0{
    width: 30%;
    position: absolute;
    top: 74%;
    left: 40%;
    color: black;
}

.footer{
    position: absolute;
    top: 98.5%;
    text-align: center;
    width: 100%;
    margin-left: -4%;
    font-size: 12px;
}

.footer a{
    margin-left:5%;
    color: white;
}

#suspendedFrame {
    position: fixed;
    top: 33%;
    width: 172px;
    height: 250px;
    left: 1%;
    z-index: 999;
    cursor:pointer;
}

#leftFixedImage {
    position: absolute;
    width: 40%;
    left: 1%;
    top: 20%;
}

#playImage {
    position: absolute;
    width: 25%;
    top: 43%;
    left: 10%;
}