body {
    padding: 0;
    margin: 0;
}

input {
    outline: none;
    width: 5.8rem;
    height: 0.65rem;
    line-height: 0.25rem;
	font-size:0.25rem;
    text-align: left;
    border: 1px solid #9bc526;
    border-radius: 0.1rem;
    margin-bottom: 0.24rem;
	text-indent:0.5rem;
	
}
input[type=checkbox]:checked:before{
	color:red;
}

/*  */

#content {
    overflow: hidden;
}

.header {
    background: url('./images/header.png') no-repeat 0 0;
    background-size: 6.4rem 5.45rem;
    width: 6.4rem;
    height: 5.45rem;
}

.header1 {
    background: url('./images/header.jpg') no-repeat 0 0;
    background-size: 6.4rem 2.01rem;
    width: 6.4rem;
    height: 2.01rem;
}

.footer {
    background: url('./images/footer.png') no-repeat 0 0;
    background-size: 6.4rem 2.39rem;
    width: 6.4rem;
    height: 2.39rem;
}

.footer1 {
    background: url('./images/footer.jpg') no-repeat 0 0;
    background-size: 6.4rem 4.22rem;
    width: 6.4rem;
    height: 4.22rem;
}
/* pages */

.pages {
    overflow: hidden;
}

.pages .page-1 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: url('./images/page-bg.png') no-repeat 0 0;
    background-size: 6.4rem 2.76rem;
    width: 6.4rem;
    min-height: 2.76rem;
}

.pages .page-1-code {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: url('./images/bg1.jpg') no-repeat 0 0;
    background-size: 6.4rem 3.65rem;
    width: 6.4rem;
    min-height: 3.65rem;
}
.pages .page-2 {
   /* display: flex;*/
    flex-direction: column;
    justify-content: center;
    align-items: left;
    background: url('./images/page-bg2.png') no-repeat 0 0;
    background-size: 6.4rem 2.53rem;
    width: 6.4rem;
    min-height: 2.53rem;
}
.pages .page-2-code {
   display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: left;
    background: url('./images/bg2.jpg') no-repeat 0 0;
    background-size: 6.4rem 1.05rem;
    width: 6.4rem;
    min-height: 1.05rem;
}
.pages .page-3 {
    /*display: flex;*/
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: url('./images/page-bg3.png') no-repeat 0 0;
    background-size: 6.4rem 2.38rem;
    width: 6.4rem;
    min-height: 2.38rem;
}
.pages .page-3-code {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: url('./images/bg3.jpg') no-repeat 0 0;
    background-size: 6.4rem 1.01rem;
    width: 6.4rem;
    min-height: 1.01rem;
}

/* page-1 

.pages .page-1 .page-1-0 {
    background: url('./images/page-1-0.png') no-repeat 0 0;
    background-size: 5.56rem 4.01rem;
    width: 5.56rem;
    height: 4.01rem;
}*/

.pages .page-1 .page-1-1 {
    width: 1.59rem;
    height: 0.36rem;
    font-size: 0.22rem;
    color: #fc5217;
    line-height: 0.42rem;
}

.pages .page-1 .page-1-11 {
    background: url('./images/page-1-11.png') no-repeat 0 0;
    background-size: 1.59rem 0.36rem;
}

.pages .page-1 .page-1-12 {
    background: url('./images/page-1-12.png') no-repeat 0 0;
    background-size: 1.59rem 0.36rem;
}

.pages .page-1 .page-1-13 {
    background: url('./images/page-1-13.png') no-repeat 0 0;
    background-size: 1.59rem 0.36rem;
}

.pages .page-1 .page-1-14 {
    background: url('./images/page-1-14.png') no-repeat 0 0;
    background-size: 1.59rem 0.36rem;
}

.pages .page-1 .page-1-1 span {
    font-size: 0.42rem;
    margin: 0 0.2em;
    font-style: italic;
    vertical-align: bottom;
}

.pages .page-1 .page-1-2 {
    background: url('./images/page-1-2.png') no-repeat 0 0;
    background-size: 4.03rem 0.47rem;
    width: 4.03rem;
    height: 0.47rem;
    font-size: 0.22rem;
    color: #1e82e3;
    text-align: center;
    margin-bottom: 0.32rem;
}

.pages .page-1 .page-1-3 {
    background: url('./images/page-1-3.png') no-repeat 0 0;
    background-size: 5rem 0.75rem;
    width: 5rem;
    height: 0.75rem;
}


/* layer alert */

.layer {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.8);
    z-index: 77;
    visibility: hidden;
}

.layer-alert {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.layer-alert .alert-info {
    background: url(./images/alert-info-bg.png) no-repeat center center;
    background-size: 5.03rem 6.23rem;
    width: 5.03rem;
    height: 6.23rem;
    display: none;
}

.layer-alert .alert-rule {
    background: url(./images/alert-rule-bg.png) no-repeat center center;
    background-size: 5.03rem 7.4rem;
    width: 5.03rem;
    height: 7.4rem;
    display: none;
}


/* layer-loading */

.layer-loading {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    background: #fff;
    z-index: 77;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.layer-loading .layer-loading--box {
    width: 72vw;
    height: 0.08rem;
    background: #efefef;
}

.layer-loading .layer-loading--box .box-content {
    width: 0%;
    height: 0.08rem;
    background: #d3d3d3;
}


/*  */

.icon-arrow {
    background: url('./images/icon-arrow.png') no-repeat 0 0;
    background-size: 0.48rem 0.36rem;
    width: 0.48rem;
    height: 0.36rem;
    position: fixed;
    bottom: 0.48rem;
    left: 50%;
    margin-left: -0.24rem;

    animation:icon_arrow_down 1.2s infinite ease-in-out;
}

@keyframes icon_arrow_down {
    0%,
    100% {
        bottom: 0.24rem;
        opacity: 0
    }
    50% {
        bottom: 0.48rem;
        opacity: 1
    }
}


@keyframes dot_rotate {
    0%,
    100% {
        /* opacity: 0 */
        transform: rotate(0deg);
    }
    50% {
        /* opacity: 1 */
        transform: rotate(30deg);
    }
}