@charset "utf-8";

/* CSS Document */
html {
    font-size: 12px;
}

@media (min-width:768px) {
    html {
        font-size: 6.4px;
    }
}

@media (min-width:992px) {
    html {
        font-size: 8.3px;
    }
}

@media (min-width:1200px) {
    html {
        font-size: 10px;
    }
}

@media (min-width:1440px) {
    html {
        font-size: 12px;
    }
}

@media (min-width:1400px) {
    html {
        font-size: 11.66666px;
    }
}

@media (min-width:1360px) {
    html {
        font-size: 11.33333px;
    }
}

@media (min-width:1500px) {
    html {
        font-size: 13.3px;
    }
}

@media (min-width:1800px) {
    html {
        font-size: 15px;
    }
}

@media (min-width:1900px) {
    html {
        font-size: 16px;
    }
}

/*手机样式*/
@media (min-width:992px) {
    .h-con .con:hover .con-title {
        bottom: 0;
    }

    .h-con .con:hover:after {
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
    }

    .h-con .con:hover .con-title div.h3:after {
        background: url(../images/h-con-icon_.png) no-repeat center;
        width: 13px;
        height: 8px;
        margin-top: -4px;
    }

    .culture-con .row {
        margin-left: -30px;
        margin-right: -30px;
    }

    .culture-con .row li {
        padding-left: 30px;
        padding-right: 30px;
        margin-bottom: 50px;
    }

    .honor-con .row {
        margin-left: -18px;
        margin-right: -18px;
    }

    .honor-con .row li {
        padding-left: 18px;
        padding-right: 18px;
        margin-bottom: 22px;
    }

    .honor-con .row li .box:hover {
        background-color: #ffffff;
    }

    .honor-con .row li .box:hover:before,
    .honor-con .row li .box:hover:after,
    .list-ul .box:hover:before,
    .list-ul .box:hover:after {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@media (min-width:1260px) {}

@media screen and (max-width:1259px) {}

@media screen and (max-width:991px) {
    header {
        position: relative;
    }

    header .logo i,
    header .logo span {
        display: none;
    }

    .menufix {
        display: none;
    }

    .menu {
        right: 15px;
        top: 50%;
        float: right;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .menu strong {
        display: none;
    }

    #menu_toggle {
        display: none;
    }

    #menu_toggle1 {
        display: block;
    }

    .header-menu {
        height: 80px;
    }

    .menu span,
    .menu span:after,
    .menu span:before {
        width: 32px;
    }

    .menu span:before {
        top: -8px;
    }

    .menu span:after {
        bottom: -8px;
    }

    #banner {
        width: 100% !important;
        height: auto !important;
    }

    #banner .banner ul.swiper-wrapper img {
        width: 100% !important;
        height: auto !important;
        left: 0 !important;
        top: 0 !important;
    }

    .banner .flex-direction-nav .flex-nav-prev,
    .banner .flex-direction-nav .flex-nav-next,
    .bbox {
        top: 50%;
    }

    .side-nav {
        display: none;
    }

    .news-details-text,
    .news-details-page,
    .recruitment-main {
        width: 100%;
    }

    .news-details-page {
        margin-top: 30px;
    }

    .recruitment-side {
        display: none;
    }

    .h-news,
    .h-video,
    .h-engineering ul li .img img {
        width: 100%;
    }

    .qualifications-text {
        padding-top: 0;
    }

    .qualifications-text ul li {
        position: relative;
        top: 0 !important;
        left: 0 !important;
        float: left;
        -webkit-transform: translateX(0) !important;
        -moz-transform: translateX(0) !important;
        -ms-transform: translateX(0) !important;
        -o-transform: translateX(0) !important;
        transform: translateX(0) !important;
    }

    .business-text .panel-group .panel-body .img {
        text-align: left;
    }

    .business-text .panel-group .panel-body .img img {
        margin-top: 20px;
    }

    .news-box li .con .text p {
        height: 20px;
    }

    .news-box li {
        padding: 25px 20px;
    }

    .news-box li .con .time {
        width: 70px;
    }
}

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

    .h-news .con .img,
    .h-news .con .text {
        width: 100%;
    }

    .h-news .con .text {
        padding-top: 25px;
    }

    .news-box li .con {
        display: block;
    }

    .news-box li .con .img,
    .news-box li .con .text,
    .news-box li.no-img .con .text {
        width: 100%;
    }

    .news-box li .con .time {
        display: none;
    }

    .news-box li .con .img {
        padding-bottom: 20px;
    }

    .news-box li {
        padding-left: 0;
        padding-right: 0;
    }

    .radio-button {
        padding-top: 0;
    }

    .qualifications-text ul li {
        width: 120px;
        height: 120px;
        background-size: 120px;
        font-size: 14px;
    }

    .business-text .panel-group .panel-heading a div.problem-title,
    .business-text .panel-group .panel-body {
        padding: 20px;
    }

    .culture-text .row {
        padding-bottom: 0;
    }

    .culture-text li .con {
        padding: 40px 0 20px;
        height: auto;
    }

    .news-box li .con .text p {
        height: auto;
    }

    .list-page {
        border-width: 5px;
    }

    .contact .contact-box,
    #map {
        width: 100%;
    }

    .contact .contact-box {
        padding: 20px 5.5%;
    }

    #map {
        height: 400px;
    }

    .contact h2 {
        padding-bottom: 20px;
    }

    .contact-us-text {
        padding: 10px 0;
    }

    .contact .contact-box h3 {
        font-size: 18px;
    }

    .contact-us-text li {}

    .contact-us-text li .img {
        float: left;
        width: 20%;
        background-size: contain;
    }

    .contact-us-text li .text {
        float: left;
        padding: 0 20px;
        text-align: left;
        width: 80%;
    }

    .banner .bannerfix>li.imgIn .bbox h1 {
        font-size: 24px;
    }

    .bbox .bbox-bg {
        padding: 0 30px;
    }

    .banner .flex-direction-nav .flex-nav-prev,
    .banner .flex-direction-nav .flex-nav-next {
        width: 20px;
        background-size: 100% auto;
    }

    .h-con {

        height: auto;
    }

    .h-con .con-title div.h3 {
        padding-right: 0;
    }

    .h-con .con-title {
        padding: 0;
    }

    .h-con .row .box_sm {
        width: 49%;
    }

    .h-con .con-title div.h3 a {
        font-size: 18px;
    }

    .h-product,
    .h-news,
    .h-video,
    .h-about,
    .h-contact {
        margin-bottom: 10px;
    }

    footer {
        font-size: 14px;
    }

    footer .f-con {
        display: none;
    }

    footer .f-copyright .pull-left,
    footer .f-copyright .pull-right {
        display: block;
        width: 100%;
    }

    .about-con {
        padding: 30px 0;
    }

    .culture-con,
    .honor-con {
        padding: 30px 0 20px;
    }

    .culture-con .row li,
    .honor-con .row li,
    .product-characteristic ul li,
    .list-ul li {
        margin-bottom: 10px;
    }

    .contact .contact-box h3 {
        font-size: 20px;
    }

    .culture-con .row li .box .text .h3 {
        padding-bottom: 10px;
        margin-bottom: 10px;
        font-size: 18px;
    }

    .culture-con .row li .box .text,
    .product-content,
    .contact-us-text {
        font-size: 14px;
    }

    .history-con,
    .news-con,
    .video-con,
    .news-details,
    .video-details,
    .contact-us {
        padding: 30px 0 50px;
    }

    .path-text-box {
        padding: 25px 15px;
        font-size: 14px;
    }

    .path-swiper li.swiper-slide-active div {
        font-size: 26px;
    }

    .honor-con .row li .box {
        padding: 7px;
    }

    .product-title,
    .product-about .title .h3 {
        font-size: 18px;
    }

    .product-list {
        font-size: 14px;
        padding: 15px 0;
    }

    .product-list li {
        float: left;
        width: 50%;
    }

    .product-about,
    .product-swiper {
        padding: 30px 0;
    }

    .landscape-nav .width-830 .swiper-button-white {
        width: 20px;
        background-size: 20px auto;
    }

    .landscape-nav .width-830 .landscape-next {
        right: 5px;
    }

    .landscape-nav .width-830 .landscape-prev {
        left: 5px;
    }

    .product-tab li {
        margin-right: 10px;
        padding-right: 10px;
    }

    .product-tab li a {
        font-size: 16px;
    }

    .product-characteristic .characteristic-title {
        margin-bottom: 30px;
    }

    .product-characteristic ul li .text,
    .news-details .box,
    .video-details .box,
    .news-details .time {
        font-size: 14px;
    }

    .product-characteristic ul li .text h4 {
        font-size: 16px;
    }

    .product-characteristic ul li .img {
        text-align: right;
    }

    .product-characteristic ul li {
        max-width: inherit;
    }

    .list-ul .box {
        padding: 8px;
    }

    .list-ul .box .text p {
        font-size: 14px;
    }

    .list-more {
        padding-top: 10px;
    }

    .list-more a {
        max-width: inherit;
        padding: 10px 0;
    }

    .news-details .title {
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 24px;
    }

    .news-details .time {
        padding-top: 20px;
    }

    .video-details .box {
        margin-top: 20px;
    }

    .video-details .title {
        margin-bottom: 20px;
        font-size: 24px;
    }

    .message-form>div.h4 {
        font-size: 14px;
        padding: 30px 20px 20px;
        line-height: 1.6;
    }

    .message-form label.control-label {
        font-size: 14px;
        line-height: inherit;
        height: auto;
        width: auto;
        padding-bottom: 10px;
        position: relative;
        text-align: left;
    }

    .message-form .form-text {
        padding-left: 0;
    }

    .message-form .form-group {
        margin-bottom: 10px;
    }

    .message-form .form-button button {
        font-size: 14px;
    }

    .message-form .form-button {
        padding-top: 10px;
    }

    .h-con .con {
        position: relative;
        overflow: hidden;
        height: 13.5rem;
    }

    .con-list {
        display: none;
    }

    .h-con .con:hover:after {
        background-color: transparent !important;
    }

    footer .f-copyright .pull-left {
        margin-bottom: 1.25rem;
    }

    #banner.w_banner {
        height: 100vh !important;
    }

    .aboutr .box div {
        width: 20%;
    }

    .aboutlist .bg_cover {
        height: 20rem;

    }

    .aboutr .container::after {
        height: 0;
    }

    .ProductDisplaybox {
        margin-left: 0;
    }

    .ProductDisplaybox {

        padding: 2.875rem 0.875rem;

    }

    .w_banner .w_box {
        display: block;
    }

    .w_banner .w_box .box_r {
        width: 100%;
        padding-left: 0;
        border-left: 0;
        padding-top: 1.875rem;
        border-top: 1px solid rgba(255, 255, 255, 0.2);

    }

    .w_banner .w_box {
        height: auto !important;
        top: 12%;
    }

    .cdmo-side ul.ul li.active a:after,
    .cdmo-side ul.ul li a:hover:after {
        width: 0rem;
    }

    .cdmo-side ul.ul li.active a,
    .cdmo-side ul.ul li a:hover {
        padding-left: 0;
    }

    .ProductDisplaybox .box {
        position: relative;
        padding-left: 6.625rem;
    }

    .ProductDisplayboxjs {
        margin-bottom: 2rem;
    }

    .popular .box {
        display: block;
    }

    .popular .box .img {
        height: 240px;
        width: 100%;
        background-size: 100% 100%;
    }

    .popular .box .text {
        width: 100%;
        margin-top: 1.25rem;
    }

    .searchbox {
        display: block;
    }

    .searchbox .dropDown {
        width: 100%;
        margin-bottom: 1.25rem;
    }

    .searchbox .time {
        width: 100%;
    }

    .searchbox .layui-input-inline {
        position: relative;
        width: 100%;
        margin-bottom: 1.25rem;
    }

    .searchbox .time .layui-inline {
        display: block;
    }

    .searchField_form {
        position: relative;
        width: 100%;
    }

    .contactus .box {
        display: block;
    }

    .contactus .box .box_l,
    .contactus .box .box_r {
        width: 100%;
    }

    .contactus .box .box_r {
        margin-top: 3rem;
    }

    .map .box_t {
        height: 117px;
    }

    .map .box_b .ft_20 {
        padding-top: 3.125rem;
        padding-bottom: 3.125rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media screen and (max-width:641px) {
    .history-text {
        padding: 62px 0;
    }

    .history-year {
        display: none;
    }

    .history-text .box {
        position: relative;
        top: 0 !important;
        left: 0 !important;
        width: 100%;
        height: auto;
        margin-left: 0;
    }

    .history-text li:nth-child(2n) .box {
        top: inherit;
        bottom: 0;
    }

    .history-text li:nth-child(2n) .box p {
        top: 0;
    }

    .history-text li:nth-child(2n) .box h3 {
        bottom: 0;
    }


    .h-recommend {
        padding-bottom: 25px;
    }

    .banner .bannerfix>li.imgIn {
        overflow: hidden;
        height: 300px;
    }

    .banner-fixed>div {
        height: 300px;
        overflow: hidden;
    }

    .banner .bannerfix>li.imgIn .bimg {
        width: auto;
        max-width: inherit;
    }

    .banner-fixed>div img {
        max-width: inherit;
        height: 100%;
        position: relative;
        left: -50%;
    }

    .about-con,
    .team-d-text,
    .culture-con .title,
    .idea-con .title,
    .culture-con .culture-box li p,
    .history-text table,
    .service-about,
    .technology-con .text,
    .news-d-text .con,
    .introduce-con,
    .insurance-con,
    .message-box .control-label,
    .message-box .form-control,
    .login-sidenav ul li a,
    .video-con {
        font-size: 14px;
    }

    .introduce-con p.h4,
    .insurance-con p.h4,
    .range-img div.h4,
    .history-tab li div,
    .opinion-radio-box .radio-title,
    .help-con .q-a li .ask,
    .case-box li .text {
        font-size: 16px;
    }

    .history-tab li.swiper-slide-active div,
    .video-con .title {
        font-size: 20px;
    }

    .transport-con .title {
        font-size: 26px;
    }

    .transport-con ul li .text p {
        font-size: 18px;
        padding: 25px 0 14px;
    }

    .login-herder-con .login-title div.h2 {
        font-size: 24px;
    }

    .service-about {
        padding: 30px 25px;
    }

    .history-con .title {
        padding-bottom: 25px;
    }

    .history-con .title,
    .news-d-text .title {
        font-size: 22px;
    }

    .culture-con .culture-box {
        margin-bottom: 0;
    }

    .honor-con ul li .img {
        border-width: 3px;
    }

    .honor-con ul li .text {
        padding: 15px 0 30px;
    }

    .honor-box .honor-body .honor-box-swiper {
        margin: 0 52px;
    }

    .honor-box .honor-body ul li .text {
        padding: 15px 15px 0;
        font-size: 18px;
    }

    .honor-box .honor-body ul li .img {
        height: 230px;
        line-height: 230px;
    }

    .gallery-thumbs ul li {
        height: 66px;
    }

    .team-con ul.team-box li .img img {
        width: 100%;
    }

    .team-con ul.team-box li .text h2 {
        margin: 20px 0 15px;
    }

    .pagination li a {
        margin: 0;
        margin-left: -1px;
    }

    .culture-con .title,
    .idea-con .title {
        padding: 0 0 25px;
    }

    .history-tab,
    .history-text table {
        margin: 0 28px;
    }

    .history-bg {
        min-height: inherit;
    }

    .history-con-box {
        margin-top: 40px;
    }

    .history-year .history-button-prev,
    .history-year .history-button-next {
        background-size: 20px auto;
    }

    .service-con ul.service-box li {
        margin-bottom: 20px;
    }

    .service-con ul.service-box,
    .message-title,
    .video-con .title {
        padding-bottom: 30px;
    }

    .news-box li .con .text h3 {
        font-size: 20px;
    }

    .news-box li .con .text p,
    .range-img div.h4 {
        padding-bottom: 10px;
    }

    .news-d-page {
        display: none;
    }

    .artificial-con ul,
    .help-con .q-a li {
        padding: 20px 0 15px;
    }

    .opinion-radio-box .radio-con {
        padding: 20px 12px 30px;
    }

    .opinion-con {
        padding: 40px 0 0 0;
    }

    .opinion-radio {
        margin: 30px 0 20px;
        padding: 100px 20px 70px;
    }

    .radio-button button {
        margin: 0 8px;
    }

    .help-con .q-a li .ask,
    .help-con .q-a li .answer {
        padding-left: 32px;
    }

    .help-con .q-a li .ask {
        margin-bottom: 10px;
    }

    .login-herder-con,
    .login-main .news-d-con {
        padding-top: 35px;
    }

    .login-main {
        margin-bottom: 35px;
    }

    .case-box li .text {
        padding: 13px 0 5px;
    }

    .case-box li {
        margin-bottom: 15px;
    }
}

@media screen and (max-width:520px) {
    .banner-fixed>div {
        height: 200px;
    }

    #introduce-tab .nav-tabs li a {
        padding: 12px 0;
    }

    #introduce-tab .tab-content {
        height: 300px;
    }

    .opinion-radio-box .radio-con .radio-inline {
        width: 50%;
        margin-bottom: 10px;
    }

    .opinion-radio {
        padding: 70px 20px 50px;
    }

    .login-sidenav ul li {
        display: block;
        width: 25%;
        float: left;
        text-align: center;
    }

    .login-sidenav ul li a {
        padding: 12px 0;
        margin-left: 0;
        width: 100%;
    }

    .login-herder-con .login-title div.h2 span {
        display: none;
    }

    .myvideo-details {
        position: relative;
        transform: translateY(0);

    }

    .myvideo-details embed {
        width: 100%;
        height: 17rem;
    }
}

@media screen and (max-width:481px) {
    .h-partner .partner-swiper {
        margin: 0 33px;
    }
}

@media screen and (max-width:380px) {}

@media screen and (max-width:340px) {}