.content {
    background: rgb(241, 247, 247);
}

/* ==========================================================================
   蛋白制备首页
   ========================================================================== */
.protein_title {
    color: rgb(0, 134, 209);
    font-size: .36rem;
    font-weight: 700;
    position: relative;
    text-align: center;
}

.protein_title::before {
    content: "";
    position: absolute;
    bottom: -0.2rem;
    left: 50%;
    transform: translateX(-50%);
    width: .8rem;
    height: 1px;
    background: rgb(0, 164, 156);
}
.protein_title a{
    color: rgb(0, 134, 209);
}




/* ———————————————————— 1 ———————————————————— */
.protein_module01 {
    padding: 1rem 0 .8rem;
}

.service_list {
    margin: .6rem 0 0 -0.2rem;
}

.service_list li {
    width: calc(25% - .2rem);
    margin: 0 0 .2rem .2rem;
}

.service_box .pic {
    border: 2px solid rgb(217, 234, 242);
    border-radius: .04rem;
}

.service_process {
    padding: 0 .9rem;
}

.service_week {
    position: relative;
    color: rgb(0, 164, 156);
    font-size: .24rem;
    font-weight: 500;
    text-align: center;
}

.service_week::after,
.service_week::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 26.0417vw;
    height: .06rem;
    background-repeat: no-repeat;
    background-size: auto .06rem;
    /* background: rgb(143, 199, 197); */
}

.service_week::after {
    right: .25rem;
    background-image: url(../protein/line02.png);
    background-position: left;
}

.service_week::before {
    left: .25rem;
    background-image: url(../protein/line01.png);
    background-position: right;
}


.service_list2 {
    margin: .1rem 0 0 -0.2rem;
}

.service_list2 li {
    width: calc(25% - .2rem);
    margin: 0 0 .2rem .2rem;
}

.service_box2 {
    padding: 0 .4rem 0 .2rem;
}

.service_title2 {
    color: rgb(255, 255, 255);
    font-size: .18rem;
    font-weight: 500;
    text-align: center;
    height: .4rem;
    line-height: .4rem;
    position: relative;
    z-index: 1;
}

.service_title2::before {
    content: "";
    position: absolute;
    left: -0.2rem;
    top: 0;
    width: calc(100% + .8rem);
    height: .4rem;
    background: rgb(0, 134, 209);
    z-index: -1;
}

.service_list2 li:nth-child(1) .service_title2::before {
    border-top-left-radius: .04rem;
    border-bottom-left-radius: .04rem;
}

.service_list2 li:nth-child(4) .service_title2::before {
    width: calc(100% + .6rem);
}

.service_list2 li:nth-child(4) .service_title2::after {
    content: "";
    position: absolute;
    right: -0.89rem;
    top: 50%;
    transform: translateY(-50%);
    width: .49rem;
    height: .73rem;
    background: url(../protein/icon08.png) no-repeat;
    background-size: .49rem auto;
}

.service_step2 {
    color: rgb(0, 134, 209);
    font-size: 12px;
    font-weight: 400;
    padding: .1rem 0;
    text-align: center;
    position: relative;
}

.service_step2::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    background: linear-gradient(270.00deg, rgba(0, 164, 156, 0.5), rgba(0, 134, 209, 0.5) 100%);
    width: 100%;
    height: .02rem;
    opacity: 0.3;
}

.service_row2 {
    margin-top: .1rem;
}

.service_row2 h6 {
    color: rgb(102, 102, 102);
    font-size: 12px;
    line-height: 1.7;
    padding-left: 20px;
    position: relative;
}

.service_row2 h6::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 9px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgb(102, 102, 102);
}

@media only screen and (max-width: 768px) {
    .service_list li {
        width: calc(50% - .2rem);
    }

    .service_list2 li {
        width: calc(50% - .2rem);
    }

    .service_list2 li:nth-child(2) .service_title2::before {
        width: calc(100% + .6rem);
    }
}

@media only screen and (max-width: 500px) {
    .service_process {
        padding: 0;
    }

    .service_title2 {
        font-size: 12px;
        height: 24px;
        line-height: 24px;
    }

    .service_title2::before {
        height: 24px;
    }

    .service_list2 li:nth-child(4) .service_title2::after {
        right: -35px;
    }
}





/* ———————————————————— 2 ———————————————————— */
.protein_module02 {
    padding: 1.1rem 0;
    background: url(../protein/expression.png) no-repeat;
    background-size: 100% 100%;
}

.express_list {
    margin: .7rem 0 0 -0.8rem;
}

.express_list>li {
    width: calc(50% - .8rem);
    margin: 0 0 .4rem .8rem;
}

.express_box {
    background: #fff;
    height: 100%;
}

.express_left {
    width: calc(100% - 2.2rem);
    padding: .2rem .5rem 0 .2rem;
}

.express_right {
    width: 2.2rem;
}

.express_title {
    color: rgb(0, 164, 156);
    font-size: .24rem;
    font-weight: 700;
    align-items: center;
}
.express_title a{
 color: rgb(0, 164, 156);
}
.express_title img {
    margin-right: .09rem;
}

.express_list2 {
    margin: 0 0 0 -0.3rem;
}

.express_list2 li {
    width: calc(50% - .3rem);
    margin: 0 0 0 .3rem;
}

.express_line {
    background: url(../protein/line03.png) no-repeat left;
    width: 100%;
    height: .05rem;
    margin: .1rem 0;
    background-size: auto .05rem;
}

.order_name {
    color: rgb(0, 0, 0);
    font-size: 12px;
    font-weight: 500;
    margin-bottom: .1rem;
}

