.show-m {
    display: none !important;
}



@media (max-width: 768px) {
    html {
        font-size: calc(100vw / 7.5);
        background-color: #fff;
        padding-bottom: 2.01rem;
    }

    .show-m {
        display: block !important;
    }

    .hide-m {
        display: none !important;
    }
    .container{
        min-width: auto;
        padding: 0;
        width: auto;
    }

    .banner {
        width: 100%;
        min-width: auto;
    }

    .herf-a {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        width: 100%;
        padding: .56rem 0 0 0;
        justify-content: center;
    }

    .herf-a a {
        width: 2.92rem;
        height: .67rem;
        text-align: center;
        background: url(../images/mobile/blue_select.png) no-repeat center center/100% 100%;
        font-family: Microsoft YaHei;
        font-weight: bold;
        font-size: 0.22rem;
        color: #FFFFFF;
        line-height: 0.61rem;
    }

    .herf-a a+a {
        background: url(../images/mobile/group.png) no-repeat center center/100% 100%;
        color: #155EA1;
    }   
     .complexities{
        width: 6.43rem;
        height: auto;
        min-width: auto;
     }

    .complexities .lt {
        width: 100%;
        padding: .35rem;
        background-color: #f2f2f2;
        border-radius: .2rem;
        margin-top: .44rem;
    }

    .complexities .lt .lt-title {
        font-family: Segoe UI Variable;
        font-weight: bold;
        font-size: 0.33rem;
        color: #155EA1;
        line-height: 0.56rem;
    }

    .complexities .lt img {
        display: none;
        width: 38rem;
    }

    .complexities .lt h1 {
        width: 4.7rem;
        height: 0.23rem;
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.22rem;
        color: #155EA1;
        line-height: 0.3rem;
        margin: .1rem 0 .15rem 0;
    }
    .container p{
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.21rem;
        color: #000000;
        line-height: 0.32rem;
    }
    .participates{
        display: flex!important;
        flex-wrap: wrap;
        width: 6.43rem;
        justify-content: space-between;
        align-items: center;
        margin: .25rem auto 0;
    }
    .participates-item{
        width: 3.1rem;
        height: 2.15rem;
        position: relative;
        padding: .2rem;
        background-color: #f2f2f2;
        border-radius: .2rem;
        overflow: hidden;
    }
    .participates-item-icon{
        width: .65rem;
        display: block;
    }
    .participates-item-arrow{
        width: .6rem;
        position: absolute;
        display: block;
        right: 0;
        top: 0;
        cursor: pointer;
        z-index: 2;
    }
    .participates-item-arrow.group_1,
    .participates-item-arrow.group_3{
        transition: none;
    }
    
    .participates-item h2{
        font-family: Segoe UI Variable;
        font-weight: bold;
        font-size: 0.3rem;
        color: #155EA1;
        line-height: 0.35rem;
        margin-top: .15rem;
        margin-bottom: .2rem;
        
    }
    .participates-item.active{
        width: 100%;
        height: auto;
        margin-bottom: .25rem;
        transition: height 0.4s ease, margin-bottom 0.4s ease;
    }
    .container p.img-p img{
        width: .12rem;
        left: .06rem;
        top: .09rem;
        margin-top: 0;
    }
    .container p.img-p{
        padding-left: .2rem;
    }
    .participates-item-txt{
        max-height: 0;
        overflow: hidden;
        opacity: 0;
    }
    .participates-item.active .participates-item-txt{
        max-height: 50rem;
        opacity: 1;
        transition: max-height 0.5s ease, opacity 0.4s ease;
    }
    .participates-item .group_3,.participates-item.active .group_1{
        display: none;
    }
    .participates-item.active .group_3,.participates-item .group_1{
        display: block;
    }
    .learn{
       width: 6.43rem;
       margin: .42rem auto 0;
       padding: 0 .34rem 0 .38rem;
       display: flex!important;
       align-items: center;
       justify-content: space-between;
       cursor: pointer;
    }
    .learn .group_2{
        width: .28rem;
        display: block;
    }
    .learn.show .group_2{
        transform: rotate(180deg);
        transition: transform 0.4s ease;
    }
    .learn h2{
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap:.23rem;
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.33rem;
        color: #155EA1;
        line-height: 0.37rem;
        margin-bottom: 0;
    }
    .learn h2 img{
        display: block;
        width: .57rem;
    }
    .learn h2 span{
        margin-top: -.06rem;
        font-weight:bold;
    }
    .all-bg{
        width: 6.43rem;
        border-radius: .2rem;
        background-color: #f2f2f2;
        padding:0;
        margin: 0 auto;
        overflow: hidden;
        max-height: 0;
    }
    .all-bg.show{
        max-height: 200rem;
        padding:0 .35rem .35rem;
        margin: .23rem auto  0;
        transition: max-height 0.6s ease, padding 0.4s ease, margin 0.4s ease;
    }
    .color-bg{
        background-color:transparent;
        min-width: auto;
        margin-top:0 ;
        padding: .24rem 0;
        border-bottom: solid #000 1px;
    }
    .all-bg .item{
        gap:0;
    }
    .all-bg .m-color-title{
        display: flex!important;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        cursor: pointer;
    }
    .all-bg .m-color-title h2{
        font-family: Segoe UI Variable;
        font-weight: bold;
        font-size: 0.3rem;
        color: #155EA1;
        line-height: 0.56rem;
        margin-bottom: 0;
        gap:.17rem;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        letter-spacing: -0.02rem;
    }
    .all-bg .m-color-title h2 img{
        display: block;
        height: .5rem;
        width: auto;
    }
    .all-bg .item-txt {
       margin-top: 0;
       max-height: 0;
       opacity: 0;
       overflow: hidden;
    }
    .all-bg .color-bg.item-show .item-txt {
       max-height: 50rem;
       opacity: 1;
       margin-top: .15rem;
       overflow: visible;
       transition: max-height 0.5s ease, opacity 0.4s ease, margin 0.4s ease;
    }
    .all-bg .group_2{
        width: .22rem;
        display: block;
        margin-right: .1rem;
    }
    .all-bg .color-bg.item-show .m-color-title .group_2{
        transform: rotate(180deg);
        transition: transform 0.4s ease;
    }
    .process{
        gap: 0;
        flex-wrap: wrap;
        margin-top: .3rem;
    }
    .process .lt{
        width: 100%;
    }
    .process .lt h2{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap:.23rem;
        font-family: Segoe UI Variable;
        font-weight: bold;
        font-size: 0.3rem;
        color: #155EA1;
        line-height: 0.56rem;
        margin-bottom: .2rem;
        cursor: pointer;
    }
    .process .lt h2 .group_2{
        transition: transform 0.4s ease;
    }
    .process.process-hide .lt h2 .group_2{
        transform: rotate(180deg);
        transition: none;
    }
    .process .lt p{
        width: 100%;
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.21rem;
        color: #000000;
        line-height: 0.29rem;
        max-height: 50rem;
        opacity: 1;
        overflow: hidden;
        transition: max-height 0.5s ease, opacity 0.4s ease, margin 0.4s ease;
    }
    .process.process-hide .lt p{
        max-height: 0;
        opacity: 0;
        margin: 0;
        transition: none;
    }
    .process .rt{
        width: 100%;
        margin-top: .8rem;
        max-height: 50rem;
        opacity: 1;
        overflow: hidden;
        transition: max-height 0.5s ease, opacity 0.4s ease, margin 0.4s ease;
    }
    .process.process-hide .rt{
        max-height: 0;
        opacity: 0;
        margin-top: 0;
        transition: none;
    }
    .process .rt .pro-text{
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        flex-wrap: wrap;
        gap:.2rem;
        margin-bottom: .69rem;
    }
    .process .rt .pro-text div{
        padding: .6rem .25rem .25rem .25rem;
        width: 4.74rem;
        height: 2.24rem;
        position: relative;
        background-color: #fff;
        border: solid #3fb0fd 1px;
        border-radius: .2rem;
        margin-top: .53rem;
    }
    .process .rt .pro-text div img{
        width: 1rem;
        display: block;
        position: absolute;
        top: -.53rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .process .rt .pro-text div h3{
        font-family: Segoe UI Variable;
        font-weight: bold;
        font-size: 0.21rem;
        color: #3E3A39;
        line-height: 0.28rem;
        margin-bottom: .13rem;
        text-align: center;
    }
    .process .rt .pro-text div h4{
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.21rem;
        color: #000000;
        line-height: 0.26rem;
        margin-bottom: 0;
    }
    .pd-top{
        padding: 0;
    }
    .process .rt .pro-text .down-arrow{
        display: block;
        width: .28rem;
        margin-bottom: -.1rem;
    }
    .color-last{
        border-bottom: none;
        border-top: solid #000 1px;
        padding-top: .52rem;
    }
    .register-now{
        position: fixed;
        left: 0;
        width: 100%;
        height: 1.3rem;
        bottom: 0;
        background-color: #fff;
        z-index: 1000;
        display: flex!important;
        align-items: center;
        justify-content: center;
    }
    .register-now a{
        display: flex;
        width: 3.48rem;
        height: .67rem;
        font-family: Microsoft YaHei;
        font-weight: bold;
        font-size: 0.22rem;
        color: #155EA1;
        line-height: 0.43rem;
        align-items: center;
        justify-content: center;
        background: url(../images/mobile/Register_Now.png) no-repeat center top/100% 100%;
        padding-bottom: .06rem;
    }
    .all-bg .join .m-color-title h2 img{
        height: .31rem;
    }
    /* 登录 */
    .login-form-box{
        width: 100%;
        margin-top: .91rem;
    }
    .form-group{
        width: 5.5rem;
        margin: 0 auto .25rem;
        position: relative;
    }
    .form-group input, .form-group select{
        height: 0.69rem;
        padding: 0 .25rem;
        background: url(../images/mobile/login-input.png) no-repeat center top/100% 100%;
        border: none;
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.25rem;
        color: #155EA1;
         border-radius: 0;
    }
    .login-checkbox-line{
        font-family: Segoe UI Variable;
        font-weight: bold;
        font-size: 0.25rem;
        color: #3E3A39;
        line-height: 0.35rem;
        gap:.12rem;
        justify-content: center;
        margin: .5rem  0 ;
    }
    .checkbox-line input{
        width: .3rem;
        height: .3rem;
    }
    .checkbox-line label{
        margin-bottom: 0;
    }
    .form-links{
        margin: .05rem 0 0 0;
        justify-content: center;
    }
    .form-links a{
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.25rem;
        color: #155EA1;
        line-height: 0.31rem;
    }
    .login-action-btns-mobile{
        display: flex!important;
        margin-top: .94rem;
        gap:0;
    }
    .login-action-btns-mobile button{
        width: 3.48rem;
        height: .67rem;
        background: url(../images/mobile/login-btn.png) no-repeat center top/100% 100%;
        font-family: Microsoft YaHei;
        font-weight: bold;
        font-size: 0.25rem;
        color: #155EA1;
        line-height: 0.67rem;
        min-width: auto;
        border-radius: 0;
    }
    nav{
        position: fixed;
        width: 100%;
        left: 0;
        bottom: 0;
        z-index: 100;
        height: 1.26rem;
        background-color: #f2f2f2;
        padding:0;
        gap:0;
        justify-content: space-around;
    }
    nav img{
        width: .56rem;
    }
    nav span{
        width: 1.53rem;
        padding: 0;
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.18rem;
        color: #3E3A39;
        line-height: .28rem;
        border-color: #eaeaea;
        height: auto;
    }
    nav a{
        gap:0.03rem;
    }
    nav div.on span, nav a.on span{
        border-color: #eaeaea;
        color: #145ea0;
        font-weight: bold;
    }

    /* 注册 */
    .form-group label.required,.form-group label.field-title{
        display: none;
    }
    .form-title{
        gap:.28rem;
        font-family: Segoe UI Variable;
        font-weight: bold;
        font-size: 0.36rem;
        color: #155EA1;
        margin: .65rem auto;
        position: relative;
        line-height: 1;
    }
    .form-title .reg-icon{
        width: .4rem;
    }
    .form-title .return-icon{
        width: .43rem;
        position: absolute;
        right: .85rem;
        top:50%;
        transform: translateY(-50%);
    }
    .container p.form-tip{
        font-family: Segoe UI Variable;
        font-weight: normal;
        font-size: 0.25rem;
        color: #3E3A39;
        line-height: 0.3rem;
        margin-top: .04rem;
        padding: 0 .1rem;
    }
    .form-registration{
        margin: 0 auto;
    }
    .form-registration .form-during{
        font-size: 0.25rem;
        line-height: 0.35rem;
    }
    .form-down-arrow{
        position: absolute;
        right: .25rem;
        top: .17rem;
        width: .28rem;
    }
    .form-control:focus{
        box-shadow: none;
    }
    .form-during{
        margin: 0 auto .56rem;
    }
    #step2 .login-checkbox-line{
        justify-content: flex-start;
        margin: .5rem 0 0 0;
    }
    .form-registration{
        width: 5.76rem;
    }
    .btn-primary:hover{
        background-color: transparent;
        border-color: transparent;
        color: #155EA1;
        box-shadow: none;
    }
    .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {
        background-color: transparent;
        border-color: transparent;
        color: #155EA1;
        box-shadow: none;
    }
    p.error-tip{
        margin-top: 0;
        font-family: segoeui;
        font-weight: normal;
        font-size: .25rem;
        color: red;
        line-height: .28rem;
        padding: 0 .1rem;
    }
    #agree-error{
        margin-top: -.0rem!important;
        justify-content: flex-start!important;
        padding-left: .3rem;
    }
    .page-header{
        padding: 0rem;
        min-width: auto;
    }
    .user-nav{
        gap: 0.1rem;
        font-size: 0.32rem;
    }
    .user-nav .user-icon{
        width: 0.35rem;
    }
    .user-nav .arrow-down{
        width: 0.35rem;
        margin-left: 0.1rem;
        margin-right: 0.1rem;
    }
    .user-dropdown{
        right:0rem;
        width: 4rem;
        font-size: 0.4rem;
        line-height: 0.75rem;
        padding: 0.3rem 0;
        border-radius: 0rem 0rem 0rem 0.2rem;
    }
    .user-dropdown a{
        padding-left: 0.5rem;
        font-size: 0.32rem;
        line-height: 0.75rem;
    }

   .swal2-container {
        font-size: 16px !important;
    }

    .swal2-container .swal2-popup,
    .swal2-container .swal2-popup * {
        font-size: 16px !important;
    }
    .footer-component{
        width: 100%;
        min-width: auto;
        margin: .5rem 0 0 0;
        background:#ffffff;
    }
    .footer-component>div{
        padding: 10px;
        justify-content: center;
        line-height: 25px;
    }
    .footer-component>div a{
        word-break: break-all;
        text-wrap-mode: nowrap;
    }
    .spinner-border-sm{
        width: 0.3rem;
        height: 0.3rem;
    }
    .microsoft{
        float: right;
    }
}