.sf-banner{
    width:100%;
    height:500px;
    background:url("../images/sf-banner.png") no-repeat center;
    background-size:100% 100%;
}

.sf-team-box{
    margin:80px 0;
}
.title-box{
    width:100%;
    height:56px;
    font-size:36px;
    font-weight: bold;
    color:#333;
    line-height: 36px;
}
.sf-team-box .detail-box{
    width:100%;
    height:520px;
}

.sf-left{
    width:600px;
    height:520px;
}
.sf-left>img{
    width:100%;
    height:100%;
    border-radius: 20px;
}
.sf-right{
    width:600px;
    height:520px;
    padding:25px;
}
.sf-right>.team-text{
    text-indent:2em;
    word-break:break-all;
    font-size:18px;
    color:#333;
}
.sf-btn-box{
    width:100%;
    height:80px;
    margin-top:40px;
}

.btn-ul li{
    float:left;
}
.btn-ul li.active a{
    background:#ff682f;
    color:#fff;
    box-shadow: 0 5px 30px rgba(0,0,0,0.3);
}
.btn-ul li a{
    display: block;
    text-align: center;
    line-height: 80px;
    font-size:24px;
    color:#333;
    width:156px;
    height:80px;
    border-radius: 20px;
    margin-right:18px;
    background:#fff;
    /* box-shadow: 0 15px 30px rgba(0,0,0,0.3); */
    /* box-shadow: inset 0px 1px  3px rgba(0,0,0,0.5); */
    box-shadow: 0px 2px  4px rgba(0,0,0,0.3);
}
.btn-ul li a.marNo{
    margin-right: 0;
}
.p2-text{
    color:#333;
    font-size:14px;
    word-break:break-all;
    padding-bottom:20px;
}

.bg-activity{
    width:100%;
    height:820px;
    background:url("../images/bg-activity.png") no-repeat center;
    background-size:100% 100%;
    margin-top:30px;
    margin-bottom:80px;
}

.sf-care-box{
    margin-bottom:80px;
}
.care-img-box{
    width:100%;
    height:1114px;
    background:url("../images/bg-care.png") no-repeat center;
    background-size:100% 100%;
}

/* 照片墙 */
.heartPic{
    width: 1200px;
    height: 1114px;
    position: relative;
    margin-top: 60px;
}
.heartPic ul{
    float: left;
    width: 1200px;
}
.heartPic ul.last-ul{
    display:flex;
    justify-content: center;
}
.heartPic ul.last-ul li{
    width:240px;
}
.heartPic ul.last-ul li img{
    width:240px;
}
.heartPic ul li{
    float: left;
    width: 165px;
    height: 165px;
    margin-right: 7.5px;
    margin-bottom:7.5px;
}
.heartPic ul li.w-xl{
    width:337.5px;
}
.heartPic ul li.w-xl img{
    width:337.5px;
}
.heartPic ul li.w-xxl{
    width:510px;
}
.heartPic ul li.w-xxl img{
    width:510px;
}

.heartPic ul li:last-child{
    margin-right: 0;
}
.heartPic ul li.marNo{
    margin-right:0;
}
.heartPic ul li img{
    width:165px;
    height:165px;
    transition:all .5s;
}
.heartPic ul li img:hover{
    transform:scale(2.0);
    z-index: 999;
}
.center-img{
    position: absolute;
    cursor: pointer;
    width:337.5px;
    height:337.5px;
    left:517.5px;
    top:345px;
}
.center-img>img{
    width:100%;
    height:100%;
    transition:all .5s;
}
.center-img>img:hover{
    transform:scale(1.5);
    z-index: 999;
}

.sf-team-box ul {
    height: 704px;
    width: 100%;
}
.sf-team-box ul .team-introduction{
    width: 386px;
    float: left;
    margin-left: 21px;
}
.sf-team-box .team-introduction .team-img{
    position: relative;
    overflow: hidden;
}
.sf-team-box .team-introduction img{
    width: 140px;
    height: 44px;
    position: absolute;
    
}
.sf-team-box .team-introduction .team-service{
    width: 100%;
    height: 314px;
    background: url('../images/team_service.png');
    background-size: 100% 100%;
    margin-top: 21px; 
}

.sf-team-box .team-introduction .team-operating{
    width: 100%;
    height: 314px;
    background: url('../images/team_operating.png');
    background-size: 100% 100%;
    margin-top: 21px; 
}
.sf-team-box .team-introduction .team-technical{
    width: 100%;
    height: 314px;
    background: url('../images/team_technical.png');
    background-size: 100% 100%;
    margin-top: 21px; 
}
.sf-team-box .team-introduction h5{
    color: #333;
    font-weight: 700;
    font-size: 20px;
    margin-top: 20px;
}
.sf-team-box .team-introduction p{
    font-size: 14px;
    color: #333333;
    margin-top: 10px;
}
.sf-team-box .team-introduction.marLeft0{
    margin-left: 0;
}
@media (min-width: 1200px) {
    .sf-banner{
        height:313px;
    }

}
@media (min-width: 1280px) {
    .sf-banner{
        height:334px;
    }
    
}
@media (min-width: 1440px) {
    .sf-banner{
        height:375px;
    }

}
@media (min-width: 1679px) {
    .sf-banner{
        height:438px;
    }

}

@media (min-width: 1920px) {
    .sf-banner{
        height:500px;
    }
}

@media (min-width: 2048px) {
    .sf-banner{
        height: 667px;
    }
}