.express_info {
    color: rgb(51, 51, 51);
    font-size: 12px;
    font-weight: 400;
    max-height: calc(12px * 6);
    overflow-y: auto;
}

.express_info::-webkit-scrollbar {
    width: 4px;
    background-color: transparent;
}

.express_info::-webkit-scrollbar-track {
    display: none;
}

.express_info::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: var(--primary);
}

@media only screen and (max-width: 920px) {
    .express_list>li {
        width: 100%;
    }

    .express_left {
        padding: 20px;
    }

    .express_info {
        max-height: 100%;
        overflow-y: initial;
    }
}

@media only screen and (max-width: 500px) {
    .express_list2 li {
        width: 100%;
    }


}





/* ———————————————————— 3 ———————————————————— */
.protein_module03 {
    padding: 1.2rem 0 1.45rem;
}

.yeast_Surface {
    justify-content: space-between;
    margin: .65rem 0 0;
}

.yeast_left {
    width: calc(61% - .2rem);
}

.yeast_right {
    width: 39%;
    background: #fff;
}

.yeast_list {
    margin: -0.2rem 0 0 -0.2rem;
}

.yeast_list li {
    width: calc(50% - .2rem);
    margin: .2rem 0 0 .2rem;
}

.yeast_box {
    border-radius: .2rem;
    background: rgb(0, 134, 209);
    min-height: 1.6rem;
    height: 100%;
    padding: .3rem;
}

.yeast_area {
    margin-left: .3rem;
}

.yeast_title {
    color: rgb(255, 255, 255);
    font-size: .18rem;
    font-weight: 600;
    margin-bottom: .1rem;
}

.yeast_item {
    color: rgb(255, 255, 255);
    font-size: .14rem;
    font-weight: 400;
}

.yeast_icon {
    flex-shrink: 0;
}

.yeast_icon img {
    width: .54rem;
}

@media only screen and (max-width: 1280px) {
    .yeast_item {
        font-size: 12px;
    }
}

@media only screen and (max-width: 768px) {
    .yeast_left {
        width: 100%;
    }

    .yeast_right {
        width: 100%;
        margin-top: .2rem;
        border-radius: .2rem;
    }

    .yeast_right img {
        width: 50%;
    }

    .yeast_title {
        font-size: 14px;
    }
}

@media only screen and (max-width: 500px) {
    .yeast_list li {
        width: 100%;
    }

    .yeast_right img {
        width: 80%;
    }
}






/* ———————————————————— 4 ———————————————————— */
.protein_module04 {
    padding: 1.2rem 0 1.45rem;
    background: rgb(236, 243, 249);
}

.mature_membrane {
    margin: .7rem 0 0;
}

.membrane_left,
.membrane_right {
    display: none;
}

.membrane_mid {
    width: 100%;
}

@media only screen and (max-width: 500px) {

    .membrane_left,
    .membrane_right {
        display: block;
    }

    .membrane_mid {
        display: none;
    }
}





/* ———————————————————— 5 ———————————————————— */
.protein_module05 {
    padding: 1.2rem 0 1.5rem;
}

.facility_instrument {
    justify-content: space-between;
}

.fi_left {
    width: calc(51.5% - .4rem);
}

.fi_right {
    width: 48.5%;
}

.fi_left .protein_title {
    text-align: left;
}

.fi_left .protein_title::before {
    left: 0;
    transform: translateX(0);
}

.fiImg_list {
    margin: -0.2rem 0 0 -0.2rem;
}

.fiImg_list li {
    width: calc(50% - .2rem);
    margin: .2rem 0 0 .2rem;
}

.fi_list {
    max-width: 6.6rem;
    margin: .7rem 0 0;
}

.fi_item {
    padding: .16rem;
    box-sizing: border-box;
    border: 1px solid rgb(186, 220, 238);
    border-radius: .04rem;
    background: rgb(255, 255, 255);
}

.fi_msg {
    color: rgb(0, 0, 0);
    font-size: .2rem;
    line-height: 1.3;
    font-weight: 400;
}

.fi_dian {
    color: #0086D1;
    margin-right: .15rem;
}

.fi_list .fi_item:not(:last-of-type) {
    margin-bottom: .2rem;
}

@media only screen and (max-width: 768px) {
    .fi_left {
        width: 100%;
    }

    .fi_list {
        max-width: 100%;
    }

    .fi_right {
        width: 100%;
        margin-top: 20px;
    }

}

@media only screen and (max-width: 500px) {
    .fi_msg {
        font-size: 12px;
    }
}











/* ==========================================================================
   质粒构建
   ========================================================================== */
.plasmid {
    padding: .4rem 0 1.2rem;
}

.protein_area {
    margin: 0 0 .7rem 0;
}

.protein_area .protein_title {
    text-align: left;
}

.protein_area .protein_title::before {
    left: 0;
    transform: translateX(0);
}

.plasmid_main .plasmid_item:not(:last-of-type) {
    margin-bottom: 1rem;
}

.plasmid_title {
    border-radius: .04rem;
    background: rgb(0, 134, 209) linear-gradient(270.00deg, rgba(0, 164, 156, 0.5), rgba(0, 134, 209, 0.5) 100%);
    color: rgb(255, 255, 255);
    font-size: .3rem;
    font-weight: 700;
    padding: .08rem .25rem;
    margin-bottom: .4rem;
}

.plasmid_area {
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: .3rem .4rem;
    color: rgb(0, 0, 0);
    font-size: .16rem;
    font-weight: 400;
    line-height: 2.4;
}

.plasmidPrice_list {
    margin: -0.25rem 0 0 -0.25rem;
}

.plasmidPrice_list li {
    width: calc(25% - .25rem);
    margin: .25rem 0 0 .25rem;
}

