@media all and (max-width: 2000px) {

}
@media all and (max-width: 1500px) {
    .navMenu .menuList li{
        padding: 35px 20px;
    }
}

@media all and (max-width: 1200px) {
    .navWrap{
        height: 100px;
    }
    .navCon{
        height: 100px;
    }
    .navLogo{
        width:160px;
        height: 100px;
    }
    .navLogo img{
        height:100px;
        padding:35px 0;
    }
    .navMenu .menuList li{
        height: 40px;
        padding: 30px 15px;
        line-height: 40px;
        font-size: 15px;
    }
    .searchIcon{
        height: 100px;
    }
    .searchIcon img{
        height:100px;
        padding:40px 0;
    }
}
@media all and (max-width: 1000px) {
    .navCon{
        width:95%!important;
    }
    .zoologyCon{
        width:95%!important;
    }
    .technologyCon{
        width:95%!important;
    }
    .recordAbout{
        width:95%!important;
    }
    .joinAbout{
        width:95%!important;
    }
    .recordWrap{
        width:95%!important;
    }
    .connectWrap{
        width:95%!important;
    }
    .connectRightCon{
        width:95%!important;
    }
    .recordAboutRight{
        right: -10%!important;
    }
    .recordAboutRight img{
        height: calc(45%*1) !important;
        margin-top: calc(100vh*0.34) !important;
    }
}

