﻿
.toptabdiv {
    width: 100%;
    background-color: #f3f6f9;
    border-bottom: 1px solid #c6c6c6;
}

.tabdiv {
    width: 78%;
    margin: auto;
    height: 80px;
    display: flex;
}

.tabitem {
    line-height: 80px;
    font-size: 20px;
    font-family: 'Alibaba PuHuiTi 2.0';
    width: 120px;
    cursor: pointer;
    position: relative;
}

.tabitemactive {
    color: #33b0ff;
}


.tabitem b {
    position: absolute;
    display: block;
    width: 0;
    height: 2px;
    background: #33b0ff;
    left: 0;
    bottom: 0px;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    margin-right: 5px;
}


.fagsleftline {
    margin-top: 20px;
    height: 3px;
    width: 50px;
    background-color: black;
}

.fagspage {
    width: 100%;
    background-color: #f3f6f9;
}

.fagsleft {
    width: 60%;
}

.fagslefttitle1 {
    margin-top: 100px;
    font-size: 35px;
    font-family: 'Alibaba PuHuiTi 2.0';
}

.fagslefttitle2 {
    margin-top: 50px;
    font-size: 18px;
    color: #808080;
    line-height: 30px;
    width: 80%;
}


.zxzxbtn {
    width: 122px;
    height: 40px;
    color: white;
    line-height: 50px;
    font-size: 20px;
    text-align: center;
    background: url(../images//MetaHumen/zxzxbtn.png) no-repeat;
    background-size: 100% 100%;
    margin-top: 80px;
}

.fagsdiv {
    width: 78%;
    height: 620px;
    margin: auto;
    display: flex;
}

.fagsright {
    width: 40%;
    text-align: center;
}

.fagsrightbg {
    margin-top: 195px;
    width: 100%;
}

.fayspage {
    width: 100%;
    height: 850px;
    background-color: white;
}

.faysdiv {
    width: 78%;
    margin: auto;
}

.pagetitle {
    padding-top: 80px;
    font-size: 35px;
    font-family: 'Alibaba PuHuiTi 2.0';
    line-height: 50px;
    text-align: center;
}


.pagetitleline {
    width: 150px;
    height: 3px;
    background-color: #3e80fd;
    margin: auto;
    margin-top: 5px;
}

.fayslist {
    width: 100%;
    margin: auto;
    display: flex;
    margin-top: 50px;
    flex-wrap: wrap;
}

.faysitem {
    width: 31%;
    margin: 1%;
    margin-top: 35px;
    text-align: center;
}

.faysitemimg {
    width: 100%;
    height: 100px;
}

    .faysitemimg img {
        width: 50px;
        height: 50px;
        margin-top: 30px;
    }

.faysitemtitle1 {
    font-size: 25px;
    font-family: 'Alibaba PuHuiTi 2.0';
    line-height: 50px;
}

.faysitemtitle2 {
    clear: both;
    font-size: 16px;
    color: #898989;
    width: 75%;
    line-height: 30px;
    margin: auto;
    margin-top: 10px;
}




.hxgnpage {
    width: 100%;
    height: 900px;
}


.pagetitle2 {
    margin-top: 20px;
    text-align: center;
    font-size: 15px;
}

.hxgncenter {
    width: 80%;
    margin: auto;
    display: flex;
    height: 650px;
    margin-top: 30px;
}


.hxgnleftdiv {
    width: 69%;
    display: flex;
    margin: 0.5%;
    flex-wrap: wrap;
    justify-content: space-around;
    align-content: flex-start;
}


.hxgnrightdiv {
    width: 29%;
    height: 640px;
    display: flex;
    margin: 0.5%;
    background: url("../images/MetaHumen/hxgnright1.png") no-repeat;
    background-size: 100% 100%;
    flex-wrap: wrap;
    align-content: flex-start;
}

.hxgnleftitem1 {
    width: 100%;
    height: 450px;
    background: url("../images/MetaHumen/hxgnleft1.png") no-repeat;
    background-size: 100% 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}


.hxgnleftitem2 {
    width: 49%;
    height: 180px;
    background: url("../images/MetaHumen/hxgnleft2.png") no-repeat;
    background-size: 100% 100%;
    margin-top: 10px;
}

.hxgnleftitem1top {
    width: 100%;
    height: 50px;
    margin-top: 30px;
    margin-left: 3%;
}

.hxgnleftitem1topimg {
    width: 90px;
    height: 90px;
    text-align: center;
    float: left;
}


.hxgnleftitem1toptitle {
    float: left;
    color: white;
    font-size: 25px;
    margin-top: 13px;
}

.hxgnleftitem1center1 {
    width: 30%;
    height: 333px;
    background: url("../images/MetaHumen/hxgnleftimg1.png") no-repeat;
    background-size: 100% 100%;
    float: left;
    cursor: pointer;
    position: relative; /* 确保可以使用top属性 */
    transition: transform 0.5s ease;
}

    .hxgnleftitem1center1:hover {
        transform: translateY(-5px);
    }

.hxgnleftitem1center2 {
    width: 30%;
    height: 333px;
    background: url("../images/MetaHumen/hxgnleftimg2.png") no-repeat;
    background-size: 100% 100%;
    float: left;
    cursor: pointer;
    transition: transform 0.5s ease;
}

.hxgnleftitem1center2:hover {
    transform: translateY(-5px);
}

.hxgnleftitem1center3 {
    width: 30%;
    display: flex;
    flex-wrap: wrap;
    cursor: pointer; 
    
} 



.hxgnleftitem1center3img { 
    width: 100%;
    background: url("../images/MetaHumen/hxgnleftitem1center3.png") no-repeat;
    background-size: 100% 100%;
    height: 159px;
    transition: transform 0.5s ease;
    cursor: pointer;
    transition: transform 0.5s
}

    .hxgnleftitem1center3img:hover {
        transform: translateY(-5px);
    }
.hxgnrightitem {
    width: 90%;
    margin: auto;
    margin-top: 10px;
    background: url(../images/MetaHumen/hxgnright2.png) no-repeat;
    background-size: 100% 100%;
    height: 76px;
    padding-left: 5%;
    padding-top: 1%;
    cursor: pointer;
    transition: transform 0.5s ease;
}

    .hxgnrightitem:hover {
        transform: translateY(-5px);
    }


.hxgnrightitem1toptitle {
    float: left;
    font-size: 25px;
    margin-top: 13px;

}

.hxgnrightitemtitle1 {
    font-weight:600;
    font-size:20px;
    line-height:42px;
}
.hxgnrightitemtitle2 {
    font-size:14px;
   color:#4e4e4e;
}


.hxgnlefttitle1 {
    font-size: 25px;
    font-weight: 600;
    color: #0a71fe;
    line-height: 60px;
    margin-left: 20px;
}

.hxgnlefttitle2 {
    margin-left: 20px;
    color:#4e4e4e;
    width:90%
}

.hxgnleftitem2div {
  width:95%;
  margin-left:5%;
}

.hxgnleftitem2top {
    width: 100%;
    height: 50px;
    margin-top: 15px;
}

.hxgnleftitem2topimg {
   width:45px; 
   float:left; 
}

.hxgnleftitem2toptitle {
  margin-left:5px;
  float:left;
  font-size:18px;
  font-weight:600;
  line-height:30px;
}

.hxgnleftitem2cneter {
    width: 95%;
    height: 100px;
    background-color: white;
    border-radius: 20px;
    padding-left: 5%;
    cursor: pointer;
    transition: transform 0.5s ease;
}

    .hxgnleftitem2cneter:hover {
        transform: translateY(-5px);
    }

.hxgnleftitem2cnetertitle1 {
      font-weight:600;
      font-size:20px;
      line-height:50px;
      padding-top:10px;
 }

.hxgnleftitem2cnetertitle2 {
    font-size:15px;
    color:#4e4e4e;
}


.jsldpage {
    width: 100%;
    height: 900px;
    background: url("../images/MetaHumen/jsldpagebg.png") no-repeat;
    background-size: 100% 100%;
}

.jsldcenter {
    width: 80%;
    margin: auto;
    margin-top: 50px;
    display: flex;
}


.jsldcenterleft {
    width: 18%;
}

.jsldcentermid {
    width: 42%;
    margin:1%;
}

.jsldcenterright {
    width: 36%;
    margin: 1%;
}

.jsldcenterleft {
   margin-top:8%;
}


    .jsldcenterleft ul {
        color: #7b8792;
        font-size: 15px;
        line-height: 50px; 
        list-style-type: disc !important;
    }

    .jsldcenterleft ul li{ 
        list-style-type: disc !important;
    }


    .jsldcenterleftlihover {
        color: white;
        list-style-type: disc !important;
    }


.jsldcentermid img{
    width: 100%
}

.jsldcenterright img {
    width: 100%
}

.jsldcenterrighttitle1 {
 font-size:33px;
 color:white;
 line-height:50px;
 font-weight:600;
}

.jsldcenterrighttitle2 {
    font-size: 16px;
    color: #ebebeb;
    margin-top: 20px;
    line-height: 27px;
    height: 100px;
}

.yycjpage {
    width:100%;
    height:850px;
    background-color:#e9f1fc;

}

.yycjcenter {
  width:80%;
  margin:auto;
  margin-top:50px;
}

.yycjcenterbtndiv {
   width:70%;
  height:100px;
  display:flex;
  margin:auto;
}

.yycjcenterbtnitem {
    width: 10%;
    margin: 2%;
    text-align: center;
    line-height: 40px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #808080;
    cursor:pointer;
}

.yycjcenterbtnitemactive {
    color: white;
    background-color: #0328d9;
    border: 1px solid #0328d9;
}


.yycjcenterbottom {
   margin-top:30px;
   width:80%;
   margin:auto;
   display:flex;
}

.yycjcenterbottomitem {
   width:50%;
   height:450px;
}
.yycjcenterbottomitem img {
    width:100%;
    height:100%;

}

.yycjcenterbottomtitle1 {
    font-size: 45px;
    color: #1217db;
    font-weight: 600; 
    padding:6%;
    line-height:50px;
     
}

.yycjcenterbottomtitle2 {
    font-size: 18px;
    color: #7b8792;
    line-height: 35px;
    padding:0 6%;
}

    .yycjcenterbottomtitle2 span {
        color: #ff3e3f;
    }

.yyjzpage {
    width:100%; 
    height:980px;
    background:url('../images/MetaHumen/yhjzbg.png') no-repeat;
    background-size:100% 100%;
}

.yyjzcenter {
  width:80%;
  margin:auto;
  display:flex;
  margin-top:50px; 
}


.yyjzcenteritem {
   width:15%;
   height:520px;
   margin:0.2%;
}

.yyjztemcenter {
    padding: 2% 5%;
}
.yyzjitemtitle1 {
    font-size: 35px;
    font-weight: 600;
    color: white;
    line-height: 70px;
}

.yyzjitemtitle2 {
    font-size: 16px;
    color: #e5e5e5;
}

.yyzjitemline {
    width: 40px;
    height: 5px;
    background-color: white;
}

.yyjzitem01 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitemcenter01.png') no-repeat;
    background-size: 100% 100%;
}
.yyjzitem01-1 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitem01.png') no-repeat;
    background-size: 100% 100%;
    display: none;
}

