@charset "utf-8";

/*内容*/
.main {
    width: 100%;
}

.main_box1 {
    width: 100%;
    height: auto;
}

.main_box2 {
    width: 100%;
    height: auto;
    background: url(https://cdn01.imgs.duolebo.com/dlbimg/3.0.0.0/images/about_bg.png) no-repeat;
    /*background-size: cover;*/
    background-size: 100% auto;
}

.main_wm {
    max-width: 60rem;
    height: 25rem;
    margin: 0 auto;
    padding-top: 5rem;
    border-bottom: 1px solid #ccc;
}

.us {
    width: 100%;
    margin-top: 2rem;
    line-height: 2rem;
    color: #666;
}

.us p {
    width: 30rem;
}

.img_ct {
    float: right;
    width: 23rem;
    margin-top: -5rem;
    margin-right: 2rem;
}

.main_jy {
    /*width: 60rem;*/
    max-width: 60rem;
    height: 41rem;
    margin: 5rem auto 0rem;
    border-bottom: 1px solid #ccc;
}

.mainjy_top {
    /*width: 4.5rem;*/
    max-width: 4.5rem;
    margin: 0 auto;
    text-align: center;
}

.mainjy_top img {
    width: 4.5rem;
}

.mainjy_center {
    max-width: 60rem;
    width: 60rem;
    height: 16rem;
}

.mainjyc_1 {
    width: 28rem;
    max-width: 28rem;
    height: 15.9rem;
    float: left;
    box-sizing: border-box;
}

.mainjyc_img1 {
    float: left;
    margin: 5.3rem 3rem;
}

.mainjyc_img1 img, .mainjyc_img2 img, .mainjyb_img3 img, .mainjyb_img4 img {
    width: 5.4rem;
}

.mainjyc_txt1 {
    float: left;
    margin-top: 3.5rem;
}

.mainjyc_txt1 dd {
    color: #666;
    margin-top: 0.9rem;
}

.mainjyc_txt1 strong {
    color: #333;
}

.mainjyc_2 {
    max-width: 28rem;
    width: 28rem;
    height: 15.9rem;
    float: right;
    box-sizing: border-box;
}

.mainjyc_img2 {
    float: left;
    margin: 2rem 2rem;
}

.mainjyc_txt2 {
    position: relative;
    margin-top: 3.5rem;
}

.mainjyc_txt2 dd {
    color: #666;
    margin-top: 0.9rem;
}

.mainjyc_txt2 strong {
    color: #333;
}

.mainjy_bottom {
    /*width: 60rem;*/
    max-width: 60rem;
    margin-top: 2rem;
}

.mainjyb_3 {
    width: 28rem;
    max-width: 28rem;
    height: 17rem;
    float: left;
    box-sizing: border-box;
}

/*.mainjyb_3:hover{ */
/*	border: 1px solid #ff8531;*/
/*}*/

.mainjyb_img3 {
    float: left;
    margin: 5.3rem 3rem;
}

.mainjyb_txt3 {
    float: left;
    margin-top: 3.5rem;
}

.mainjyb_txt3 dd {
    color: #666;
    margin-top: 0.9rem;
}

.mainjyb_txt3 strong {
    color: #333;
}

.mainjyb_4 {
    width: 28rem;
    max-width: 28rem;
    height: 15.9rem;
    float: right;
    /*margin-left: 6.1rem;*/
    box-sizing: border-box;
}

/*.mainjyb_4:hover{ */
/*	border: 1px solid #ff8531;*/
/*}*/

.mainjyb_img4 {
    float: left;
    margin: 5.3rem 2rem;
}

.mainjyb_txt4 {
    float: left;
    margin-top: 3.5rem;
}

.mainjyb_txt4 dd {
    color: #666;
    margin-top: 0.9rem;
}

.mainjyb_txt4 strong {
    color: #333;
}

.main_zz {
    max-width: 60rem;
    /*width: 60rem;*/
    height: 23rem;
    margin: 5rem auto 0rem;
    border-bottom: 1px solid #ccc;
}

.mainzz_top {
    width: 4.5rem;
    margin: 0 auto;
    text-align: center;
}

.mainzz_top img {
    width: 4.5rem;
}

.mainzzb_img1 img, .mainzzb_img2 img, .mainzzb_img3 img, .mainzzb_img4 img {
    width: 5rem;
}

.mainzz_bottom {
    max-width: 60rem;
    /*width: 60rem;*/
    display: flex;
    justify-content: center;
    height: 14.2rem;
    margin-top: 4rem;
}

.mainzzb_1 {
    float: left;
    /*width: 13.5rem;*/
    max-width: 13.5rem;
    margin-left: 3rem;
    height: 14.2rem;
}

.mainzzb_img1, .mainzzb_img2, .mainzzb_img3, .mainzzb_img4 {
    float: left;
    margin: 2.5rem 3.5rem;
}

.mainzzb_txt1 {
    text-align: center;
    color: #666;
}

.mainzzb_2, .mainzzb_3, .mainzzb_4 {
    float: left;
    /*width: 13.5rem;*/
    max-width: 12rem;
    height: 14.2rem;
    margin-left: 2rem;
}

.mainzzb_txt2 {
    text-align: center;
    color: #666;
}

.mainzzb_txt3 {
    text-align: center;
    /*margin-left:6px;*/
    color: #666;
}

.mainzzb_txt4 {
    text-align: center;
    color: #666;
}

.main_lx {
    max-width: 60rem;
    /*width: 60rem;*/
    height: 20rem;
    margin: 5rem auto 0rem;
}

.mainlx_top {
    width: 4.5rem;
    margin: 0 auto;
    text-align: center;
}

.mainlx_top img {
    width: 4.5rem;
}

.mainlx_center {
    /*width: 60rem;*/
    max-width: 60rem;
    display: flex;
    justify-content: center;
    height: 10.5rem;
    margin-top: 4rem;
}

.mainlxc_1 {
    float: left;
    /*width: 10rem;*/
    max-width: 10rem;
    height: 8.6rem;
}

.mainlxc_img1 img, .mainlxc_img2 img, .mainlxc_img3 img, .mainlxc_img4 img, .mainlxc_img5 img {
    width: 8rem;
}

.mainlxc_txt1, .mainlxc_txt2, .mainlxc_txt3, .mainlxc_txt4, .mainlxc_txt5 {
    text-align: center;
    margin-top: 1.5rem;
    color: #666;
}

.mainlxc_2, .mainlxc_3, .mainlxc_4, .mainlxc_5 {
    float: left;
    /*width: 10rem;*/
    max-width: 10rem;
    height: 8.6rem;
    margin-left: 2.5rem;
}

.join {
    width: 10rem;
    height: 3rem;
    margin: 0 auto;
    border: 1px solid #ff8531;
    background-color: rgba(255, 133, 49, 0.4);
    border-radius: 1.25rem;
    text-align: center;
    line-height: 3rem;
    margin-top: 2rem;
    color: #000;
}

.join:hover {
    color: #ffffff;
    background-color: #ff8531;
}

.mobile_mainlx_bottom {
    display: none;
}

.width_restriction {
    width: 100%;
    height: auto;
}

@media screen and (min-width: 100px) and (max-width: 767px) {

    .main_wm h1, .mainjy_top h2, .mainzz_top h3, .mainlx_top h3 {
        font-size: 3rem;
    }

    .mobile_mainlx_bottom {
        display: block;
    }

    .mainlx_bottom {
        display: none;
    }

    .main_jy, .main_zz {
        border: 0rem;
        margin-top: 7rem;
    }

    .main_jy {
        width: 100%;
        max-width: 100%;
    }

    .img_ct {
        margin-left: 1rem;
        margin-bottom: 1rem;
        margin-top: -8rem;
    }

    .us p {
        width: 100%;
        font-size: 2.5rem;
        line-height: 3rem;
    }

    .main_wm {
        height: 46rem;
        border: 0rem;
        padding-top: 4rem;
    }

    .main_jy, .main_zz, .main_lx {
        height: auto;
    }

    .mainjy_top, .mainzz_top, .mainlx_top {
        width: 100%;
        max-width: 100%;
    }

    .mainjy_center, .mainjy_bottom {
        display: block;
        width: 100%;
        max-width: 100%;
        height: 54rem;
        margin-top: 0rem;
    }

    .mainlx_center {
        width: 100%;
        height: 76rem;
        display: block;
    }

    .mainzz_bottom {
        display: block;
        height: 67rem;
        margin-top: 0rem;
    }

    .width_restriction {
        width: 60rem;
        margin: 0rem auto;
    }

    .mainjyc_1, .mainjyc_2,
    .mainjyb_3, .mainjyb_4 {
        float: none;
        width: 100%;
        max-width: 100%;
        height: 25rem;
        margin-top: 4rem;
    }

    .mainjyc_2, .mainjyb_4 {
        background: url("https://cdn01.imgs.duolebo.com/dlbimg/3.0.0.0/images/about_bar_bg.png") no-repeat;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }

    .mainjyc_1, .mainjyb_3 {
        background: url("https://cdn01.imgs.duolebo.com/dlbimg/3.0.0.0/images/about_bar_bg_right.png") no-repeat;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }

    .mainjyc_img1, .mainjyc_img2,
    .mainjyb_img3, .mainjyb_img4 {
        width: 15rem;
        margin: 5rem;
    }

    .mainjyc_img1 img, .mainjyc_2 img, .mainjyb_img3 img, .mainjyb_img4 img,
    .mainzzb_img1 img, .mainzzb_img2 img, .mainzzb_img3 img, .mainzzb_img4 img,
    .mainlxc_img1 img, .mainlxc_img2 img, .mainlxc_img3 img, .mainlxc_img4 img, .mainlxc_img5 img {
        width: 100%;
    }

    .mainjyc_txt1, .mainjyc_txt2, .mainjyb_txt3, .mainjyb_txt4 {
        float: left;
        height: 21.5rem;
    }

    .mainjyc_img2, .mainjyb_img4 {
        float: right;
        margin-left: 1rem;
    }

    .mainjyc_img2 {
        margin-right: 2rem;
    }

    .mainjyc_txt2 {
        margin-left: 3rem;
    }

    .mainjyb_txt3 {
        margin-top: 1rem;
    }

    .mainjyb_txt4 {
        margin-top: 1rem;
        margin-left: 7rem;
    }

    .mainzzb_img1, .mainzzb_img2, .mainzzb_img3, .mainzzb_img4 {
        float: none;
        width: 20rem;
        margin: 4rem 4rem 1rem 4rem;
    }

    .mainlxc_img1, .mainlxc_img2, .mainlxc_img3, .mainlxc_img4, .mainlxc_img5 {
        float: none;
        width: 26rem;
        margin: 2rem 2rem 1rem 2rem;
    }

    .mainzzb_1, .mainzzb_2, .mainzzb_3, .mainzzb_4,
    .mainlxc_1, .mainlxc_2, .mainlxc_3, .mainlxc_4, .mainlxc_5, .mobile_mainlx_bottom {
        float: left;
        position: relative;
        width: 30rem;
        max-width: 30rem;
        height: 25rem;
        margin: 0rem;
    }

    .mainzzb_1, .mainzzb_2, .mainzzb_3, .mainzzb_4 {
        height: auto;
    }

    .mainzzb_txt1, .mainzzb_txt2, .mainzzb_txt3, .mainzzb_txt4 {
        margin: 0rem 2rem 4rem;
    }

    .join {
        width: 60%;
        height: 4rem;
        text-align: center;
        margin-top: 9rem;
        padding-top: 1rem;
        background-color: #ff8531;
    }

    .join a {
        height: 100%;
        width: 100%;
        font-size: 2.5rem;
        color: #ffffff;
    }

    .mainlxc_txt1, .mainlxc_txt2, .mainlxc_txt3, .mainlxc_txt4, .mainlxc_txt5 {
        margin-bottom: 4rem;
    }

    dd {
        font-size: 2.5rem;
    }

}