@charset "utf-8";
/* CSS Document */
body{overflow-x: hidden;}
body img{width:100%;}

.height_100{height:100vh; overflow:hidden; position:relative; z-index:1;}
.pc_web{display:block !important;}
.m_web{display:none !important;}
@media screen and (max-width:996px){
    .pc_web{display:none !important;}
    .m_web{display:block !important;}
    .height_100{height:auto; overflow:auto;}
}



/*************************************导航css*******************************************/
header{display: flex; flex-direction: column; transition:all .5s ease-in-out;width:100%; height:80px; background:var(--white); position:fixed; z-index:99; left:0; top:0;}
header.sticky{max-width:100%;margin-left:0; box-shadow:0 0 15px rgba(0,0,0,.2); }
header.sticky .site_nav{background:rgba(224,224,224,1);}
header.sticky .bg-light{background:rgba(255,255,255,1) !important; border-radius:0;}

.navbar{padding:0; height:100%; justify-content: space-between;}
.navbar-brand{display:flex; align-items:center;}
.navbar .navbar-brand img{max-width:170px;}
.navbar .navbar-brand span{margin-top:8px;}
.navbar-collapse{flex-grow:0; margin-top: .4rem; justify-content: flex-end;}
.navbar-expand-lg .navbar-nav .nav-item{ padding: 0 2rem;}
.navbar-expand-lg .navbar-nav .nav-link{padding:0;}
.navbar-expand-lg .navbar-nav .nav-link.active,.navbar-expand-lg .navbar-nav .nav-link:hover{color:var(--yellowhover);}
.close,#navbarNav .navbar-brand{display: none;}

@media screen and (max-width:1440px){
    .navbar-expand-lg .navbar-nav .nav-item{ padding: 0 1.2rem;}
}

@media screen and (max-width:1368px){
  header{height:85px;}
  .navbar-expand-lg .navbar-nav .nav-link{font-size:1em;}
}

@media screen and (max-width:1280px){
    .navbar-brand{font-size:1.125rem;}
    .navbar-light .navbar-nav .nav-link{font-size:1.25em;}
}

