nav{
    padding-right:20%;
}
nav p,nav>div{
    display:inline-block;
}
nav>div{
    float:right;
}
nav>div span:last-child{
    margin-left:2rem;
}
.navSpan{
    padding-bottom:.5rem;
    border-bottom:2px solid red;
}
section{
    width:800px;margin:0 auto 0;
}
section aside{
    box-sizing:border-box;
    padding:2rem 1rem;
    margin-top:3rem;
    background-color:#F3F3F3;
    width:100%;
}
.navTitle a{
    color:#666666;
}
aside{
    display:flex;
    justify-content: space-between;
}
aside>div:last-child{
    width:180px;
    margin-left:3rem;
    text-align:right;
}
aside h1{
    margin-top:1rem;
    margin-bottom:.8rem;
    font-size:18px;
    font-weight:600;
    color:#333333;
}
aside span{
    font-size:16px;
    color:#666666;
    font-family: MicrosoftYaHei;
}
aside p{
    font-size:14px;
    color:#666666;
}
aside>div:last-child span{
    display:inline-block;
    margin-top:1rem; 
}
aside button{
    width:90px;height:35px;
    margin-top:1rem;
    border-radius:50px 50px;
    outline: none;
    border:1px solid #999999;
    background-color:transparent;
    color:#666666;
}
button.buttonAction{
    background-color:#DB0000;
    color:#fff;
    border:none;
}
footer{
    margin:3rem;
    padding-right:20%;
    text-align:right;
}
footer a{
    color:#000;
    display:inline-block;
    width:28px;height:28px;
    line-height:28px;
    text-align:center;
    border:1px solid #F0F0F0;
    font-size:14px;
}
.proAction{
    background-color:#DB0000;
    color:#fff;
}
@media screen and (max-width:840px){
    aside{
        flex-wrap: wrap;
    }
    section{
        width:100% !important;
    }
    aside>div{
        width:100% !important;
    }
    aside>div:last-child span{
        margin-right:5rem;
    }
    aside>div:last-child{
        text-align:right;
    }
    aside button{
        margin-left:1rem;
    }
}
@media screen and (max-width:520px){
    section aside{
        margin-top:3px;
    }
}