.plasmidPrice_box {
    border: 1px solid rgb(236, 236, 236);
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: .2rem;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}

.plasmidPrice_h5 {
    color: rgb(0, 0, 0);
    font-size: .16rem;
    font-weight: 400;
}

.inquiry {
    padding: .05rem .1rem;
    color: rgb(255, 255, 255);
    font-size: 12px;
    font-weight: 500;
    border-radius: 74px;
    background: rgb(255, 158, 0);
}

.inquiry:hover {
    color: #fff;
}

.plasmid_clone {
    border: .03rem solid rgb(168, 168, 240);
    border-radius: .04rem;
    background: rgb(255, 255, 255);
}

.plasmidClone_bottom {
    color: #666666;
    font-size: .16rem;
    font-weight: 400;
    padding: .15rem 0;
    margin: 0 .4rem;
    border-top: 1px solid rgb(168, 168, 240);
}

.plasmidClone_top {
    padding: .3rem .1rem;
}

.plasmidClone_list li {
    width: 33.33%;
}

.plasmidClone_list li:not(:last-of-type) {
    border-right: 1px solid rgb(168, 168, 240);
}

.plasmidClone_box {
    padding: 0 1.05rem;
}

.plasmidClone_title {
    color: rgb(0, 0, 0);
    font-size: .18rem;
    font-weight: 400;
    text-align: center;
    border-bottom: 1px solid rgb(225, 225, 225);
    padding-bottom: .1rem;
    margin-bottom: .1rem;
}

.plasmidClone_info {
    color: rgb(51, 51, 51);
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    line-height: 2;
}

.plasmid_clone.clone_tag {
    border-color: rgb(106, 179, 214);
}

.clone_tag .plasmidClone_list li:not(:last-of-type) {
    border-color: rgb(106, 179, 214);
}


.signal_peptide {
    border: .03rem solid rgb(0, 180, 209);
    border-radius: 4px;
    background: rgb(255, 255, 255);
    padding: .3rem 1.4rem;
}

.peptide_list {
    justify-content: space-between;
    padding: 0 1.6rem;
}

.peptide_list li {
    width: 33.33%;
    text-align: center;
    color: rgb(51, 51, 51);
    font-size: 14px;
    font-weight: 400;
    line-height: 2.5;
}

@media only screen and (max-width: 1280px) {

    .peptide_list li,
    .plasmidClone_info {
        font-size: 12px;
    }

}

@media only screen and (max-width: 920px) {
    .plasmidPrice_list li {
        width: calc(50% - .25rem);
    }

    .plasmidClone_bottom,
    .plasmid_area,
    .plasmidPrice_h5 {
        font-size: 12px;
    }

    .plasmidClone_box {
        padding: 0 50px;
    }
}

@media only screen and (max-width: 768px) {
    .plasmidClone_box {
        padding: 0 30px;
    }

    .signal_peptide {
        padding: 20px 30px;
    }

    .peptide_list {
        padding: 0 30px;
    }

    .plasmidClone_title {
        font-size: 14px;
    }
}

@media only screen and (max-width: 500px) {
    .plasmidPrice_list li {
        width: 100%;
    }

    .plasmidClone_list li {
        width: 100%;
    }

    .plasmidClone_list li:not(:last-of-type) {
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-right: none;
        border-bottom: 1px solid rgb(168, 168, 240);
    }

    .plasmidClone_top {
        padding: .3rem 0;
    }

    .plasmidClone_box {
        padding: 0 10px;
    }

    .signal_peptide {
        padding: 10px;
    }

    .peptide_list {
        padding: 0;
    }

    .plasmid_main .plasmid_item:not(:last-of-type) {
        margin-bottom: 30px;
    }

    .plasmid {
        padding: 20px 0;
    }
}












/* ==========================================================================
   哺乳动物细胞表达系统
   ========================================================================== */
.mamm_table {
    overflow-x: auto;
}

.mamm_table table {
    min-width: 700px;
}

.mamm_table table td {
    height: .6rem;
    color: rgb(0, 0, 0);
    font-size: 12px;
    font-weight: 400;
    border: 1px solid rgba(225, 225, 225, 0.7);
    padding: .05rem .2rem;
}

.mamm_table table tr:nth-child(odd) {
    background: rgba(210, 225, 233, 0.7);
}

.mamm_table table tr:nth-child(even) {
    background: rgb(255, 255, 255);
}

.mamm_table table tr td:nth-child(1) {
    width: 18%;
}

.mamm_table table tr td:nth-child(2) {
    width: 42%;
}

.mamm_table table tr td:nth-child(3) {
    width: 40%;
}

.mamm_procedure {
    padding: .55rem .7rem;
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    overflow: hidden;
}

.mamm_list {
    margin: 0 0 0 -0.3rem;
}

.mamm_list li {
    width: calc(25% - .3rem);
    margin: 0 0 0 .3rem;
}

.procedure_title {
    position: relative;
    margin-top: .2rem;
    height: 48px;
    color: rgb(0, 134, 209);
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    padding: 0 .1rem;
    z-index: 1;
}

.procedure_title::before {
    content: "";
    position: absolute;
    left: -0.15rem;
    top: 0;
    width: calc(100% + .3rem);
    height: 100%;
    background: url(../protein/step01.png) no-repeat;
    background-size: 100% 100%;
    z-index: -1;
}

.mamm_list li:nth-child(even) .procedure_title {
    color: #fff;
}

.mamm_list li:nth-child(even) .procedure_title::before {
    background-image: url(../protein/step02.png);
}

@media only screen and (max-width: 1280px) {
    .procedure_title {
        height: 40px;
        font-size: 12px;
    }
}