@media all and (max-width: 750px) {
    .navMenu{
        display: none!important;
    }
    .bannerWord .themTitle{
        font-size: 40px!important;
        line-height: 90px!important;
    }
    .bannerWord .themDesc{
        font-size: 16px!important;
        line-height: 30px!important;
    }
    .recordWrap{
        width:80%!important;
        display: flex!important;
        justify-content: center!important;
        flex-direction: column!important;
    }
    .recordWordLeft{
        width:100%!important;
        height: auto!important;
        display: flex!important;
        justify-content: flex-start!important;
        padding-top:20%!important;
    }
    .recordWordLeft h2{
        height: 30px!important;
        font-size: 30px!important;
        line-height: 30px!important;
    }
    .recordWordLeft h3{
        height: 48px!important;
        font-size: 14px!important;
        line-height: 48px!important;
    }
    .recordWordLeft p{
        font-size: 16px!important;
        line-height: 30px!important;
        margin-top:20px!important;
    }
    .recordWordRight{
        width:100%!important;
        height: auto!important;
    }
    .recordWordRight img{
        width:80%!important;
    }
    .connectWrapLimit{
        display: flex;
        justify-content: center!important;
        flex-direction: column!important;
    }
    .connectWrap{
        width:80%!important;
        height: auto!important;
        display: flex;
        justify-content: flex-start!important;
        flex-direction: column!important;
    }
    .connectLeft{
        width:100%!important;
        height: auto!important;
    }
    .connectLeft h2{
        height: 30px!important;
        font-size: 30px!important;
        line-height: 30px!important;
    }
    .connectLeft h3{
        height: 48px!important;
        font-size: 14px!important;
        line-height: 48px!important;
    }
    .connectLeft ul{
        padding-top:20px!important;
        padding-bottom: 10%!important;
        background: url(./../images/img33@2x.png) no-repeat 160px -10px;
        background-size: 142px;
    }
    .connectLeft ul li{
        height: 20px!important;
        font-size: 14px!important;
        line-height: 20px!important;
        margin-bottom: 10px!important;
    }
    .connectLeft ul li img{
        width:16px!important;
        height: 16px!important;
        margin-right: 6px!important;
    }

    .connectRight{
        width:100%;
        height: auto!important;
        position: static!important;
    }
    .connectRight .bgPic{
        display: none!important;
    }
    .connectRightCon{
        width:95%!important;
        height: auto!important;
        margin:0 auto;
        position: relative;
    }
    .themPic{
        display: none!important;
    }
    .connMenuList{
        width:90%!important;
        position: static!important;
        margin:0 auto!important;
        display: flex!important;
        flex-wrap: wrap!important;
    }
    .connMenuList li{
        width:33.333%!important;
        margin-bottom: 10px!important;
    }
    .zoologyList{
        flex-direction: column!important;
        justify-content: center!important;
    }
    .zoologyList li{
        width:100%!important;
        display: flex!important;
        justify-content: flex-start!important;
        margin:20px 0!important;
    }
    .zoologyList li img{
        width:40%!important;
        flex-shrink: 0!important;
        height: auto!important;
    }
    .zoologyList li .descWrap{
        width:55%!important;
        padding-left:2%!important;
    }
    .zoologyList li p.title{
        text-align: left!important;
        height: 26px!important;
        font-size: 18px!important;
        line-height: 26px!important;
        margin:10px 0!important;
        padding-top:15px!important;
        box-sizing: content-box!important;
    }
    .zoologyList li p.desc{
        text-align: left!important;
        font-size: 10px!important;
        line-height: 22px!important;
    }


    .recordAbout{
        width:85%!important;
        justify-content: center!important;
        flex-direction: column!important;
    }
    .recordAboutLeft{
        width:100%!important;
        height: auto!important;
        position: relative!important;
        z-index: 22!important;
        flex-shrink: 0!important;
    }
    .recordAboutLeft h2{
        height: 30px!important;
        font-size: 30px!important;
        line-height: 30px!important;
    }
    .recordAboutLeft h3{
        height: 48px!important;
        font-size: 14px!important;
        line-height: 48px!important;
    }
    .recordAboutLeft p{
        width: 100%!important;
        font-size: 16px!important;
        line-height: 30px!important;
        margin-top:10px!important;
        padding-bottom: 20px!important;
    }
    .recordAboutRight{
        width:100%!important;
        height: auto!important;
        right: 0!important;
    }
    .recordAboutRight img{
        width:40%!important;
        height: auto!important;
        margin-top: 0!important;
        position: relative!important;
        left: 10%!important;
    }
    .recordAboutRight img:nth-last-child(1){
        top: 5%!important;
        left: -20%!important;
    }

    .joinAbout{
        width:85%!important;
    }
    .joinAboutLeft h2{
        height: 30px!important;
        font-size: 30px!important;
        line-height: 30px!important;
    }
    .joinAboutLeft h3{
        height: 48px!important;
        font-size: 14px!important;
        line-height: 48px!important;
    }
    .joinAboutLeft p{
        font-size: 16px!important;
        line-height: 30px!important;
        margin-top:50px!important;
    }

    .technologyCon{
        width:85%!important;
        justify-content: center!important;
        flex-direction: column!important;
        overflow: hidden!important;
    }
    .technologyConLeft{
        width:100%!important;
        height: auto!important;
    }
    .technologyConLeft h2{
        height: 30px!important;
        font-size: 30px!important;
        line-height: 30px!important;
    }
    .technologyConLeft h3{
        height: 48px!important;
        font-size: 14px!important;
        line-height: 48px!important;
        padding-top:0!important;
    }
    .technologyGif{
        width: 120%!important;
        height: auto!important;
        position: static!important;
        background: url(./../images/2864b8a62a344bdfd4e00a0d4d252c76.gif) no-repeat bottom right!important;
        background-size: 250px auto!important;
        margin-top:50px!important;
        padding-bottom: 170px;
    }
    .technologyGifCon{
        width:80%!important;
        position: static!important;
        height: auto!important;
    }
    .technologyGifCon .technologyGifConLeft{
        width: 100%!important;
        height: 140px!important;
        position: relative!important;
        left: 0!important;
        top:0!important;
    }
    .technologyGifCon .technologyGifConRight{
        width: 100%!important;
        height: 140px!important;
        position: relative!important;
        left: 0!important;
        top:0!important;
    }
    .technologyGifConItem{
        margin-bottom: 40px!important;
    }
    .technologyGifCon .technologyGifConRight .technologyGifConItemCover{
        height: 140px!important;
    }
    .technologyGifCon .technologyGifConLeft .technologyGifConItemCover{
        height: 140px!important;
    }
    .technologyGifConItem .gifCOnTitle{
        height: 28px!important;
        line-height: 28px!important;
        font-size:18px!important;
        padding:20px 0 0 18px!important;
    }
    .technologyGifConItem .gifCOnDesc{
        padding:10px 0 0 18px!important;
        height: 28px!important;
        line-height: 28px!important;
        font-size:14px!important;
    }
    .technologyGifConItem .iconPic.iconPic2{
        width:55%!important;
        top:30%!important;
        right: 5%!important;
    }
    .menuIcon{
        display: block!important;
    }
    .navWrap{
        height: 50px;
    }
    .navCon{
        width: 85% !important;
        height: 50px;
    }
    .navLogo{
        height: 50px;
    }
    .navLogo img{
        height:30px;
        padding:20px 0;
        box-sizing: content-box;
    }
    .navMenu .menuList li{
        height: 40px;
        padding: 30px 15px;
        line-height: 40px;
        font-size: 15px;
    }
    .searchIcon{
        height: 100px;
    }
    .searchIcon img{
        height:100px;
        padding:40px 0;
    }
}