* {
    margin: 0;
    padding: 0;
    font-size: .16rem;
    line-height: .3rem;
    list-style: none;
    text-decoration: none;
    box-sizing: border-box;
}

.input {
    color: #333;
}
.layout {
    width: 14rem;
    margin: 0 auto;
}
body {
    width: 100%;
    /*height: 100vh;*/
    background: url(../images/webpageback.png) no-repeat;
    background-size: cover;
    font-family: Source Han Sans CN;
}
.pagetitle a {
    font-size: .24rem;
    line-height: .32rem;
    color: #fff;
}
.pagetitle {
    width: 50%;
}

.logo-in {
    margin: 0;
    width: 50%;
}
.w-nav li a {
    font-size: .18rem;
    line-height: .24rem;
    color: #fff;
}
.login-member {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: .3rem;
    width:1.5rem;
    float:left;
    padding-top:0.03rem;
}
.logo-in a{
    font-size: .14rem;
    line-height: .24rem;
    color: #fff;
}
.logo-in a:nth-child(1)::after {
    content: "|";
    font-size: .14rem;
    color: #fff;
    margin: 0 .1rem;
}
.page-pack {
    height: 1rem;
    display: flex;
    /* justify-content: space-between; */
    align-items: center;
}
.navlist {
    width: calc(100% - 40% - 1.8rem);
    margin-left: 1.8rem;
}
.pagetitle {
    width: calc(100% - 74%);
}
.w-nav {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.memberInfo {
    width: calc(100% - 73% - 1.8rem);
}
.logo-in {
    width: 100%;
    text-align: right;
}

.cont-back {
    width: 100%;
    background: #333333;
    display: flex;
    position: relative;
}
.cot-img {
    width: 49%;
    padding: 0 1.2rem .7rem .9rem;
}
.cot-img .imgs {
    width: 4.76rem;
    position: relative;
}
.cot-img img {
    width: 100%;
}
.cont-text {
    width: calc(100% - 49%);
    padding-right: .5rem;
    padding-top: .99rem;
}
.cont-text h3 {
    font-size: .4rem;
    line-height: .53rem;
    color: #fff;
    font-weight: 500;
    font-family: Source Han Sans CN;
}
.cont-text h3 span {
    font-size: .21rem;
    line-height: .28rem;
    margin-left: .29rem;
    font-weight: 500;
}
    .cont-text p {
        font-size: .21rem;
        line-height: .28rem;
        margin-top: .2rem;
        padding-bottom: .28rem;
        border-bottom: .01rem solid #606060;
        color: #fff;
    }
.cont-text ul {
    margin-top: .66rem;
}
.cont-text ul li {
    font-size: .16rem;
    line-height: .4rem;
    display: flex;
    color:#fff;
}
.cont-text ul li::before {
    content: "";
    width: 9px;
    height: 9px;
    display: block;
    border-radius: 100%;
    background: #fff;
    margin-top: .16rem;
    margin-right: .16rem;
}
.cot-img .imgs a {
    width: .89rem;
    height: 1rem;
    display: block;
    background: #002081;
    position: absolute;
    bottom: -.15rem;
    right: .3rem;
}
.cot-img .imgs a i {
    width: .34rem;
    height: .29rem;
    background: url(../images/arrow.png) no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.cot-img div:nth-child(2) a {
    width: .08rem;
    height: .48rem;
    background: url(../images/din.png) no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: .24rem;
    left: .34rem;
}
.back-color {
    width: 6.18rem;
    height: 100vh;
    background: #002081;
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
}
.back-img1 {
    width: 1.33rem;
    height: 4.72rem;
    position: absolute;
    top: .05rem;
    left: 0;
}
.back-img1 img {
    width: 100%;
    height: 100%;
}
.back-img2 {
    width: 1.33rem;
    height: 5.72rem;
    position: absolute;
    top: 1.595rem;
    left: -.65rem;
    z-index: 99;
}
.back-img2 img {
    width: 100%;
    height: 100%;
}
.bar {
    width: 0.69rem;
    height: .05rem;
    background: #fff;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.bars {
    width: .89rem;
    height: .05rem;
    background: #002081;
    position: absolute;
    top: 0;
    right: .5rem;
}
.logoin {
    width: 6.88rem;
    background: #333333;
    border-radius: .2rem;
}
.logoin ul {
    width: 100%;
    display: flex;
    border-bottom: .01rem solid #000000;
}
.logoin ul li {
    width: 50%;
    height: .90rem;
    text-align: center;
    font-size: .24rem;
    line-height: .9rem;
    cursor: pointer;
}
.input {
    width: 100%;
    padding: .51rem .69rem .5rem .69rem;
}
.input div {
    width: 5.5rem;
    height: .6rem;
    border-radius: .04rem;
    background: #fff;
    display: flex;
}
.input3 {
    margin-top: .3rem;
}
.input2 {
    padding: .18rem .19rem ;
}
.input2 i {
    width: .19rem;
    height: .21rem;
    background: url(../images/user.png) no-repeat;
    background-size: 100% 100%;
    display: block;
    margin-right: .16rem;
}
.input2 input {
    width: calc(100% - .19rem - .16rem);
    border: none;
    outline: none;
    color: #333;
}
.input3 {
    padding: .18rem .19rem;
}
.input3 i {
    width: .14rem;
    height: .21rem;
    background: url(../images/ICON-2.png) no-repeat;
    background-size: 100% 100%;
    display: block;
    margin-right: .18rem;
}
.input3 input {
    width: calc(100% - .14rem - .18rem);
    border: none;
    outline: none;
    color:#333;
}
.input .input4 {
    border: none;
    
}
.input4 li:first-child {
    text-align: left;
    display: flex;
    align-items: center;
}
.input4 li:last-child {
    text-align: right;
}
.input4 input {
    width: 16px;
    height: 16px;
    border-radius: .04rem;
    border: none;
    margin-right: .04rem;
}
.btn {
    width: 100%;
    height: .6rem;
    text-align: center;
    line-height: .6rem;
    border-radius: .04rem;
    font-size: .18rem;
    background: #002081;
    border:none;
    outline: none;
    cursor: pointer;
    margin-top: .5rem;
}
.btn:active {
    opacity: .8;
}
.logoin {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.input4 li {
    font-size: .14rem !important;
    height: auto !important;
    line-height: .144rem !important;
    margin-top: .17rem;
}
.input5 {
    margin-top: .3rem;
    background: none !important;
}
.input5 input {
    padding: .18rem .19rem;
    color: #333;
    border: none;
    outline: none;
    border-radius: .04rem;
    width: 3.88rem;
    margin-right: .14rem;
}
.input {
    display: none;
}
.w-nav .border {
    border-top: .05rem solid #fff;
    padding-top: .3rem;
    margin-bottom: .35rem;
}
.title {
    width: 12rem;
    background: #333;
    padding: .45rem .4rem .49rem;
}
.title-top {
    width: 100%;
    padding-bottom: .12rem;
    border-bottom: .01rem solid #606060;
}
.title-top span {
    font-size: .24rem;
    line-height: .32rem;
    margin-right: .32rem;
}
.title-top input {
    width: 80%;
    border: none;
    outline: none;
    background: none;
}
.title-cont {
    width: 100%;
    margin-top: .3rem;
    padding: .17rem .2rem;
    border-radius: .1rem;
    /*background: #fff;*/
}
.title-cont textarea {
    border: none;
    outline: none;
    width: 100%;
    height: 100%;
    color: #333;
    resize:none;
}
.title-btn {
    width: 1.5rem;
    height: .5rem;
    text-align: center;
    line-height: .5rem;
    background: #E55437;
    font-size: .16rem;
    font-family: Segoe UI;
    border: none;
    outline: none;
    border-radius: .05rem;
    margin-top: .3rem;
}
.title {
    position: fixed;
    top: 1.6rem;
    left: 50%;
    transform: translateX(-50%);
}
.down {
    padding-top: .4rem;
}
.down ul {
    overflow: hidden;
    margin: 0 -.08rem;
}
.down li {
    width: 50%;
    padding: 0.1rem .08rem;
    float: left;
}
.down li a {
    width: 100%;
    height: .8rem;
    display: block;
    background: #333333;
    border-radius: .1rem;
    display: flex;
    align-items: center;
    padding: 0 .3rem 0 .28rem;
}
.down-img {
    width: .3rem;
    height: .34rem;
}
.down-img img {
    width: 100%;
}
.down-btn {
    width: 1.5rem;
    height: .4rem;
    text-align: center;
    line-height: .4rem;
    background: none;
    border-radius: .2rem;
    border-color: #fff;
    font-size: .14rem;
    font-family: Segoe UI;
    color: #fff;
}
.down-title {
    width: 70%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-left: .16rem;
    padding-right: .3rem;
    color: #fff;
}
.down li a:hover .down-btn{
    background: #fff;
    color:#002081;
}
.list {
    width: 12rem;
    height: 6.87rem;
    background: #333333;
    position: relative;
    top: .7rem;
    left: 50%;
    transform: translateX(-50%);
    padding: .45rem .4rem;
}
.list ul {
    width: 100%;
    height: 100%;
    overflow: auto;
    scrollbar-color:red blue;
}
.list ul::-webkit-scrollbar {
    width: .05rem;
}
.list ul::-webkit-scrollbar-track  {
    background: none;
}
.list ul::-webkit-scrollbar-thumb {
    background: #606060;
    border-radius: .2rem;
}
    .list li {
        width: 100%;
        padding-bottom: .13rem;
        border-bottom: .01rem solid #606060;
        margin-bottom: .17rem;
    }
.content {
    width: 12rem;
    position: absolute;
    top: 1.27rem;
    left: 50%;
    transform: translateX(-50%);
    padding-bottom: .93rem;
}
.list li a {
    display: flex;
    justify-content: space-between;
}
.list-title, .time {
    font-size: .16rem;
    line-height: .21rem;
    color: #fff;
}
.cont-icon {
    display: flex;
    width: 100%;
    justify-content: flex-end;
}
.cont-icon li {
    margin-left: .03rem;
}
.cont-icon li a {
    width: 0.4rem;
    height: .4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: .02rem;
}
.content-text {
    width: 100%;
    padding: .45rem .6rem .49rem .53rem;
    background: #333;
}
.content-text  h4 {
    font-size: .24rem ;
    line-height: .32rem;
    text-align: center;
    margin-bottom: .52rem;
}
.content-text p {
    font-size: .16rem;
    line-height: .3rem;
}
.li-cont {
    width: 12rem;
    margin: .7rem auto .69rem;
    padding: .53rem .6rem .21rem .53rem;
    background: #333;
}
    .li-cont h3 {
        font-size: .24rem;
        line-height: .32rem;
        text-align: center;
        margin-bottom: .17rem;
        color: #fff;
    }
.renwu {
    width: 3.25rem;
    height: .35rem;
    line-height: .35rem;
    margin: 0 auto;
    display: flex;
}
.renwu span {
    font-size: .16rem ;
    display: block;
    width: 50%;
    text-align: center;
    color:#fff;
    overflow:hidden;
}
.renwu span:first-child {
    background: #002081;
}
.renwu span:last-child {
    background: #E55437;
}
.li-cont ul {
    margin-top: .6rem;
}
.li-cont ul li a {
    font-size: .18rem;
    line-height: .24rem;
}
.tab-cont p{
    font-size: .14rem ;
    line-height: .28rem;
    margin-top: .3rem;
}
.catalogue {
    margin-top: .3rem;
    padding-bottom: .5rem;
    border-bottom: .01rem solid #606060;
}
.catalogue p {
    font-size: .14rem;
    line-height: .24rem;
}
.btn1,.btn2 span {
    width: .8rem;
    height: .3rem;
    text-align: center;
    line-height: .3rem;
    font-size: .14rem;
    display: block;
    cursor: pointer;
}
.btn2 {
    display: flex;
}
.btn1 {
    margin-bottom: .2rem;
}
.btn1,.btn2 span:first-child {
    background: #E55437;
}
.btn2 span:nth-child(2),.btn2 span:nth-child(3) {
    background: #fff;
    color: #666;
    margin-left: .05rem;
}
.cata-btn {
    padding: .305rem 0 .255rem;
    border-bottom: .01rem solid #606060;
}
.document {
    padding: .305rem 0;
    border-bottom: .01rem solid #606060;
}
.document p {
    width: .8rem;
    height: .3rem;
    text-align: center;
    line-height: .3rem;
    font-size: .14rem;
    background-color: #002081;
}
.document ul {
    margin-top: .22rem;
}
.document ul li {
    display: flex;
    font-size: .14rem;
}
.document ul li::before
 {
    content: "";
    width: 5px;
    height: 5px;
    background: #fff;
    border-radius: 100%;
    display: block;
    margin-top: .12rem;
    margin-right: .15rem;
 }
 .ping-img {
    width: .46rem;
    height: .46rem;
    border-radius: 100%;
    margin-right: .3rem;
 }
 .ping-img img {
    /*width: 100%;*/
    border-radius: 100%;
 }
 .pinlun ul {
    margin-top: 0;
 }
    .pinlun ul li {
        margin-top: .25rem;
        color: #fff;
    }
.pinlun li a {
    display: flex;
    align-items: center;
    color: #fff;
}
 .ping-cont-top {
    display: flex;
    align-items: center;
 }
    .ping-cont-top span:first-child {
        /*width: .3rem;*/
        height: .2rem;
        text-align: center;
        background: #E55437;
        font-size: .14rem;
        line-height: .2rem;
        display: block;
        margin-right: .05rem;
        padding: 0 0.2rem;
    }
 .ping-cont-top span:last-child {
    /* width: 1.44rem; */
    padding: 0 .12rem;
    height: .2rem;
    text-align: center;
    line-height: .2rem;
    background: #E5E5E5;
    font-size: .14rem;
    display: block;
    color: #666;
 }
 .ping-cont p {
    font-size: .14rem;
    line-height: .19rem;
    margin-top: .1rem;
 }
 .pinlun {
    padding-top: .305rem;
    padding-bottom: .2rem;
 }
 .ttt {
    padding-bottom: .5rem;
    border-bottom: .01rem solid #606060;
 }
 .ttt p {
    font-size: .14rem;
    line-height: .24rem;
 }
 .liuyan {
    padding-top: .285rem;
 }
    .liuyan p {
        font-size: .16rem;
        line-height: .21rem;
        color: #fff;
    }
 .liuyan div {
    width: 100%;
    height: .85rem;
    border-radius: .1rem;
    background: #fff;
    padding: .1rem;
    margin-top: .17rem;
 }
 .liuyan textarea {
    resize: none;
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    color: #333;
    border-radius: .1rem;
 }
 .liuyan input {
    width: 1.2rem;
    height: .4rem;
    text-align: center;
    line-height: .4rem;
    background: #E55437;
    border-radius: .05rem;
    border: none;
    outline: none;
    margin-top: .2rem;
    cursor: pointer;
 }
.pinlun * {
    font-size: .14rem;
    color: #fff;
}
 .icon {
    display: none;
 }
 @media (max-width:768px) {
    .layout {
        width: 100%;
    }
    body{
        height:100vh;
    }
    .cont-back {
        display: block;
    }
    .cot-img {
        width: 100%;
        padding-top: .3rem;
    }
    .cont-text {
        width: 100%;
        padding: .3rem .2rem;
    }
    .back-color {
        display: none;
    }
    .bars {
        display: none;
    }
    .navlist {
        width: 100%;
        margin: 0;
        position: absolute;
        left: 0;
        
    }
    .w-nav {
        display: none;
        position: absolute;
        background: #000;
        top: .5rem;
        left: 0;
        z-index: 2;
        padding: .3rem .2rem;
    }
    .w-nav li {
        padding: .1rem 0;
    }
    .w-nav li a {
        font-size: .28rem;
        line-height: .4rem;
    }
    .icon {
        display: block;
        width: .4rem;
        height: .4rem;
        position: absolute;
        top: 50%;
        right: .2rem;
        transform: translateY(-50%);
    }
    .icon i {
        width: .4rem;
        height: .4rem;
        display: block;
    }
    .icon .cha {
        background: url(../images/cha.png) no-repeat;
        background-size: 100% 100%;
        display: none;
    }
    .icon .dao {
        background:url(../images/dao.png) no-repeat;
        background-size: 100% 100%;
        display: block;
    }
    .page-pack {
        width: 100%;
        padding: 0 1.5rem 0 0.2rem;
        justify-content: space-between;
    }
    .logo-in {
        margin: 0;
    }
    .cot-img .imgs {
        width: 100%;
    }
    .cont-text p {
        margin-top: .1rem ;
        padding-bottom:.1rem;
    }
    .cont-text ul {
        margin-top: .2rem;
    }
    .back-img2 {
        display: none;
    }
    .li-cont {
        width: 100%;
        padding: .3rem .2rem;
        margin: 0;
    }
    .renwu {
        width: 100%;
        height: .5rem;
    }
    .renwu span {
        font-size: .28rem;
        line-height: .5rem;
    }
    .li-cont h3 {
        font-size: .35rem;
        line-height: .6rem;
    }
    .li-cont ul {
        margin-top: .2rem;
    }
    .li-cont ul li a {
        font-size: .28rem;
        line-height: .4rem;
    }
    .tab-cont p {
        font-size: .26rem;
        line-height: .35rem;
        margin-top: .2rem;
    }
    .cont-text h3 span,.cont-text p {
        font-size: .3rem;
        line-height: .45rem;
    }
    .cont-text ul li {
        font-size: .28rem;
        line-height: .4rem;
    }
    .catalogue p {
        font-size: .26rem ;
        line-height: .35rem;
    }
    .btn1, .btn2 span,.document p {
        width: 1.5rem;
        height: .5rem;
        line-height: .5rem;
        font-size: .26rem;
    }
    .document ul li {
        font-size: .26rem ;
        line-height: .35rem;
    }
    .pinlun * {
        font-size: .26rem;
        line-height: .35rem;
    }
    .ping-cont-top span:first-child {
        /*width: .5rem;*/
        height: .3rem;
        line-height: .3rem;
    }
    .ping-cont-top span:last-child {
        height: .3rem;
        line-height: .3rem;
    }
    .ping-cont p {
        font-size: .26rem;
        line-height: .35rem;
    }
    .ping-img {
        width: .8rem;
        height: .8rem;
    }
    .down ul {
        width: 100%;
        margin: 0 ;
        padding: 0 .2rem;
    }
    .down li {
        width: 100%;
    }
    .down-btn {
        height: .5rem;
        line-height: .5rem;
        border-radius: .25rem;
    }
    .down-title {
        font-size: .26rem;
        width:auto;
        padding-right: .6rem;
    }
    .down-img {
        width: .4rem;
        height: .44rem;
    }
    .down {
        padding-bottom: .4rem;
    }
    .content {
        width: 100%;
        position: initial;
        transform: translateX(0);
        /* padding: .3rem 0; */
    }
    .cont-icon {
        justify-content: center;
    }
    .cont-icon li {
        margin-left: .1rem;
    }
    .cont-icon li a {
        width: .8rem;
        height: .8rem;
    }
    .content-text h4 {
        width: 100%;
        padding: 0 .3rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: .35rem;
        line-height: .6rem;
    }
    .content-text p {
        font-size: .28rem;
        line-height: .4rem;
    }
    .content-text {
        padding: .3rem .2rem;
    }
    .logoin {
        top: 5rem;
        
    }
    .list {
        width: 100%;
        height:auto;
    }
    .list-title {
        width: 60%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .list-title, .time {
        font-size: .28rem;
        line-height: .4rem;
    }
    .title-top input {
        width: 70%;
        font-size: .24rem;
    }
    .title {
        width: 95%;
        height:80vh;
        overflow:auto;
    }
    .liuyan p {
        font-size: .28rem;
        line-height: .4rem;
    }
    .liuyan div {
        height: 1rem;
    }
    .liuyan input {
        width: 1.5rem;
        line-height: .5rem;
        height: .5rem;
        font-size: .26rem;
    }
    .liuyan textarea {
        font-size: .26rem;
    }
    .title-top span {
        font-size: .3rem;
        line-height: .45rem;
    }
    .title-cont textarea {
        font-size: .26rem;
        line-height: .35rem;
    }
    .title-btn {
        font-size: .28rem;
    }
    .w-header {
        position: relative;
    } 
    .w-nav .border {
        padding: .1rem 0;
        margin: 0;
        border: none;
    }
    .logo-in a {
        font-size: .26rem;
        line-height: .35rem;
    }
    .cont-text ul li i {
        display: block;
        width: 9px;
        height: 9px;
        border-radius: 100%;
        background: #fff;
        margin-top: 0.16rem;
        margin-right: 0.16rem;
    }
    .cont-text ul li:nth-child(5)::before {
        padding-right: .09rem;
    }
    .list ul {
        overflow:initial;
    }
    .pagetitle {
        width:50%;
    }
    .memberInfo {
        width: 50%;
    }
    .title-cont {
        height:60vh;
        overflow:auto;
    }
 }