@media only screen and (max-width: 500px) {

    .mamm_procedure {
        padding: 20px;
    }

    .mamm_list {
        margin: -0.3rem 0 0 -0.3rem;
    }

    .mamm_list li {
        width: calc(50% - .3rem);
        margin: 0.3rem 0 0 .3rem;
    }
}










/* ==========================================================================
   昆虫杆状病毒表达系统
   ========================================================================== */
.insect_procedure {
    padding: .45rem .3rem;
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    overflow: hidden;
}

.insect_list {
    margin: 0 0 0 -0.1rem;
}

.insect_list li {
    width: calc(20% - .1rem);
    margin: 0 0 0 .1rem;
}


.insect_list .procedure_title {
    line-height: 1;
}

.insect_list .procedure_title::before {
    left: -0.1rem;
    width: calc(100% + .2rem);
}

.insect_list li:nth-child(odd) .procedure_title {
    color: #fff;
}

.insect_list li:nth-child(odd) .procedure_title::before {
    background-image: url(../protein/step02.png);
}


.instrument_list {
    margin: 0 0 0 -0.25rem;
}

.instrument_list li {
    width: calc(25% - .25rem);
    margin: 0 0 0 .25rem;
}

.instrument_title {
    border-radius: .04rem;
    background: rgb(217, 234, 242);
    padding: .1rem 0;
    text-align: center;
    color: rgb(0, 0, 0);
    font-size: .18rem;
    font-weight: 400;
    margin-bottom: .1rem;
}

.instrument_box .pic {
    border: .03rem solid rgb(217, 234, 242);
    border-radius: .04rem;
}

@media only screen and (max-width: 768px) {
    .instrument_title {
        font-size: 12px;
    }
}

@media only screen and (max-width: 500px) {
    .insect_list li {
        width: calc(33.33% - .1rem);
        margin: 0 0 10px .1rem;
    }

    .instrument_list li {
        width: calc(50% - .25rem);
        margin: 0 0 .25rem .25rem;
    }
}












/* ==========================================================================
   大肠杆菌表达系统
   ========================================================================== */
.ecoli_right {
    flex-shrink: 0;
}

.ecoli_right img {
    width: 2.2rem;
    margin-left: .45rem;
}

.ecoli_procedure {
    overflow: hidden;
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: .45rem .75rem;
}

.ecoli_list li {
    flex: 220;
}

.ecoli_list li:nth-child(2) {
    flex: 515;
    margin: 0 .45rem;
}

.ecoli_list .procedure_title::before {
    left: -0.5rem;
    width: calc(100% + 1rem);
}

.ecoli_list li:nth-child(odd) .procedure_title {
    color: #fff;
}

.ecoli_list li:nth-child(odd) .procedure_title::before {
    background-image: url(../protein/step02.png);
}

.ecoli_list li:nth-child(2) .procedure_title::before {
    width: 100%;
    left: 0;
}

.ecoli_ment {
    margin: 0 0 0 -0.3rem;
}

.ecoli_ment li {
    width: calc(33.33% - .3rem);
    margin: 0 0 0 .3rem;
}

@media only screen and (max-width: 920px) {
    .ecoli_list .procedure_title {
        line-height: 1.2;
    }
}

@media only screen and (max-width: 500px) {
    .ecoli_lr {
        flex-direction: column;
    }

    .ecoli_right img {
        margin-left: 0;
    }

    .ecoli_list li {
        flex: 0 1 auto;
        width: 100%;
    }

    .ecoli_list li .procedure_title::before {
        width: 100%;
        left: 0;
    }

    .ecoli_list li:nth-child(odd) .ecoli_box .pic {
        width: 50%;
        margin: 0 auto;
    }

    .ecoli_list li:nth-child(2) {
        margin: 20px 0;
    }

    .ecoli_procedure {
        padding: 20px;
    }

    .ecoli_ment li {
        width: calc(50% - .3rem);
        margin: 0 0 .3rem .3rem;
    }
}















/* ==========================================================================
   无细胞表达系统
   ========================================================================== */
.advantage_item {
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: .4rem;
}

.advantage_title {
    position: relative;
    width: 2.1rem;
    border-radius: .04rem;
    background: rgb(84, 180, 182);
    padding: .12rem 0;
    color: rgb(255, 255, 255);
    font-size: .2rem;
    font-weight: 500;
}

.advantage_title::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -0.56rem;
    width: .4rem;
    height: 1px;
    background: rgb(194, 231, 229);
}

.advantage_area {
    width: calc(100% - 2.9rem);
    color: rgb(0, 0, 0);
    font-size: .16rem;
    font-weight: 400;
    line-height: 240%;
}

.cell_advantage .advantage_item:nth-child(2) .advantage_title {
    background: rgb(0, 180, 209);
}

.cell_advantage .advantage_item:nth-child(3) .advantage_title {
    background: rgb(106, 179, 214);
}

.advantage_img img {
    width: 100%;
    margin: .2rem 0;
}

.advantageImg_name {
    color: rgb(136, 136, 136);
    font-size: .18rem;
    font-weight: 400;
    text-align: center;
}


.cell_application {
    margin: -0.2rem 0 0 -0.4rem;
}

.cell_application li {
    width: calc(50% - .4rem);
    margin: .2rem 0 0 .4rem;
}

.cellApply_num {
    width: .6rem;
    min-height: .6rem;
    color: rgb(255, 255, 255);
    font-size: .36rem;
    font-weight: 700;
    background: rgb(38, 187, 217);
}

.cellApply_info {
    width: calc(100% - .6rem);
    background: rgb(212, 236, 241);
    color: rgb(0, 0, 0);
    font-size: .16rem;
    font-weight: 400;
    line-height: 120%;
    padding: 0 .2rem;
    align-items: center;
}

