span.red { color: red; margin-left: 1.5em; font-size: 14px; }

#swiperbanner { width: 100%; height: 100%; min-height: 620px; max-height: 1080px; }
    #swiperbanner .swiper-slide { background-repeat: no-repeat; background-position: top center; background-size: cover; }
        #swiperbanner .swiper-slide > a { height: 100%; max-width: 1920px; width: 100%; display: block; min-height: 620px; max-height: 1080px; }

    #swiperbanner .swiper-pagination-bullet { width: 30px; background-color: #fff; border-radius: 4px; opacity: 1; }
    #swiperbanner .swiper-pagination-bullet-active { width: 60px; background-color: #f39800; border-radius: 4px; opacity: 1; }
    #swiperbanner .swiper-pagination { bottom: 40px; }


.databig { width: 100%; padding: 0px 16px; margin: 120px auto 120px auto; }
    .databig > .dataconn { display: flex; max-width: 1200px; margin: 0px auto; }
        .databig > .dataconn > li { cursor: pointer; background-color: #fff; padding: 30px 30px; width: 25%; border-top: solid 15px #c7c7c7; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s }
            .databig > .dataconn > li > b { color: #010108; font-weight: 400; display: block; margin-top: 70px; font-size: 60px; }
            .databig > .dataconn > li > p { font-size: 24px; }
            .databig > .dataconn > li:hover { border-top: solid 15px #f39800; transform: scale(1.15); -ms-transform: scale(1.15); -moz-transform: scale(1.15); -webkit-transform: scale(1.15); -o-transform: scale(1.15); box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }
                .databig > .dataconn > li:hover > b { color: #ee8b06 }
                .databig > .dataconn > li:hover > p { color: #ee8b06 }



@media only screen and (max-width:1024px) {
    .databig > .dataconn > li > b { font-size: 48px; }
    .databig > .dataconn > li > p { font-size: 20px; }
}

@media only screen and (max-width:768px) {
    #swiperbanner { min-height: 300px; max-height: 300px; }
        #swiperbanner .swiper-slide > a { min-height: 300px; max-height: 300px; }
        #swiperbanner .swiper-pagination-bullet { width: 18px; height: 6px; border-radius: 3px; }
        #swiperbanner .swiper-pagination-bullet-active { width: 36px; height: 6px; border-radius: 3px; }
        #swiperbanner .swiper-pagination { bottom: 10px; }


    .databig { margin-top: 60px; margin-bottom: 80px; }
        .databig > .dataconn > li { padding: 20px 10px; }
            .databig > .dataconn > li > b { font-size: 28px; margin-top: 35px; }
            .databig > .dataconn > li > p { font-size: 16px; }
}

@media only screen and (max-width:480px) {
    .databig { margin-top: 40px; margin-bottom: 40px; }
        .databig > .dataconn { flex-wrap: wrap; }
            .databig > .dataconn > li { padding: 20px 10px 40px 10px; width: 50%; }
                .databig > .dataconn > li > b { font-size: 28px; margin-top: 35px; }
                .databig > .dataconn > li > p { font-size: 16px; }
}


.modeltitle { text-align: center; }
    .modeltitle > b { line-height: 1; padding-bottom: 2rem; display: block; font-size: 42px; font-weight: 400; color: #020204; border-bottom: solid 2px #999; }
    .modeltitle > p { line-height: 1; font-size: 1rem; color: #666; line-height: 2; }
.bai > b { color: #fff; border-bottom: solid 2px #fff; }
.baibom > b { border-bottom: solid 1px #f4f4f4; }

@media only screen and (max-width:1024px) {
    .modeltitle > b { font-size: 36px }
}

@media only screen and (max-width:768px) {
    .modeltitle > b { font-size: 24px; padding-bottom: 1rem; }
}

@media only screen and (max-width:480px) {
    .modeltitle > b { font-size: 18px }
}



.modeltmtitle { text-align: right; font-size: 42px; font-weight: 400; color: #fff; }
    .modeltmtitle > .box { text-align: left; font-size: 0px; vertical-align: top; margin-right: 15px; }
        .modeltmtitle > .box > i { vertical-align: top; display: inline-block; background-color: #f39800; width: 15px; margin-left: 5px; height: 62px; }
        .modeltmtitle > .box > span { vertical-align: top; line-height: 1; display: inline-block; padding: 10px 6rem; font-size: 42px; font-weight: 400; color: #000; background-color: rgba(255,255,255,0.58) }


@media only screen and (max-width:1024px) {
    .modeltmtitle > .box > i { height: 56px; }
    .modeltmtitle > .box > span { font-size: 36px; }
}

@media only screen and (max-width:768px) {
    .modeltmtitle > .box > i { height: 44px; }
    .modeltmtitle > .box > span { font-size: 24px }
}

@media only screen and (max-width:480px) {
    .modeltmtitle > .box > i { height: 38px; }
    .modeltmtitle > .box > span { font-size: 18px }
}




.serverbig { width: 100%; padding: 0px 16px; border: solid 0px #000; margin-bottom: 120px; }
    .serverbig > .serverconn { max-width: 1200px; width: 100%; margin: 0px auto; }
        .serverbig > .serverconn > .pics { width: 90%; margin: 60px auto 0px auto; display: flex; flex-wrap: wrap; }
            .serverbig > .serverconn > .pics > li { overflow: hidden; position: relative; width: 19%; margin: 0.5%; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s }
                .serverbig > .serverconn > .pics > li > img { max-width: 100%; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s }
                .serverbig > .serverconn > .pics > li > .text { position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; line-height: 1; color: #fff; font-size: 20px; text-align: center; display: flex; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s }
                    .serverbig > .serverconn > .pics > li > .text > .in { align-self: center; text-align: center; width: 100%; }
                .serverbig > .serverconn > .pics > li:hover > img { transform: scale(1.15); -ms-transform: scale(1.15); -moz-transform: scale(1.15); -webkit-transform: scale(1.15); -o-transform: scale(1.15); }
                .serverbig > .serverconn > .pics > li:hover > .text { transform: scale(1.15); -ms-transform: scale(1.15); -moz-transform: scale(1.15); -webkit-transform: scale(1.15); -o-transform: scale(1.15); }


@media only screen and (max-width:1280px) {
    .serverbig > .serverconn > .pics { width: 100%; }
}

@media only screen and (max-width:1024px) {
    .serverbig > .serverconn > .pics > li { width: 32%; }
}

@media only screen and (max-width:768px) {
    .serverbig { margin-bottom: 60px; }
        .serverbig > .serverconn > .pics { margin: 40px auto 0px auto; }
}


@media only screen and (max-width:480px) {
    .serverbig > .serverconn > .pics > li { width: 48%; margin: 1%; }
        .serverbig > .serverconn > .pics > li > .text { font-size: 16px; }
}




.quanyubig { width: 100%; padding: 0px 16px; border: solid 0px #000; background-image: ; background-size: auto; background-position: top center; background-repeat: no-repeat; }
    .quanyubig > .quanyuconn { max-width: 1200px; width: 100%; margin: 0px auto; padding-top: 120px; }
        .quanyubig > .quanyuconn > ul { width: 80%; margin: 120px auto 0px auto; }
            .quanyubig > .quanyuconn > ul > li { width: 100%; height: 300px; display: flex; margin-bottom: 80px }
                .quanyubig > .quanyuconn > ul > li > .box { width: 44%; position: relative; background-color: #f3b562; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }
                    .quanyubig > .quanyuconn > ul > li > .box > .img { z-index: 2; position: absolute; left: -25px; top: -50px; bottom: 50px; right: 50px; }
                        .quanyubig > .quanyuconn > ul > li > .box > .img > img { max-width: 100%; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }

                .quanyubig > .quanyuconn > ul > li > .title { flex: 1; position: relative; text-align: left; }
                    .quanyubig > .quanyuconn > ul > li > .title > .posdv { z-index: 1; display: flex; align-items: center; padding-left: 150px; padding-right: 10px; position: absolute; left: -100px; right: 0px; top: 25px; bottom: 25px; background-color: #fff; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2); }
                        .quanyubig > .quanyuconn > ul > li > .title > .posdv > div.name { flex: 1; }
                        .quanyubig > .quanyuconn > ul > li > .title > .posdv > div > b { display: block; font-size: 24px; font-weight: 400; line-height: 1.8; color: #797979; letter-spacing: 2px; }
                        .quanyubig > .quanyuconn > ul > li > .title > .posdv > div > p { font-size: 18px; color: #797979; line-height: 1.5; letter-spacing: 1px; }



                .quanyubig > .quanyuconn > ul > li > .title1 { flex: 1; position: relative; text-align: left; }
                    .quanyubig > .quanyuconn > ul > li > .title1 > .posdv { z-index: 1; display: flex; align-items: center; padding-left: 10px; padding-right: 150px; position: absolute; left: 0px; right: -100px; top: 25px; bottom: 25px; background-color: #fff; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2); }
                        .quanyubig > .quanyuconn > ul > li > .title1 > .posdv > div.name { border: solid 0px #000; margin-left: 20px; }
                        .quanyubig > .quanyuconn > ul > li > .title1 > .posdv > div > b { display: block; font-size: 24px; font-weight: 400; line-height: 1.8; color: #797979; letter-spacing: 2px; }
                        .quanyubig > .quanyuconn > ul > li > .title1 > .posdv > div > p { font-size: 18px; color: #797979; line-height: 1.5; letter-spacing: 1px; }


                .quanyubig > .quanyuconn > ul > li > .box1 { width: 44%; position: relative; background-color: #c7c7c7; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }
                    .quanyubig > .quanyuconn > ul > li > .box1 > .img { z-index: 2; position: absolute; left: 50px; top: -50px; bottom: 50px; right: -25px; }
                        .quanyubig > .quanyuconn > ul > li > .box1 > .img > img { max-width: 100%; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }


@media only screen and (max-width:1024px) {
    .quanyubig > .quanyuconn > ul > li { height: 240px }
}

@media only screen and (max-width:768px) {
    .quanyubig > .quanyuconn { padding-top: 60px; }
        .quanyubig > .quanyuconn > ul { width: 90% }
            .quanyubig > .quanyuconn > ul > li > .box { width: 60% }
            .quanyubig > .quanyuconn > ul > li > .title > .posdv { padding-left: 100px; padding-right: 10px; }
                .quanyubig > .quanyuconn > ul > li > .title > .posdv > div > b { font-size: 14px; }
                .quanyubig > .quanyuconn > ul > li > .title > .posdv > div > p { font-size: 12px; }

            .quanyubig > .quanyuconn > ul > li > .box1 { width: 60% }
            .quanyubig > .quanyuconn > ul > li > .title1 > .posdv { padding-left: 10px; padding-right: 100px; }
                .quanyubig > .quanyuconn > ul > li > .title1 > .posdv > div > b { font-size: 16px; }
                .quanyubig > .quanyuconn > ul > li > .title1 > .posdv > div > p { font-size: 14px; }
}


@media only screen and (max-width:576px) {
    .quanyubig > .quanyuconn > ul { margin: 80px auto 0px auto; }
        .quanyubig > .quanyuconn > ul > li { height: 200px }
            .quanyubig > .quanyuconn > ul > li > .box { width: 70% }
                .quanyubig > .quanyuconn > ul > li > .box > .img { top: -25px; }
            .quanyubig > .quanyuconn > ul > li > .box1 { width: 70% }
                .quanyubig > .quanyuconn > ul > li > .box1 > .img { top: -25px; }
}


@media only screen and (max-width:480px) {
    .quanyubig > .quanyuconn > ul > li > .title > .posdv { padding-left: 60px; }
        .quanyubig > .quanyuconn > ul > li > .title > .posdv > .ricon { display: none }
    .quanyubig > .quanyuconn > ul > li > .title1 > .posdv { padding-right: 60px; }
        .quanyubig > .quanyuconn > ul > li > .title1 > .posdv > .ricon { display: none }
        .quanyubig > .quanyuconn > ul > li > .title1 > .posdv > div.name { margin-left: 0px; }
}




.youshibig { width: 100%; padding: 0px 16px; border: solid 0px #000; background-image: ; background-size: auto; background-position: top center; background-repeat: no-repeat; }
    .youshibig > .youshiconn { max-width: 1320px; width: 100%; margin: 0px auto; padding-top: 120px; padding-bottom: 120px; }
        .youshibig > .youshiconn > .title { text-align: right; font-size: 42px; font-weight: 400; color: #fff; }
            .youshibig > .youshiconn > .title > .box { text-align: right; font-size: 0px; vertical-align: top; margin-right: 15px; }
                .youshibig > .youshiconn > .title > .box > i { vertical-align: top; display: inline-block; background-color: #f39800; width: 15px; margin-right: 5px; height: 62px; }
                .youshibig > .youshiconn > .title > .box > span { vertical-align: top; line-height: 1; display: inline-block; padding: 10px 6rem; font-size: 42px; font-weight: 400; color: #fff; background-color: rgba(0,0,0,0.3) }

        .youshibig > .youshiconn > ul { width: 100%; display: flex; margin-top: 120px; flex-wrap: wrap; }
            .youshibig > .youshiconn > ul > li { width: 18%; margin: 0px 1% 20px 1%; padding: 50px 10px 40px 10px; color: #896053; background-color: #fff; display: flex; flex-direction: column; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2); -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s }
                .youshibig > .youshiconn > ul > li .pic { text-align: center; padding: 0px 0px 10px 0px; }
                    .youshibig > .youshiconn > ul > li .pic img { width: 76px; height: 76px; border-radius: 38px; overflow: auto; }

                .youshibig > .youshiconn > ul > li > b { text-align: center; display: block; padding: 25px 0px; font-size: 1.15rem; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s }
                .youshibig > .youshiconn > ul > li > p { font-size: 1rem; -moz-transition: all, 0.5s; -webkit-transition: all, 0.5s; -o-transition: all, 0.5s; transition: all, 0.5s }

                .youshibig > .youshiconn > ul > li:hover { background-color: #ffbd66 }
                    .youshibig > .youshiconn > ul > li:hover > b { color: #fff; }
                    .youshibig > .youshiconn > ul > li:hover > p { color: #fff; }


@media only screen and (max-width:1024px) {
    .youshibig > .youshiconn > .title > .box > i { height: 56px; }
    .youshibig > .youshiconn > .title > .box > span { font-size: 36px; }
    .youshibig > .youshiconn > ul > li { width: 31%; }
}


@media only screen and (max-width:768px) {
    .youshibig > .youshiconn { padding: 60px 0px; }
        .youshibig > .youshiconn > ul { margin-top: 80px; }
        .youshibig > .youshiconn > .title > .box > i { height: 44px; }
        .youshibig > .youshiconn > .title > .box > span { font-size: 24px }
        .youshibig > .youshiconn > ul > li { width: 48%; padding: 20px 10px 20px 10px; }
}

@media only screen and (max-width:480px) {
    .youshibig > .youshiconn > .title > .box > i { height: 38px; }
    .youshibig > .youshiconn > .title > .box > span { font-size: 18px }
}




.spec { background-color: #ffbd66; height: 100px; }
.video { background-color: #000; padding: 75px 0px; margin: 0px auto; text-align: center; }
    .video video { margin: 0px auto; max-width: 768px; max-height: 356px; width: 100%; height: auto; display: none; }
    .video .video_cover { display: block; max-width: 768px; margin: 0px auto; }
        .video .video_cover img { width: 100%; }

@media only screen and (max-width:640px) {
    .video { padding: 25px 0px; }
}




.anlibig { width: 100%; padding: 0px 16px; border: solid 0px #000; background-image: ; background-size: auto; background-position: top center; background-repeat: no-repeat; }
    .anlibig > .anliconn { text-align: left; max-width: 1320px; width: 100%; margin: 0px auto; padding-top: 80px; padding-bottom: 80px; }

        .anlibig > .anliconn > ul { width: 100%; }
            .anlibig > .anliconn > ul > li { width: 100%; display: flex; }
                .anlibig > .anliconn > ul > li > .img { width: 50%; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }
                    .anlibig > .anliconn > ul > li > .img > img { max-width: 100%; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }
                .anlibig > .anliconn > ul > li > .text { flex: 1; margin-top: 30px; background-color: #fff; padding: 40px; }
                .anlibig > .anliconn > ul > li > .text2 { margin-top: 0px; margin-bottom: 30px; }

                .anlibig > .anliconn > ul > li > .text > div { width: 100%; display: flex; align-items: center; }
                    .anlibig > .anliconn > ul > li > .text > div > .name { width: 125px; font-size: 18px; color: #797979; }
                    .anlibig > .anliconn > ul > li > .text > div > .shuoming { padding: 30px 25px 30px 25px; flex: 1; line-height: 1.5; color: #797979; font-size: 14px; border-left: solid 1px #f39801 }



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

    .anlibig > .anliconn > ul { margin-top: 30px; }
        .anlibig > .anliconn > ul > li > .img { width: 50%; }
        .anlibig > .anliconn > ul > li > .text { padding: 30px; margin-top: 0px; }
        .anlibig > .anliconn > ul > li > .text2 { margin-bottom: 0px; }
        .anlibig > .anliconn > ul > li > .text > div > .name { width: 100px; }
        .anlibig > .anliconn > ul > li > .text > div > .shuoming { padding: 15px 15px 10px 15px; }
}


@media only screen and (max-width:768px) {
    .anlibig > .anliconn > ul > li { flex-wrap: wrap; }
        .anlibig > .anliconn > ul > li > .img { width: 100%; }
        .anlibig > .anliconn > ul > li > .text { width: 100%; flex: auto; }
}

@media only screen and (max-width:480px) {
    .anlibig > .anliconn > ul > li > .text { padding: 10px; }
}





.qualibig { width: 100%; padding: 0px 16px; border: solid 0px #000; background-image: ; background-size: auto; background-position: top center; background-repeat: no-repeat; }
    .qualibig > .qualiconn { text-align: left; max-width: 1320px; width: 100%; margin: 0px auto; padding-top: 80px; padding-bottom: 80px; }
        .qualibig > .qualiconn > .text { width: 100%; margin-top: 50px; display: flex; }
            .qualibig > .qualiconn > .text > .img { width: 480px; background-repeat: no-repeat; background-position: center; background-size: cover; }
            .qualibig > .qualiconn > .text > .list { flex: 1; background-color: #dcdcdc; padding: 0px 40px; }
        .qualibig > .qualiconn > .items { width: 90%; margin: 20px auto 0px auto; }
            .qualibig > .qualiconn > .items p { font-size: 16px; }



.flipster { margin: 0px 0px; width: 100%; border: solid 0px #fff; padding: 10px; }
    .flipster .box { border-radius: 5px; width: 360px; height: 420px; background-color: #efefef; position: relative; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2); }
        .flipster .box > b { font-weight: 400; background-color: #efefef; border-bottom: solid 1px #e6e6e6; border-radius: 5px 5px 0px 0px; display: block; padding: 10px; text-align: center; font-size: 18px; }
        .flipster .box > div { padding: 20px; background-color: #efefef; text-align: left; }
            .flipster .box > div > p { color: #3e3d3f }
                .flipster .box > div > p > i { color: #ffbd66; padding-right: 5px; }
    .flipster .flipto-prev { position: absolute; top: 0px; font-size: 18px; color: #fff; left: 0px; top: calc(50% - 44px); }
    .flipster .flipto-next { position: absolute; top: 0px; font-size: 18px; color: #fff; right: 0px; top: calc(50% - 44px); }
.flipster-carousel .flip-current .box { background-color: #fff; }
    .flipster-carousel .flip-current .box > b { background-color: #ffbd66; }
    .flipster-carousel .flip-current .box > div { background-color: #fff; }





@media only screen and (max-width:1024px) {
    .flipster .box { width: 280px; }
    .qualibig > .qualiconn > .text > .img { width: 280px; }
}

@media only screen and (max-width:768px) {
    .qualibig > .qualiconn { padding-top: 60px; padding-bottom: 60px; }
        .qualibig > .qualiconn > .text { margin-top: 30px; }
            .qualibig > .qualiconn > .text > .img { display: none; }
            .qualibig > .qualiconn > .text > .list { padding: 0px 20px; }
        .qualibig > .qualiconn > .items p { font-size: 14px; }
}

@media only screen and (max-width:480px) {
    .qualibig > .qualiconn > .text > .img { width: 200px; }
    .flipster .box > div > p { font-size: 14px; }
}






#swiperhydk { width: 100%; }
    #swiperhydk .swiper-pagination-bullet { width: 30px; background-color: #fff; border-radius: 4px; opacity: 1; }
    #swiperhydk .swiper-pagination-bullet-active { width: 60px; background-color: #f39800; border-radius: 4px; opacity: 1; }
    #swiperhydk .swiper-slide { padding: 80px 62px 50px 62px; }
    #swiperhydk .prev { background-image: ; width: 32px; height: 54px; margin-top: -27px; -moz-background-size: 32px 54px; -webkit-background-size: 32px 54px; background-size: 32px 54px; }
    #swiperhydk .next { background-image: ; width: 32px; height: 54px; margin-top: -27px; -moz-background-size: 32px 54px; -webkit-background-size: 32px 54px; background-size: 32px 54px; }



.lecturerbig { width: 100%; padding: 0px 16px; border: solid 0px #000; background-color: #f2f2f2 }
    .lecturerbig > .lecturerconn { max-width: 1320px; width: 100%; margin: 0px auto; padding-top: 80px; padding-bottom: 80px; }
        .lecturerbig > .lecturerconn > .text { width: 88%; margin: 0px auto; margin-top: 120px; }


.lectureritem { display: flex; width: 100%; }
    .lectureritem .pic { width: 250px; height: 376px; background-color: #ffbd66; position: relative; }
        .lectureritem .pic > .userpic { position: absolute; top: -40px; bottom: 40px; left: 30px; z-index: 2; }
            .lectureritem .pic > .userpic > img { max-width: 100%; box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.2) }
    .lectureritem .content { flex: 1; position: relative; }
        .lectureritem .content > .item { z-index: 1; background-color: #fff; position: absolute; left: -180px; top: -80px; right: 0px; bottom: 20px; display: flex; align-items: center; }
            .lectureritem .content > .item > .left { width: 32%; }
            .lectureritem .content > .item > .right { flex: 1; padding: 0px 50px 100px 50px; border-left: solid 2px #f39800; text-align: left; }
                .lectureritem .content > .item > .right > b { font-size: 24px; display: block; color: #f39800; font-weight: 400; margin-bottom: 30px; }
                .lectureritem .content > .item > .right > p { font-size: 16px; line-height: 1.5; }
                    .lectureritem .content > .item > .right > p.p1 { font-size: 16px; margin-bottom: 20px; }
                        .lectureritem .content > .item > .right > p.p1 > i { font-size: 16px; color: #f39800; font-style: normal; }


@media only screen and (max-width:1024px) {
    .lecturerbig > .lecturerconn > .text { width: 100%; }
}

@media only screen and (max-width:768px) {
    .lecturerbig > .lecturerconn > .text { margin-top: 60px; }
    .lectureritem .pic { width: 150px; height: 226px; }
        .lectureritem .pic > .userpic > img { max-width: 150px; }
    .lectureritem .content > .item { left: -80px }
        .lectureritem .content > .item > .left { width: 120px; }
        .lectureritem .content > .item > .right { padding: 0px 20px 20px 20px; }
            .lectureritem .content > .item > .right > b { font-size: 18px; }
            .lectureritem .content > .item > .right > p { font-size: 14px; }
}


@media only screen and (max-width:640px) {
    .lectureritem .pic { width: 100px; height: 250px; }
        .lectureritem .pic > .userpic > img { max-width: 100px; }
    .lectureritem .content > .item { left: -40px }
        .lectureritem .content > .item > .left { width: 80px; }
        .lectureritem .content > .item > .right { padding: 0px 10px 10px 10px; }
            .lectureritem .content > .item > .right > b { font-size: 16px; }
            .lectureritem .content > .item > .right > p.p1 { font-size: 14px; }
            .lectureritem .content > .item > .right > p { font-size: 12px; }
}

@media only screen and (max-width:480px) {
    #swiperhydk .swiper-slide { padding: 80px 0px 50px 0px; }
    #swiperhydk .swiper-pagination-bullet { width: 18px; height: 6px; border-radius: 3px; opacity: 1; }
    #swiperhydk .swiper-pagination-bullet-active { width: 36px; height: 6px; border-radius: 3px; opacity: 1; }



    .lectureritem .pic > .userpic { display: none; }
    .lectureritem .content > .item { left: -80px }
        .lectureritem .content > .item > .left { width: 10px; }
        .lectureritem .content > .item > .right { border-left: none; }
}





.brandbig { width: 100%; padding: 0px 16px; border: solid 0px #000; background-color: #c7c7c7 }
    .brandbig > .brandconn { max-width: 1200px; width: 100%; margin: 0px auto; padding-top: 80px; padding-bottom: 80px; }
        .brandbig > .brandconn > ul { width: 100%; overflow: hidden; margin-top: 3.75rem; display: flex; flex-wrap: wrap; justify-content: space-between; }
            .brandbig > .brandconn > ul > li { width: 240px; height: 112px; overflow: hidden; }
                .brandbig > .brandconn > ul > li > img { max-width: 100% }


@media only screen and (max-width:768px) {
    .brandbig > .brandconn > ul { margin-top: 2rem; }
        .brandbig > .brandconn > ul > li { width: 160px; height: 74px; }
}

@media only screen and (max-width:480px) {
    .brandbig > .brandconn > ul { margin-top: 2rem; }
        .brandbig > .brandconn > ul > li { width: 50%; }
}





.olinebig { width: 100%; margin: 0px auto; padding-bottom: 60px; }
    .olinebig > .oline { text-align: center; width: 100%; padding: 30px 0px; background-image: ; background-repeat: no-repeat; background-position: top center; }
        .olinebig > .oline > .title { font-size: 36px; color: #fff; line-height: 1.5; }
            .olinebig > .oline > .title > p { font-size: 16px; }
            .olinebig > .oline > .title > b { color: #fff }

    .olinebig > .content { margin: 0px auto; width: 100%; font-size: 16px; max-width: 1000px; text-align: left; }
        .olinebig > .content ul { width: 100%; padding: 20px; }
            .olinebig > .content ul > li { width: 100%; padding: 5px 0px; }
                .olinebig > .content ul > li label { padding-left: 5px; }
                .olinebig > .content ul > li > div.box { margin-left: 1.5em; border: solid 1px #989898; text-align: left; width: 95%; background-color: #fff; padding: 3px 3px; border-radius: 3px; }
                    .olinebig > .content ul > li > div.box input[type='text'] { width: 100%; font-size: 16px; line-height: 1; padding: 3px 5px; border-style: none; }
                .olinebig > .content ul > li > div.chk { padding-left: 1.5em; border: solid 0px #000; width: 31%; display: inline-block; }
                    .olinebig > .content ul > li > div.chk label { padding-left: 10px; cursor: pointer; font-size: 16px; }



                .olinebig > .content ul > li > i { color: #999; font-style: normal; font-size: 14px; }
                .olinebig > .content ul > li.name { margin-top: 5px; }
                .olinebig > .content ul > li.btn { text-align: center; margin-top: 15px; }
                .olinebig > .content ul > li a.submit { background-color: #170c51; width: 61.8%; color: #fff; display: inline-block; font-size: 16px; line-height: 2.5; border-style: none; border-radius: 3px; }


@media only screen and (max-width:768px) {
    .olinebig > .oline > .title { font-size: 18px; }
        .olinebig > .oline > .title > p { font-size: 14px; }
    .olinebig > .content { font-size: 14px; }
        .olinebig > .content ul > li > div.box { margin-left: 0; width: 100%; }
        .olinebig > .content ul > li > div.chk { padding-left: 0; }
            .olinebig > .content ul > li > div.chk label { font-size: 14px; }
        .olinebig > .content ul > li > a.submit { width: 100%; font-size: 14px; }
}