.divBodyWrap.banner.research {
    overflow: hidden;
    height: 40vh;
}

.divBodyWrap.banner.research.top.bio {
    background: url('/img/research/research_bio_img_top-1@2x.png') no-repeat center center;
    background-size: cover;
}

.divBodyWrap.banner.research.top.it {
    background: url('/img/research/research_it_img_top-1@2x.png') no-repeat center center;
    background-size: cover;
}

.divBodyWrap.banner.research.top .divContentWrap {
    position: absolute;
    left: 50%;
    bottom: 50%;
    transform: translate(-50%, 50%);
}

.divBodyWrap.banner.research.bottom .divContentWrap {
    position: absolute;
    right: 50%;
    bottom: 50%;
    transform: translate(50%, 50%);
}

.divBodyWrap.banner.research.bottom .divContentWrap button {
    display: block;
    margin: 40px auto 0 auto;
    padding: 12px 64px;
}

.divBodyWrap.banner.research.bottom {
    background: #57B19A;
    height: auto;
    padding: 64px 0;
}

.divBodyWrap.banner.research.bottom .divContentWrap {
    position: relative;
    bottom: auto;
    right: auto;
    transform: none;
}

.divBodyWrap.banner.research.bottom .divContentWrap h1 {
    width: 700px;
    max-width: 100%;
    margin: 8px auto;
}

.divBodyWrap.banner.research.bottom .divBackgroundImage {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('/img/research/common_img_banner_aniscan@2x.png');
    background-repeat: no-repeat;
    background-position: 90% 150%;
    background-size: 320px auto;
}


.divBodyWrap.banner.research.bio,
.divBodyWrap.banner.research.it {
    background: transparent;
}


.divPublication .divTitle {
    padding: 8px 0;
    border-bottom: 1px solid #333333;
    position: relative;
}

.divPublication .divTitle i {
    display: none;
    position: absolute;
    right: 4px;
    bottom: 50%;
    transform: translateY(50%);
    font-size: 1.125rem;
    color: #90939B;
}

.divPublication .divPublicationWrap .divPublicationItem {
    padding: 12px;
    border-bottom: 1px solid #DCDEE2;
    cursor: pointer;
}

.divPublication .divPublicationWrap .divPublicationItem img {
    width: 20px;
    display: inline-block;
    vertical-align: middle;
}

.divPublication .divPublicationWrap .divPublicationItem p {
    display: inline-block;
    vertical-align: middle;
    padding-left: 16px;
}

.divPublication .divPublicationWrap .divPublicationItem:hover p {
    color: #5D68DB;
}

.divBodyWrap.research-intro .divContentWrap img {
    width: 480px;
    max-width: 100%;
    margin-top: 32px;
}

.divBodyWrap.research-intro .divContentWrap p {
    max-width: 100%;
    margin: 32px auto 0 auto;
}


.divBodyWrap.research-it-imageprocessing .divContentWrap>p {
    margin-top: 24px;
}

.divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap {
    font-size: 0;
    margin-top: 32px;
}

.divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divImageItem {
    display: inline-block;
    width: calc(50% - 8%);
    vertical-align: middle;
}

.divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divImageItem img {
    width: 100%;
}

.divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divImageItem h2 {
    margin-top: 16px;
}

.divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divImageItem img.mobile {
    display: none;
}

.divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divPlus {
    display: inline-block;
    width: 5%;
    margin: -80px 5.5% 0 5.5%;
    vertical-align: middle;
}

.divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divPlus img {
    width: 100%;
}


.divBodyWrap.research-it-machinelearning .divContentWrap>p {
    margin-top: 24px;
}

.divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap {
    font-size: 0;
    margin-top: 32px;
    margin-bottom: 200px;
}

.divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem {
    display: inline-block;
    width: calc(100% / 3 - 14%);
    vertical-align: middle;
    position: relative;
}

.divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem img {
    width: 100%;
}

.divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem .divDesc {
    position: absolute;
    width: 100%;
    left: 0;
    top: 110%;
    text-align: center;
}

.divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem .divDesc img {
    width: 80%;
    margin: 16px auto 0 auto;
}

.divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divArrow {
    display: inline-block;
    width: 5%;
    margin: 0 8%;
    vertical-align: middle;
}

.divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divArrow img {
    width: 100%;
}


.divBodyWrap.research-tech .divContentWrap .divTechWrap {
    font-size: 0;
}

.divBodyWrap.research-tech .divContentWrap .divTechWrap .divDesc {
    display: inline-block;
    width: 60%;
    vertical-align: top;
}

.divBodyWrap.research-tech .divContentWrap .divTechWrap .divDesc p {
    margin-top: 24px;
}

.divBodyWrap.research-tech .divContentWrap .divTechWrap .divPublication {
    display: inline-block;
    width: 40%;
    vertical-align: top;
    padding-left: 4%;
}

.divBodyWrap.research-tech .divContentWrap .divImageWrap {
    width: 100%;
    margin-top: 32px;
}

.divBodyWrap.research-tech.it-bigdata .divContentWrap .divImageWrap {
    width: 100%;
    margin-top: 48px;
}

.divBodyWrap.research-tech .divContentWrap .divImageWrap img {
    width: 80%;
}

.divBodyWrap.research-tech.it-bigdata .divContentWrap .divImageWrap img {
    width: 60%;
}

.divBodyWrap.research-tech .divContentWrap .divSliderWrap {
    width: 100%;
    margin-top: 32px;
}