.cell_application li:nth-child(2) .cellApply_num {
    background: rgb(125, 196, 232);
}

.cell_application li:nth-child(3) .cellApply_num {
    background: rgb(125, 161, 232);
}

.cell_application li:nth-child(4) .cellApply_num {
    background: rgb(168, 168, 240);
}

.cell_application li:nth-child(2) .cellApply_info {
    background: rgb(217, 234, 242);
}

.cell_application li:nth-child(3) .cellApply_info {
    background: rgb(225, 230, 241);
}

.cell_application li:nth-child(4) .cellApply_info {
    background: rgb(234, 234, 248);
}


.cell_table {
    overflow-x: auto;
    scrollbar-width: thin;
}

.cell_table table {
    min-width: 700px;
}

.cell_table table th,
.cell_table table td {
    border: 1px solid rgba(225, 225, 225, 0.7);
    padding: .1rem .2rem;
}

.cell_table table tr:nth-child(1) {
    background: rgb(0, 164, 156);
}

.cell_table table th {
    color: rgb(255, 255, 255);
    font-size: .16rem;
    font-weight: 500;
    text-align: left;
}

.cell_table table tr:nth-child(3n+1):not(:first-child) {
    background: rgb(228, 241, 241);
}

.cell_table table td {
    color: rgb(0, 0, 0);
    font-size: 12px;
    font-weight: 400;
}

.cell_table table tr:nth-child(2),
.cell_table table tr:nth-child(3),
.cell_table table tr:nth-child(5),
.cell_table table tr:nth-child(6) {
    background: #fff;
}

.cell_table table th:nth-child(1) {
    width: 6.9%;
}

.cell_table table th:nth-child(2) {
    width: 11.4%;
}

.cell_table table th:nth-child(3) {
    width: 34.2%;
}

.cell_table table th:nth-child(4) {
    width: 34%;
}


.cell_experiment {
    margin: 0 0 0 -0.3rem;
}

.cell_experiment li {
    width: calc(33.33% - .3rem);
    margin: 0 0 0 .3rem;
}

.cellExper_box {
    height: 100%;
}

.cellExper_title {
    color: rgb(0, 0, 0);
    font-size: .18rem;
    font-weight: 400;
    border-radius: .04rem;
    line-height: 1.2;
    background: rgb(217, 234, 242);
    text-align: center;
    padding: .1rem 0;
    margin-bottom: .1rem;
}

.cellExper_img {
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: .2rem .2rem .35rem;
    height: calc(100% - .5rem);
}

.cellExper_img .pic {
    border: .04rem solid rgb(217, 234, 242);
    background: rgb(255, 255, 255);
}

.cellExper_area {
    margin-top: .25rem;
    color: rgb(0, 0, 0);
    font-size: .16rem;
    font-weight: 400;
    line-height: 1.25;
    text-align: center;
}

.cell_experiment li:nth-child(2) .cellExper_title {
    position: relative;
}

.cell_experiment li:nth-child(2) .cellExper_title::before {
    content: "";
    position: absolute;
    top: 0;
    right: -0.7rem;
    width: 1.16rem;
    height: 100%;
    background: url(../protein/exper_arr.png) no-repeat;
    background-size: 1.16rem 100%;
}


.example_box {
    padding: .15rem .4rem;
    border-radius: .04rem;
    border: .02rem solid rgb(212, 230, 247);
    background: rgb(255, 255, 255);
    justify-content: space-between;
    align-items: center;
    position: relative;
    cursor: pointer;
    z-index: 1;
}

.example_box::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: .2rem;
    height: 100%;
    background: rgb(212, 230, 247);
    z-index: -1;
    transition: all .3s;
}

.example_box.on::before {
    width: 100%;
}

.example_title {
    color: rgb(0, 0, 0);
    font-size: .2rem;
    font-weight: 400;
}

.example_unfold {
    width: .25rem;
    height: .25rem;
    background: url(../images/unfold.svg) no-repeat center;
    background-size: contain;
}

.example_nwms {
    margin-top: .2rem;
    border: .02rem solid rgb(212, 230, 247);
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: .5rem .6rem;
    display: none;
}

.example_warp {
    color: rgb(0, 0, 0);
    font-size: .16rem;
    font-weight: 400;
    line-height: 240%;
}

.cell_example .example_item:not(:last-of-type) {
    margin-bottom: .2rem;
}

.cellApply_box {
    height: 100%;
}


@media only screen and (max-width: 920px) {
    .advantage_area {
        font-size: 12px;
    }

    .cellApply_info {
        font-size: 12px;
        padding: 5px 10px;
    }

    .cellApply_num {
        height: 100%;
    }

    .cell_table table th {
        font-size: 12px;
    }

    .example_warp,
    .cellExper_title,
    .cellExper_area {
        font-size: 12px;
    }
}

@media only screen and (max-width: 500px) {
    .advantage_title {
        width: 50%;
        font-size: 14px;
    }

    .advantage_area {
        width: 100%;
        margin-top: 10px;
    }

    .cell_application li {
        width: calc(100% - .4rem);
    }

    .cell_experiment li {
        margin: 0 0 .3rem .3rem;
    }

    .cell_experiment li:nth-child(1) {
        width: calc(100% - .3rem);
    }

    .cell_experiment li:nth-child(2),
    .cell_experiment li:nth-child(3) {
        width: calc(50% - .3rem);
    }

    .example_title {
        font-size: 12px;
    }

    .example_nwms {
        padding: 10px 20px;
    }
}













/* ==========================================================================
   蛋白纯化
   ========================================================================== */
