/* 头部 */
.headBox{
    width:100%;
    height:4rem;
    position: fixed;
    top:0;
    /* background:transparent; */
   z-index: 9999;
}
.headBox .content{
    width: 90%;
    margin:0 auto;
    height:4rem;
    line-height: 4rem;
    display:flex;
    justify-content: space-between;

}
.bgGreen{
    background:#32847E
}
.bgGreen .company{
    color:#FFFFFF;
}
.headBox ul{
    display: flex;
}
.headBox ul li{
    padding:0 1.5rem;
    cursor: default;
    font-size:1.5rem;
    color:#FFFFFF;
}
.company{
    font-size:1.1rem;
    color:#32847E;
    font-size:1.5rem;
}
/* 左侧导航 */
.leftNav{
    position: fixed;
    left:5%;
    top:20%;
    z-index: 9999;
    width:14rem;
    /* height:32.5rem; */
}
.leftNav ul{
    height:100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.leftNav ul li{
    height:4.1rem;
    display: flex;
    cursor: pointer;
}
.leftNav .xian{
    height:100%;
    width:1px;
    background:#32847E;
    margin-top:7px;
}
.leftNav ul li:last-child .xian{
    background: transparent;
}
.nav{
    position: relative;
    padding-left:1.2rem;
    color: #32847E;
}
.dian{
    display: block;
    width:10px;
    height:10px;
    background:#32847E;
    position: absolute;
    left:-6px;
    top:5px;
    border-radius: 50%;
}
.leftNav ul .active .navTitle{
    font-size:1.4rem;
    font-weight: bold;
}
.leftNav ul .active .dian{
    width:16px;
    height:16px;
    left:-8px;
    top:7px;
}

/* swiper */
.swiper-slide{
    position: relative;
}
.summary{
    position: absolute;
    top:23%;
    left:25%;
    width:32rem;
    z-index: 888;
}
.summary h1{
    font-size:3rem;
    color: #32847E;
    text-align: center;
    padding-bottom:1rem;
}
.summary h3{
    font-size:1.5rem;
    color: #32847E;
    text-align: right;
    font-weight: normal;
    padding-bottom:4.3rem;
}
.summary .text{
    line-height:2rem;
    color:#6E6E6E;
}
.swiper-slide .classroom{
    top:20%;
    left:20%;
}
.end{
    top:15%;
}
.swiper-slide .endImg{
    height:75%;
}
.second h1{
    padding-bottom:3rem;
}
.second .text{
    font-size:1.3rem;
}

.imgBox{
    width:100%;
    height:100%;
    background: pink;
}
.imgBox img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.photoBox{
    position: absolute;
    top:26%;
    right: 15%;
    z-index: 10;
}
.firstPhoto{
    width:35rem;
    height:35rem;
}
.photoBox img{
    width:100%;
    height:100%;
    object-fit: contain;
}
.genre{
    top:15%;
    right:10%;
}
/* .swiper-container .end{
    height:30rem;
    width:100%;
    background:black;
} */
/* 底部 */
.footerBox{
    width:100%;
    height:6.5rem;
    background:#2D2D2D;
    position: fixed;
    z-index: 999;
    bottom:0;
    color:#DFDFDF;
    padding:0.5rem 0 0.5rem 0 ;
}
.footer{
    width:90%;
    margin:0 auto;
    margin-bottom:0.3rem;
}
.footer h3{
    font-size:1.2rem;
    padding-bottom:0.3rem;
    font-weight: normal;
    text-align: center;
}


.footer .contact{
    display: flex;
    justify-content: space-around;
}
.footer ul{
    display:flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
.footer ul li{
    width:50%;
}
.flex1{
    flex:1;
}
.enterprise ul li{
    width:33%;
}
.qrImgBox{
    display:flex;
}
.qrImgBox>div{
    text-align: center;
}
.qrImgBox>div:first-child{
    margin-right:5rem;
    text-align: center;
}
.qrImgBox img{
    display: block;
    width:100px;
    height:100px;
    background:pink;
}
.qrImg{
    padding:5px;
    background:white;
    margin-bottom:0.2rem;
}
.filing ul{
    display:flex;
    width:100%;
    justify-content: center;
}
.filing{
    text-align: center;
}

.gongan{
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 6px;
    
}

.gongan img{
       width: 100%;
       height: 100%; 
      
}

.beianBox{
    display: flex;
    justify-content: center;
}


@media screen and (min-width: 500px) and (max-width: 800px) {
    .photoBox{
        width:20rem;
        top:35%;
    }
}
@media screen and (min-width: 800px) and (max-width: 1000px) {
    .photoBox{
        width: 25rem ;
        top:35%;
    }
}
@media screen and (min-width: 800px) and (max-width: 1800px) {
    .photoBox{
        width: 35rem ;
        top:35%;
    }
    .firstPhoto{
        height: 25rem;
        right:5%;
    }
}