.divBodyWrap.research-tech .divContentWrap .divSliderWrap .bx-wrapper .bx-pager.bx-default-pager {
    margin-bottom: 24px;
}

.divBodyWrap.research-tech .divContentWrap .divSliderWrap .divSlider .divSliderItem {
    padding-bottom: 72px;
}


.divBodyWrap.research-tech.bio-organoid .divContentWrap>div {
    font-size: 0;
    margin-top: 32px;
}

.divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap {
    display: inline-block;
    width: 40%;
    vertical-align: top;
    padding-right: 5%;
}

.divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divSliderWrap {
    display: inline-block;
    width: 60%;
    vertical-align: top;
    margin-top: 0;
}

.divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap .divDesc {
    width: 100%;
}

.divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap .divDesc p {
    margin-top: 0;
}

.divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap .divPublication {
    width: 100%;
    padding-left: 0;
    margin-top: 64px;
}


@media (max-width: 1024px) {
    .divBodyWrap.banner.research.bottom .divBackgroundImage {
        display: none;
    }

    .divBodyWrap.research-it-imageprocessing {
        padding-bottom: 0;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap {
        padding: 0;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap>h1,
    .divBodyWrap.research-it-imageprocessing .divContentWrap>p {
        padding: 0 4%;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap {
        padding: 8% 4%;
    }

    .divBodyWrap.research-it-machinelearning {
        padding-bottom: 0;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap {
        padding: 0;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap>h1,
    .divBodyWrap.research-it-machinelearning .divContentWrap>p {
        padding: 0 4%;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap {
        padding: 8% 4%;
    }
}


@media (max-width: 800px) {
    .divPublication .divTitle {
        padding: 12px 0;
        border-top: 1px solid #333333;
        border-bottom: 1px solid #DCDEE2;
        cursor: pointer;
    }

    .divPublication .divTitle i {
        display: block;
    }

    .divPublication .divPublicationWrap {
        display: none;
    }

    .divBodyWrap.research-tech .divContentWrap {
        padding: 0;
    }

    .divBodyWrap.research-tech .divContentWrap .divTechWrap .divDesc {
        width: 100%;
    }

    .divBodyWrap.research-tech .divContentWrap .divTechWrap .divDesc h1 {
        text-align: center;
    }

    .divBodyWrap.research-tech .divContentWrap .divTechWrap .divDesc p {
        margin-top: 24px;
    }

    .divBodyWrap.research-tech .divContentWrap .divTechWrap .divPublication {
        width: 100%;
        padding-left: 0;
        margin-top: 24px;
    }

    .divBodyWrap.research-tech .divContentWrap .divTechWrap {
        padding: 0 4%;
    }

    .divBodyWrap.research-tech .divContentWrap .divImageWrap,
    .divBodyWrap.research-tech .divContentWrap .divSliderWrap {
        background: #F5F5F6;
        padding: 8% 4%;
    }

    .divBodyWrap.research-tech .divContentWrap .divSliderWrap .divSlider .divSliderItem {
        background: #F5F5F6;
        padding-bottom: 60px;
    }

    .divBodyWrap.research-tech {
        padding-bottom: 0;
    }

    .divBodyWrap.research-tech.it-bigdata,
    .divBodyWrap.research-tech.bio-organoid {
        background: #fff;
        padding-bottom: 0;
    }

    .divBodyWrap.research-tech.bio-organoid .divContentWrap>div {
        font-size: 0;
        margin-top: 0;
    }

    .divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap {
        width: 100%;
        padding-right: 5%;
    }

    .divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divSliderWrap {
        width: 100%;
        margin-top: 32px;
        padding-bottom: 0;
    }

    .divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap .divDesc {
        width: 100%;
    }

    .divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap .divDesc p {
        margin-top: 24px;
    }

    .divBodyWrap.research-tech.bio-organoid .divContentWrap>div .divTechWrap .divPublication {
        padding-left: 0;
        margin-top: 24px;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap>p,
    .divBodyWrap.research-it-machinelearning .divContentWrap>p {
        text-align: left;
    }

    .divBodyWrap.research-tech .divContentWrap .divImageWrap img {
        width: 100%;
    }

    .divBodyWrap.research-tech.it-bigdata .divContentWrap .divImageWrap img {
        width: 100%;
    }
}


@media (max-width: 640px) {
    .divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap {
        background: #F5F5F6;
        padding: 8% 4%;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divImageItem {
        display: block;
        width: 60%;
        margin: 0 auto;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divImageItem img.pc {
        display: none;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divImageItem img.mobile {
        display: block;
    }

    .divBodyWrap.research-it-imageprocessing .divContentWrap .divImageWrap .divPlus {
        display: block;
        width: 5%;
        margin: 5% auto;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap {
        margin-bottom: 0;
        background: #F5F5F6;
        padding: 8% 4%;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem {
        display: block;
        width: 80%;
        font-size: 0;
        margin: 0 auto;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem img {
        display: inline-block;
        width: 30%;
        vertical-align: middle;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem .divDesc {
        display: inline-block;
        width: 70%;
        position: inherit;
        left: inherit;
        top: inherit;
        vertical-align: middle;
        text-align: left;
        padding-left: 10%;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divImageItem .divDesc img {
        width: 40%;
        margin: 16px auto 0 auto;
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divArrow {
        display: block;
        width: 6%;
        margin: 4% auto;
        transform: rotate(90deg);
    }

    .divBodyWrap.research-it-machinelearning .divContentWrap .divImageWrap .divArrow img {
        width: 100%;
    }

}