.purification_area {
    border-radius: .04rem;
    background: rgb(255, 255, 255);
}

.purific_area {
    margin-top: .4rem;
    padding: .5rem;
    border-radius: .04rem;
    background: rgb(255, 255, 255);
}

.purific_title {
    color: rgb(0, 134, 209);
    font-size: .28rem;
    font-weight: 500;
    line-height: 160%;
    text-align: center;
    padding: 0 .8rem .3rem;
    position: relative;
    margin-bottom: .4rem;
}

.purific_title::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 58.125vw;
    height: .19rem;
    background: url(../protein/purific_line01.png) no-repeat;
    background-size: 58.125vw;
}


.purificImg_list {
    align-items: center;
}

.purificImg_box .pic {
    border-radius: .04rem;
    filter: drop-shadow(-0.12rem .12rem 0px rgb(214, 229, 238));
}

.purificImg_list li:nth-child(1),
.purificImg_list li:nth-child(3) {
    flex: 20;
}

.purificImg_list li:nth-child(2) {
    flex: 23;
    margin: 0 .4rem;
}

.purific05 {
    text-align: center;
}

.purificImg_list2 {
    padding: 0 .7rem;
    margin: -0.3rem 0 0 -0.3rem;
}

.purificImg_list2 li {
    width: calc(33.33% - .3rem);
    margin: .3rem 0 0 .3rem;
}


.quality_area {
    margin-top: .4rem;
}

.quality_module {
    margin-top: .2rem;
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: 0 .4rem;
}

.quality_title {
    padding-left: .4rem;
    color: rgb(0, 164, 156);
    font-size: .2rem;
    font-weight: 500;
    position: relative;
}

.quality_title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: .2rem;
    height: .2rem;
    background: rgb(84, 180, 182);
}


.quality_flex {
    justify-content: space-between;
}

.quality_left {
    width: 3.5rem;
}

.quality_right {
    width: calc(100% - 4.1rem);
    padding: .4rem 0;
}

.quality_sub {
    color: rgb(0, 0, 0);
    font-size: .18rem;
    font-weight: 400;
    padding: .16rem 0 .1rem;
    border-bottom: 1px solid #00A49C;
}

.quality_info {
    padding: .2rem 0;
    color: rgb(51, 51, 51);
    font-size: .14rem;
    font-weight: 400;
    line-height: 200%;
}

.quality_info p {
    padding-left: .2rem;
    position: relative;
}

.quality_info p::before {
    content: "";
    position: absolute;
    left: .08rem;
    top: .12rem;
    width: .04rem;
    height: .04rem;
    background: rgb(51, 51, 51);
    border-radius: 50%;
}

.quality_list {
    margin: -0.2rem 0 0 -0.2rem;
}

.quality_img {
    margin: .2rem 0 0 .2rem;
    border-radius: .04rem;
    background: rgb(248, 248, 248);
    overflow: hidden;
    height: 2rem;
}

.quality_img img {
    max-height: 100%;
}

@media only screen and (max-width: 1600px) {
    .quality_img {
        height: 1.9rem;
    }
}

@media only screen and (max-width: 1280px) {
    .quality_info {
        font-size: 12px;
    }

    .quality_info p {
        padding-left: 15px;
    }

    .quality_info p::before {
        content: "";
        position: absolute;
        left: .08rem;
        top: 11px;
        width: 3px;
        height: 3px;
    }
}

@media only screen and (max-width: 920px) {
    .quality_sub {
        font-size: 14px;
    }

    .purificImg_list2 {
        padding: 0;
    }
}

@media only screen and (max-width: 500px) {
    .purific_title {
        padding: 0 0 .3rem;
    }

    .purificImg_list li {
        flex: 0 1 auto !important;
        margin: 0 0 20px !important;
    }

    .purificImg_list2 li {
        width: calc(100% - .3rem);
    }

    .quality_left {
        width: 100%;
    }

    .quality_right {
        width: 100%;
    }

}













/* ==========================================================================
   膜蛋白
   ========================================================================== */
.membrane_main .membrane_item:not(:last-of-type) {
    margin-bottom: .8rem;
}

.membrane_flow {
    margin: .4rem 0 0 -0.1rem;
}

.memFlow_item {
    margin: 0 0 0 .1rem;
}

.membrane_flow .memFlow_item:nth-child(1),
.membrane_flow .memFlow_item:nth-child(2) {
    width: calc(14.285% - .1rem);
}

.membrane_flow .memFlow_item:nth-child(3) {
    width: calc(42.855% - .1rem);
}

.membrane_flow .memFlow_item:nth-child(4) {
    width: calc(28.57% - .1rem);
}

.memFlow_title {
    border-radius: .04rem;
    background: rgb(84, 180, 182);
    height: .8rem;
    color: rgb(255, 255, 255);
    font-size: .24rem;
    font-weight: 500;
    line-height: 110%;
    text-align: center;
    padding: 0 .1rem;
    margin-bottom: .2rem;
}

.membrane_flow .memFlow_item:nth-child(2) .memFlow_title {
    background: rgb(125, 196, 232);
}

.membrane_flow .memFlow_item:nth-child(3) .memFlow_title {
    background: rgb(125, 161, 232);
}

.membrane_flow .memFlow_item:nth-child(4) .memFlow_title {
    background: rgb(168, 168, 240);
}

.memFlow_box {
    padding: .1rem;
    border: .02rem solid rgb(84, 180, 182);
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    height: calc(100% - 1rem);
}

.membrane_flow .memFlow_item:nth-child(2) .memFlow_box {
    border-color: rgb(125, 196, 232);
}

.membrane_flow .memFlow_item:nth-child(3) .memFlow_box {
    border-color: rgb(125, 161, 232);
}