.yyjzitem02 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitemcenter02.png') no-repeat;
    background-size: 100% 100%;
    display: none;
}

.yyjzitem02-1 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitem02.png') no-repeat;
    background-size: 100% 100%;
   
}

.yyjzitem03 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitemcenter03.png') no-repeat;
    background-size: 100% 100%;
    display: none;
}

.yyjzitem03-1 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitem03.png') no-repeat;
    background-size: 100% 100%;
}

.yyjzitem04 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitemcenter04.png') no-repeat;
    background-size: 100% 100%;
    display: none;
}

.yyjzitem04-1 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitem04.png') no-repeat;
    background-size: 100% 100%;
}



.yyjzitem05 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitemcenter05.png') no-repeat;
    background-size: 100% 100%;
    display: none;
}

.yyjzitem05-1 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitem05.png') no-repeat;
    background-size: 100% 100%;
}


.yyjzitem06 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitemcenter06.png') no-repeat;
    background-size: 100% 100%;
    display: none;
}

.yyjzitem06-1 {
    width: 100%;
    height: 100%;
    background: url('../images/MetaHumen/hxmkitem06.png') no-repeat;
    background-size: 100% 100%;
}

.yyjzitemmax {
    width: 50% !important;
    -webkit-transition: 1s;
    transition: 1s;
}


.yyzjbtndiv {
    width: 28%;
    margin: auto;
    margin-top: 80px;
    display: flex;
    justify-content: space-evenly;
}

.yyzjzbtn {
    width: 200px;
    height: 50px;
    border-radius: 10px;
    background-color: #f2f5f8;
    color: #006afe;
    border: 2px solid #006afe;
    text-align: center;
    line-height: 50px;
    cursor: pointer;
}