@media screen and (max-width:996px){
    body{position: relative;}
    .navbar-brand{padding:0; font-size:1rem; font-weight:bold;}
    .navbar .navbar-brand img{max-width:70px;}
    .navbar-collapse{position:fixed; z-index: 9999; width:100%; max-width:100%; height:100vh; background:#f2f2f2; padding:1rem 2rem; top:0px; left:0; margin: 0;}
    .navbar-light .navbar-toggler{color: rgba(255, 255, 255, 0.5);border-color:rgba(255,255,255, 0.8); padding:0; line-height:1.25;}
    .navbar-light .navbar-toggler-icon{background-image:none; color:var(--white); font-size:1.35em; height:1.25em; }
    .nav-link{padding:0.8rem 1rem; border-bottom:1px #e2e2e2 solid;}
    .dropdown-menu{margin:0;background:none; padding-bottom:30px;}
    .dropdown-item{border-bottom:1px #e2e2e2 solid; text-align:left; line-height:3;}
    .navbar-light .navbar-nav .nav-link{color:rgba(255,255,255,.9);}
    .navbar-expand-lg .navbar-nav .nav-link{padding:1.5rem 1rem !important; font-size: 1.25em;}
    .nav-item-none{display:none;}
    .close{opacity: 1; font-size:1.4rem; display: flex; cursor: pointer; margin: 1rem .2rem .5rem 0;}
    .close:hover{color:#009679;}
    #navbarNav .navbar-brand{ display: flex; justify-content: center; align-items: center; margin:2rem 0; font-size:20px;}
    #navbarNav .navbar-brand img{max-width:160px;}
    .navbar-toggler{font-size: 1.7rem;}
    
}

@media screen and (max-width:576px){
    .fixed-top {position:relative;top: 0;right: 0;left: 0;z-index:9999;}
    header{max-width:100%; height:70px; margin: 0;}
    .navbar-collapse{ padding:0 1rem; margin: 0;}
    .navbar-expand-lg .navbar-nav .nav-link{font-size:1.25em;padding-right:0;padding-left:0;}
    .navbar{padding:0rem 1rem;}
    .navbar .navbar-brand{font-size:20px;}
    .navbar .navbar-brand img{max-width:140px; margin: 0;}
    .navbar-toggler {padding:0;}
    .site_nav{padding-right:0rem;}
    .navbar-toggler-icon {height: 1em; }
    .navbar-expand-lg .navbar-nav .nav-link.last{display: none;}
}



/*#################################################首页css #####################################################*/
.index_box{background:url(../images/index_bg.jpg) top center no-repeat; background-size:cover; position:relative;}
.index_box .col-lg-5{margin-top:25%;}
.index_box .col-lg-7{margin-top:26%;}
.index_box img.m_logo{max-width:75%;}
.index_box img.logo{max-width:410px; margin:0 0 12% 20%;}
.index_box h2{color:var(--yellowhover); font-style:italic; margin-top:20px;}
/*.index_box svg{position:absolute; z-index:-1; left:0; top:0; width:100%; height:100%; fill: rgba(234,116,63,.4); stroke-dasharray:2000;stroke-dashoffset:7000;
    animation:draw 5s;
    -webkit-animation:draw 8s;
    -moz-animation:draw 8s;
    -o-animation:draw 8s;}
*/
/*@keyframes draw{
    to{stroke-dashoffset:0}
}
@-webkit-keyframes draw{
    to{stroke-dashoffset:0}
}
@-moz-keyframes draw{
    to{stroke-dashoffset:0}
}
@-o-keyframes draw{
    to{stroke-dashoffset:0}
}*/

@media screen and (max-width:1440px){
  .index_box{background:url(../images/index_bg.jpg) top -60% right 35% no-repeat;}
  .index_box .col-lg-5{margin-top:23%; text-align:center;}
  .index_box .col-lg-7{margin-top:22%;}
  .index_box img.logo{max-width:410px; margin:0 0 9% 10%;}
}

@media screen and (max-width:1280px){
  .index_box{background:url(../images/index_bg.jpg) top -6% right 35% no-repeat;}
  .index_box .col-lg-5{margin-top:23%; text-align:center;}
  .index_box .col-lg-7{margin-top:22%;}
  .index_box img.logo{max-width:365px; margin:0 0 5% 5%;}
}

@media screen and (max-width:576px){
  .index_box{height:90vh;background:url(../images/m_index_bg.jpg) top center no-repeat; background-size:cover; text-align:center;}
  .index_box .col-lg-5{margin-top:38%;}
  .index_box .col-lg-7{margin-top:15%;}
  .index_box img.m_logo{max-width:65%;}
  .index_box img.logo{max-width:80%; margin:0 0 5% 0;}
  .index_box h2{color:var(--yellowhover); font-style:italic; margin-top:20px;}
}




/*################################################# 核心业务css #####################################################*/
.business_bg{background:#f7f7f7;}
.business_bg .container{padding-top:8%;}
.business_bg .row.pc_web{display:flex !important;}

.business_bg h1{line-height:1.4; margin:35px 0; text-align:center;}
.business_bg span{color: var(--yellowhover);}
.business_bg a{width:180px; height:55px; border:1px var(--yellowhover) solid; color:var(--yellowhover); margin:0 auto 120px; display:flex; align-items:center; justify-content:center;}
.business_bg a i{font-size:18px; margin-right:10px;}
.business_bg a:hover{background:var(--yellowhover); color:var(--white);}
.business_bg ul li{width:158px; height:58px; line-height:58px; text-align:center; border-radius:6px; border:1px #959595 solid; font-size:20px; margin-bottom:15px;}
.business_bg .row .col-lg-3:nth-child(1)::before{content:""; width:110px; height:1px; background:var(--yellowhover); position:absolute; right:0; top:50%; animation:fadeInRight .8s; -webkit-animation:fadeInRight .8s;}
.business_bg .row .col-lg-3:nth-child(1)::after{content:"\e735"; font-family:"iconfont"; font-size:14px; color:var(--yellowhover); position:absolute; top:calc(50% - 11px); right:110px; animation:fadeInRight .8s; -webkit-animation:fadeInRight .8s;}
.business_bg .row .col-lg-3:nth-child(3) ul{float:right;}
.business_bg .row .col-lg-3:nth-child(3)::before{content:""; width:110px; height:1px; background:var(--red); position:absolute; left:0; top:50%;animation:fadeInLeft .8s; -webkit-animation:fadeInLeft .8s;}
.business_bg .row .col-lg-3:nth-child(3)::after{content:"\e60c"; font-family:"iconfont"; font-size:14px; color:var(--red); position:absolute; top:calc(50% - 11px); left:100px;animation:fadeInLeft .8s; -webkit-animation:fadeInLeft .8s;}
.business_bg .row .col-lg-6{display:flex; align-items:center; justify-content:center;}

.processingbar {text-align: center; position: relative; width:300px; transform:scale(3); display:inline-block;}
.processingbar::before{content:"";width:65px; height:1px; background:var(--yellowhover); position:absolute; z-index:99;}
.processingbar font {color:transparent; display: block; position:absolute; left: 0; top: 0; margin: 0px 0 0 0px;}
.processingbar div{position:absolute; left:46.5%; top:24%; line-height:1.4;}
.processingbar div i{font-size:20px;}
.processingbar div p{font-size:18px;}
#processingbar::before{transform:rotate(118deg); top:49%; right:22.4%; animation:ani-svg .8s; -webkit-animation:ani-svg .8s;}
#processingbar2::before{transform:rotate(62deg); top:49%; left:22.4%; animation:ani-svg2 .8s; -webkit-animation:ani-svg2 .8s;}
#processingbar svg{transform:rotate(135deg);}
#processingbar2 svg{transform:rotate(-45deg);}
#processingbar div{color:var(--yellowhover);}
#processingbar2 div{color:var(--red); top:20%;}
#processingbar2 div i{font-size:26px;line-height:1.15;}

@media screen and (max-width:1280px){
  .business_bg a{margin:0 auto 70px;}
  .processingbar {transform:scale(2.5);}
  .business_bg .row .col-lg-3:nth-child(1)::before{width:60px; right:15px;}
  .business_bg .row .col-lg-3:nth-child(3)::before{width:60px; left:15px;}
  .business_bg .row .col-lg-3:nth-child(1)::after{right:65px;}
  .business_bg .row .col-lg-3:nth-child(3)::after{left:65px;}
  #processingbar::before{transform:rotate(120deg); right:18%;}
  #processingbar2::before{transform:rotate(60deg); left:18%;}
}

@media screen and (max-width:576px){
  .business_bg .row.pc_web{display:none !important;}
  .business_bg .container{padding-top:80px;}
  .business_bg a{width:160px; height:45px; margin:0 auto 50px;}
  .business_bg ul{display:flex; justify-content:center; flex-wrap:wrap;}
  .business_bg ul li{width:42%; height:48px; line-height:48px; font-size:16px; margin:0 7px 15px 7px;}
  .business_bg .row{padding-bottom:40px;}
  .business_bg .row .col-lg-3:nth-child(1)::before,.business_bg .row .col-lg-3:nth-child(1)::after,.business_bg .row .col-lg-3:nth-child(3)::before,.business_bg .row .col-lg-3:nth-child(3)::after{display:none;}
  .business_bg .title{font-size:32px; color:var(--yellowhover); line-height:1.2; padding-bottom:15px; display:flex; align-items:center; justify-content:center;}
  .business_bg .title2{font-size:32px; color:var(--red); line-height:1.2; padding:25px 0 10px; display:flex; align-items:center; justify-content:center;}
  .business_bg .title i{padding-right:15px;font-size:38px;}
  .business_bg .title2 i{padding-right:10px;font-size:46px;}
}



/*#################################################公司简介css #####################################################*/
.about_bg{background:url(../images/about_bg.jpg) top center no-repeat; background-size:cover;}
.about_bg .container{padding-top:14%;}
.about_box{background:var(--white); border-top-right-radius:80px; padding:50px 50px; height:100%;}
.about_box:hover{border:1px var(--yellowhover) solid; box-shadow:0 0 15px rgba(252,164,0,.2); transform:translateY(-35px); transition:all .3s ease-in-out}
.about_bg h5{color: var(--yellowhover); line-height:1.6; margin:35px 0;}
.about_bg p{color: var(--7b7b7b);}
.about_bg .mb_30{margin-bottom:30px;}

@media screen and (max-width:1280px){
  .about_box{border-top-right-radius:60px; padding:40px 40px;}
}

@media screen and (max-width:576px){
  .about_bg .container{padding-top:22%;}
  .about_box{margin-bottom:30px; height:auto;}
  .about_box:hover{transform:translateY(-15px);}
  .about_bg h5{margin:25px 0;}
  .about_bg .mb_30{margin-bottom:20px;}
}


/*################################################# 合作品牌css #####################################################*/
.cooperation_bg{background:#f7f7f7; text-align:center;}
.cooperation_bg .row{padding-top:6.5%; max-width:72%; margin:0 auto;}
.cooperation_bg .col-lg-2{padding:0 0 20px 0;}
.cooperation_bg a{width:180px; height:55px; border:1px var(--yellowhover) solid; color:var(--yellowhover); margin:20px auto; display:flex; align-items:center; justify-content:center;}
.cooperation_bg a i{font-size:18px; margin-right:10px;}
.cooperation_bg a:hover{background:var(--yellowhover); color:var(--white);}
.cooperation_bg h5{margin:5px 0 10px 0;}
.cooperation_bg p{margin-top:20px; font-size:28px;}

@media screen and (max-width:1440px){
  .cooperation_bg .row{padding-top:8%; max-width:85%;}
}

@media screen and (max-width:1280px){
  .cooperation_bg .row{padding-top:15%; max-width:100%;}
  .cooperation_bg h5{margin:5px 0 20px 0; font-weight:bold; font-size:20px;}
  .cooperation_bg p{margin-top:10px; font-size:20px;}
}

@media screen and (max-width:576px){
    .cooperation_bg .row{padding-top:80px; max-width:100%;}
    .cooperation_bg .col-lg-2{padding:0 0 10px 0;}
    .cooperation_bg .col-12{margin:20px 0; font-weight:bold;}
    .cooperation_bg p{margin-top:20px; font-size:16px;}
    .cooperation_bg a{width:160px; height:45px;margin:20px auto 30px;}
}


/*################################################# 联系我们css #####################################################*/
.contact_bg{background:#f7f7f7;}
.contact_bg .container{padding-top:6.5%; text-align:center;}
.contact_bg .row{text-align:left; display:flex; align-items:center;}
.contact_bg img.contact_img{max-width:850px; margin:80px 0 150px;}
.contact_bg h4{font-size:32px; margin-bottom:20px;}
.contact_bg .col-xl-5 p{line-height:2.5; font-size:18px; display:flex; align-items:center;}
.contact_bg i{margin-right:12px; font-size:24px;}
.contact_bg .col-xl-7{display:flex; justify-content:center; flex-wrap:wrap;}
.contact_bg .col-xl-7 div{margin:0 10px; text-align:center;}
.contact_bg .col-xl-7 img{max-width:165px; margin-bottom:5px;}

@media screen and (max-width:1280px){
  .contact_bg img.contact_img{max-width:65%; margin:50px 0 100px;}
  .contact_bg .col-xl-7 img{max-width:135px;}
}

@media screen and (max-width:996px){
  .contact_bg img.contact_img{max-width:65%; margin:80px 0 100px;}
  .contact_bg .col-xl-7 img{max-width:165px; margin-top:20px;}
}


@media screen and (max-width:576px){
    .contact_bg img.contact_img{max-width:100%; margin:80px 0 60px;}
    .contact_bg h4{font-size:24px; margin-bottom:15px;}
    .contact_bg .col-xl-5 p{line-height:2; font-size:16px;}
    .contact_bg i{font-size:20px;}
    .contact_bg .col-xl-7{margin:30px 0; display:flex; flex-wrap:wrap;}
    .contact_bg .col-xl-7 div{margin:0;max-width:50%;}
    .contact_bg .col-xl-7 img{max-width:80%; margin-bottom:5px; margin-top:0px;}
    .contact_bg .col-xl-7 div p{margin-bottom:15px;}
}


footer{width:100%; height:60px; color:#f7f7f7; background:#7a7a7a; font-size:14px; display:flex; justify-content:center; align-items:center; position:fixed; z-index:99; left:0; bottom:0;}
footer img{width:20px; margin-right:2px;}
footer a,footer span{color:#f7f7f7; margin:0 10px;}
footer a:hover{text-decoration:underline;}

@media screen and (max-width:576px){
  footer{height:auto; padding:8px 0; flex-wrap:wrap; align-items:center; position:relative;}
  footer a{margin:0 10px;}
}

/*在线客服悬浮链接*/
.suspension{position:fixed;z-index:155;right:0;bottom:30%;width:90px;height:240px;}
.suspension-box{position:relative;float:right;}
.suspension .a{display:block;width:88px;height:88px;background:rgba(0,0,0,.4);margin-bottom:1px;cursor:pointer;outline:none;}
.suspension .a.active,.suspension .a:hover{background:var(--yellowhover);}
.suspension .a .i{display:flex; align-items:center; flex-direction: column; justify-content: center; width:88px;height:88px; font-style: normal; color:var(--white); border:1px var(--darkgreen) solid; font-family: "iconfont"; text-align:center; font-size:42px; line-height: 1.3;}
.suspension .a .i span{font-size:12px;}
.suspension .a-top{background:rgba(0,0,0,.4);display:none;}
.suspension .a-top:hover{background:#c0c1c3;}

.suspension .d{display:none;width:160px; background:var(--yellowhover);position:absolute;right:89px; color:var(--white); box-shadow:0px 2px 5px 0px rgba(161, 163, 175, 0.11);}
.suspension .d .arrow{position:absolute;width:8px;height:12px; font-family: "iconfont"; font-size:24px; font-style: normal; color:var(--yellowhover);right:0px;top:15px;}
.suspension .d-qrcode{top:0px;}
.suspension .d-service-phone{top:0px; padding-top:6px;}
.suspension .d-service{top:89px; padding-top:6px;}
.suspension .d .inner-box{padding:5px 10px 5px; min-height:68px;}
/*.suspension .d-service-item{display:flex; align-items:center; width:100%;}*/
.suspension .d-service-item a{display: block; width:100%;}
.suspension .d-service .d-service-item{border-bottom:none;}
.suspension .d-service-item .text{text-align:center;}
.suspension .d-service-item a .text{color:var(--white); font-size:14px;}
.suspension .d-qrcode{text-align:center;}
.suspension .d-qrcode .inner-box{padding:10px;}
.suspension .d-qrcode p{font-size:14px;}
.inner_erweima{display: flex; justify-content:center; flex-direction: column;}
.inner_erweima img{max-width:130px;}


@media screen and (max-width:996px){
    .suspension{display: none;}
}