.membrane_flow .memFlow_item:nth-child(4) .memFlow_box {
    border-color: rgb(168, 168, 240);
}


.memFlow_info {
    color: rgb(51, 51, 51);
    font-size: .14rem;
    line-height: 180%;
}

.pre_dian p {
    padding-left: 15px;
    position: relative;
}

.pre_dian p::before {
    content: "";
    position: absolute;
    left: 5px;
    top: .106rem;
    width: .04rem;
    height: .04rem;
    background: rgb(51, 51, 51);
    border-radius: 50%;
}

.memFlow_name {
    box-sizing: initial;
    color: rgb(0, 0, 0);
    font-size: .14rem;
    line-height: 1;
    font-weight: 400;
    padding: 0 0 .1rem;
    text-align: center;
    height: calc(.14rem * 3);
    border-bottom: 1px solid rgb(84, 180, 182);
}

.memFlow_box .pic {
    margin: .1rem 0 .15rem;
}


.memFlow_list {
    margin: 0 0 0 -0.1rem;
    height: calc(100% - 1rem);
}

.memFlow_list li {
    width: calc(33.33% - .1rem);
    margin: 0 0 0 .1rem;
}

.memFlow_list2 {
    margin: 0 0 0 -0.1rem;
    height: calc(100% - 1rem);
}

.memFlow_list2 li {
    width: calc(50% - .1rem);
    margin: 0 0 0 .1rem;
}

.memFlow_list .memFlow_box,
.memFlow_list2 .memFlow_box {
    height: 100%;
}


.membrane_list {
    margin: 0 0 0 -0.4rem;
}

.membrane_list li {
    width: calc(50% - .4rem);
    margin: .4rem 0 0 .4rem;
}

.membrane_list li:nth-child(n+3) {
    width: calc(33.33% - .4rem);
}

.memChart_title {
    box-sizing: initial;
    border-radius: .04rem;
    background: rgb(217, 234, 242);
    text-align: center;
    color: rgb(0, 0, 0);
    font-size: .18rem;
    font-weight: 400;
    line-height: 120%;
    margin-bottom: .1rem;
    height: .45rem;
}

.memChart_img {
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: .1rem;
}


.membrane_list2 {
    margin: 0 0 0 -0.15rem;
}

.membrane_list2 li {
    width: calc(25% - .15rem);
    margin: .4rem 0 0 .15rem;
}

.membrane_list2 .memChart_title {
    color: rgb(255, 255, 255);
    background: rgb(84, 180, 182);
}


.membrane_pipeline {
    margin-top: .4rem;
}

.membrane_pipeline .memChart_title {
    background: rgb(0, 134, 209);
    color: #fff;
    margin-bottom: .2rem;
}

.membrane_list3 {
    margin: -0.3rem 0 0 -0.3rem;
}

.membrane_list3 li {
    width: calc(33.33% - .3rem);
    margin: .3rem 0 0 .3rem;
}

.pipeline_box {
    border: .02rem solid rgb(0, 134, 209);
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: 0 .3rem;
    height: 100%;
}

.pipeline_title {
    box-sizing: initial;
    text-align: center;
    color: rgb(0, 0, 0);
    font-size: .16rem;
    font-weight: 400;
    line-height: 1.2;
    padding: .1rem 0;
    height: calc(.16rem * 2.4);
    border-bottom: 1px solid rgb(0, 134, 209);
    margin-bottom: .1rem;
}


.membrane_area {
    margin-top: .3rem;
}

.membrane_box {
    margin-top: .2rem;
    border-radius: .04rem;
    background: rgb(255, 255, 255);
    padding: .4rem;
}

.membrane_flex {
    justify-content: center;
}

.assay_box {
    width: 50%;
}

.membrane_flex .assay_box:nth-child(1) {
    padding-right: .8rem;
    border-right: 1px solid rgb(225, 225, 225);
}

.membrane_flex .assay_box:nth-child(2) {
    padding-left: .8rem;
}

.assay_box .memChart_title {
    background: rgb(0, 134, 209);
    font-weight: 500;
    color: #fff;
    width: 4.4rem;
    margin: 0 auto .1rem;
}

.assayChart_name {
    margin-top: .4rem;
    color: rgb(136, 136, 136);
    font-size: .16rem;
    line-height: 120%;
    text-align: center;
}

.tric_title {
    font-size: .24rem;
    font-weight: 500;
    line-height: 120%;
    color: #000;
    text-align: center;
    padding: 0 0 .25rem;
    border-bottom: 1px solid rgb(225, 225, 225);
}

.tric_title span {
    color: #0086D1;
}

.tric_box {
    padding: .45rem 1.2rem;
}

.tric_flex {
    margin: .25rem 0 0;
    justify-content: space-between;
    align-items: center;
    padding: 0 .25rem;
}

.tric_left {
    width: 29%;
}

.tric_right {
    width: calc(71% - .9rem);
}

.tric_right img {
    width: 100%;
}

.tric_wrap {
    padding: .2rem;
    border: .02rem solid rgb(0, 134, 209);
    border-radius: .04rem;
    background: rgb(255, 255, 255);
}

.tric_wrap .pic {
    margin: 0 .45rem;
}

.tric_info {
    color: rgb(51, 51, 51);
    font-size: .14rem;
    line-height: 180%;
}

.tric_name {
    text-align: center;
    color: rgb(136, 136, 136);
    font-size: .14rem;
    font-weight: 400;
    line-height: 120%;
    padding: .2rem 0;
    border-bottom: 1px solid rgb(0, 134, 209);
    margin-bottom: .2rem;
}


.membrane_bottom img {
    width: 100%;
}

