@charset "utf-8";
[id] {scroll-margin-top: 80px; }
  html{ scroll-behavior: smooth;}
/********************
// header
********************/
header .logo img{filter: invert(1);}
header.scroll{background:#fefefe}
header.scroll .menu a{color:#222;}
header.scroll .logo img{filter: invert(0);}
/********************
// mainBanner
********************/
.mainBanner{background:url('../img/mainBannerBg.jpg')center center no-repeat; background-size:cover;}
.mainBanner img{right:15dvw; bottom:0}
.mainBanner span{color:#F9CF00}
/********************
// intro
********************/
.intro{background:url('../img/CertificateBg.jpg')center center no-repeat; background-size:cover}

/********************
// service
********************/
.serviceCnt{width:calc(33.3333% - 20px); border:1px solid #3F51C3; box-shadow: 0 0 8px rgba(84,105,222,0.15); align-self: stretch;}

/********************
// proccess
********************/
.proccess{background:url('../img/processBg.jpg')center center no-repeat; background-size: cover;}
.proccessCnt{width:calc(33.3333% - 20px);border:1px solid #F98100; align-self: stretch;}
.proccessNum{color:#962D00}
.proccessTit{color:#962D00}
/********************
// branch
********************/
.branch{background:url('../img/branchBg.jpg')center center no-repeat; background-size: cover;}

/********************
// contact
********************/
.contact{background:url('../img/contactBg.jpg')center center no-repeat; background-size: cover;}
.contact span{color:#f9cf00}
/********************
// footer
********************/
.fixBtn{right:60px; bottom:60px}