.membrane_contact {
    margin-top: .3rem;
    justify-content: space-between;
    align-items: center;
}

.memContact_title {
    color: rgb(0, 134, 209);
    font-size: .3rem;
    font-weight: 500;
    font-style: italic;
}

.membrane_link {
    color: rgb(255, 255, 255);
    font-size: .14rem;
    font-weight: 500;
    width: 1.4rem;
    height: .48rem;
    border-radius: 60px;
    background: rgb(0, 134, 209);
    transition: all .3s;
}

.membrane_link:hover {
    color: #fff;
    transform: translateY(-5px);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

@media only screen and (max-width: 1280px) {
    .membrane_link {
        font-size: 12px;
    }
}

@media only screen and (max-width: 1200px) {
    .assayChart_name {
        font-size: 12px;
    }

    .memFlow_info {
        font-size: 12px;
    }

    .memChart_title {
        font-size: 12px;
        height: 32px;
    }

    .tric_info,
    .tric_name {
        font-size: 12px;
    }

    .pre_dian p::before {
        top: 9.5px;
    }

    .memFlow_name {
        font-size: 12px;
        height: calc(12px * 4);
    }

    .pipeline_title {
        font-size: 12px;
        height: calc(12px * 2.4);
    }
}

@media only screen and (max-width: 920px) {
    .tric_box {
        padding: 25px 50px;
    }

}

@media only screen and (max-width: 768px) {

    .membrane_flow .memFlow_item:nth-child(1),
    .membrane_flow .memFlow_item:nth-child(2) {
        width: calc(50% - .1rem);
    }

    .memFlow_item {
        margin: 0 0 20px .1rem;
    }

    .membrane_flow .memFlow_item:nth-child(3) {
        width: calc(100% - .1rem);
    }

    .membrane_flow .memFlow_item:nth-child(4) {
        width: calc(100% - .1rem);
    }

    .membrane_list2 li {
        width: calc(50% - .15rem);
    }

    .tric_box {
        padding: 20px;
    }

    .membrane_link {
        width: 100px;
        height: 30px;
    }

    .assay_box .memChart_title {
        width: 100%;
    }
}

@media only screen and (max-width: 500px) {
    .membrane_list li {
        width: calc(100% - .4rem) !important;
    }

    .membrane_list3 li {
        width: calc(100% - .3rem);
    }

    .assay_box {
        width: 100%;
    }

    .membrane_flex .assay_box:nth-child(1) {
        padding-right: 0;
        border-right: none;
        margin-bottom: 10px;
    }

    .membrane_flex .assay_box:nth-child(2) {
        padding-left: 0;
    }

    .quality_title {
        font-size: 12px;
    }

    .tric_left {
        width: 100%;
    }

    .tric_right {
        width: 100%;
        margin-top: 20px;
    }

    .membrane_contact {
        flex-direction: column;
    }

    .membrane_link {
        margin-top: 10px;
    }

    .plasmid_area {
        line-height: 2;
    }
}











/* ==========================================================================
   纳米抗体筛选
   ========================================================================== */
.nanobody_area {
    padding: .5rem;
    border-radius: .2rem;
    background: rgb(255, 255, 255);
}

.qa_circle {
    flex-shrink: 0;
    width: .3rem;
    height: .3rem;
    border-radius: 50%;
    background: rgb(84, 180, 182);
    color: rgb(255, 255, 255);
    font-size: .2rem;
    line-height: 1;
}

.question {
    margin-left: .1rem;
    padding: .04rem .2rem;
    color: rgb(255, 255, 255);
    font-size: .16rem;
    font-weight: 500;
    line-height: 120%;
    border-radius: 100px;
    background: rgb(84, 180, 182);
}

.nanobody_answer {
    margin: .3rem 0 0;
}

.nanobody_answer .qa_circle {
    background: rgb(125, 161, 232);
}

.answer {
    margin-left: .2rem;
    color: rgb(51, 51, 51);
    font-size: .16rem;
    font-weight: 400;
    line-height: 200%;
}

.nanobody_area .nanobody_qa:not(:last-of-type) {
    margin-bottom: .3rem;
    padding-bottom: .15rem;
    border-bottom: 1px dashed rgb(106, 179, 214);
}

.answer_right {
    flex-shrink: 0;
    margin-left: .8rem;
}

.answer_right img {
    width: 2rem;
}

.screening img {
    width: 100%;
}


.nanobody_list {
    padding: 0 2.05rem;
    margin: -0.3rem 0 0 -0.3rem;
}

.nanobody_list li {
    width: calc(50% - .3rem);
    margin: .3rem 0 0 .3rem;
}

.nan_instru .pic {
    border: .03rem solid rgb(217, 234, 242);
    border-radius: .04rem;
}

.nanInstru_title {
    border-radius: .04rem;
    background: rgb(217, 234, 242);
    color: rgb(0, 0, 0);
    font-size: .18rem;
    font-weight: 400;
    line-height: 120%;
    height: .45rem;
    margin-bottom: .1rem;
}


@media only screen and (max-width: 1200px) {
    .answer {
        font-size: 12px;
    }

    .qa_circle {
        width: 20px;
        height: 20px;
        font-size: 12px;
    }

    .question {
        font-size: 12px;
    }

    .nanInstru_title {
        font-size: 12px;
        height: 32px;
    }
}

@media only screen and (max-width: 500px) {
    .answer {
        flex-direction: column;
    }

    .answer_right {
        margin-left: 0;
        margin-top: 20px;
    }

    .answer_right img {
        width: auto;
    }

    .nanobody_list {
        padding: 0;
    }

    .nanobody_list li {
        width: 100%;
    }
}