*{margin:0;padding:0;}
html{height:100%;width:100%;}
body{margin:0;padding:0;color:#161616;position:relative;font-size:16px;background:#FFF;width:100%; height:100%;overflow-x:hidden;font-family: "PingFang HK Regular",'OpenSans', "Helvetica Neue", Helvetica, Arial, "俪  Pro", "LiHei Pro", "STHeiti", "Apple LiGothic Medium", "微软正 体", "Microsoft JhengHei", sans-serif;}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{font-family: "PingFang HK Regular",'OpenSans', "Helvetica Neue", Helvetica, Arial, "俪  Pro", "LiHei Pro", "STHeiti", "Apple LiGothic Medium", "微软正 体", "Microsoft JhengHei", sans-serif;line-height:inherit;margin: 0;}
ul,ul li{list-style:none; margin-bottom:0;}
input{ -webkit-appearance: none; }
textarea{ -webkit-appearance: none; resize:none;}
select{ -webkit-appearance: none; }
img{max-width:100%;border:none;vertical-align:middle;text-decoration:none;}
a{cursor:pointer;}
a,a img{border:none;outline:none;cursor:pointer;text-decoration:none;background:none;}
span:focus,img:focus,button:focus{outline:none; border:none;}
.swiper-button-prev:focus,.swiper-button-next:focus{outline:none;}
a:focus,a:hover{text-decoration:none;outline:none;}
a:hover{-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;color: #000}
select,select:focus,select:active{outline:none;}
input:focus,textarea:focus,select:focus{outline:none;}
input::-moz-placeholder{color:#AEAEAE;opacity:1}
input:-ms-input-placeholder{color:#AEAEAE}
input::-webkit-input-placeholder{color:#AEAEAE}
.green-450{color: #11AE39;}
.purple-450{color: #6E236F;}
.white{color: white;}
.cursor-pointer{cursor: pointer;}
@-webkit-keyframes fadeIn {
    0% {
        display: block;
        opacity: 0; /*初始状态 透明度为0*/
    }
    50% {
        display: block;
        opacity: 0.5; /*中间状态 透明度为0*/
    }
    100% {
        display: block;
        opacity: 1; /*结尾状态 透明度为1*/
    }
}
.container{ max-width:1440px; width:100%;}


/* index */
header{position: relative;background:url("../image/header-bj.svg") no-repeat;background-size: cover;}
.header{display: table;width: 100%;position: relative;}
.header .logo{text-align: left;display: table-cell;vertical-align:middle;padding: 5px 0;}
.header .header_center{display:table-cell;vertical-align: middle;padding-right: 30px;}
.header .header_center .side-menu ul li a{font-weight: 700;}
.header .header_center .side-menu ul li a:hover{color: #11AE39;}
.header .header_center .header_center_active{padding: 16px 24px; border-radius: 100px; background-color: #fff;color: #6E236F;}
.header_bottom{width: 100%;display: flex;justify-content: space-between;padding-top: 50px;align-items: center;}
.header_bottom .header_bottom_left{flex: 1;}
.header_bottom .header_bottom_right{flex: 1;}
.header_bottom_left .title_t{font-size: 70px;font-weight: 700;color: #fff;white-space:nowrap;}
.header_bottom_left .title_b{margin-top: 16px;white-space:nowrap;}
.header_bottom_left .title_b span{font-size: 100px;font-weight: 700;color: #6E236F;background: #fff;line-height:1;text-align: center;}
.header_bottom_left .title_b .title_b_l{padding: 0 6px;background-color: #11AE39;color: #fff;}
.header_bottom_left .title_b .title_b_r{padding: 0 7px;}
.header_right{position: relative;padding: 15px 220px 15px 50px;}
.header_right .right{position: absolute;right: 0;top: 24px;}
.mobile-nav-icon{position: absolute;left: 0; top: 33px;}
.slide_menu{position: fixed;max-width: 560px;background: #FFF; overflow: auto;padding: 0;top: 0;bottom: 0;left:-100%;width: 80%;height:100%;opacity:0;z-index: 99999999;transition: all .5s;-webkit-transition: all .5s;-moz-transition: all .5s;-ms-transition: all .5s;-o-transition: all .5s;border-radius:0;}
.slide_menu.active {left:0;opacity:1;box-shadow: rgba(0, 0, 0, 0.1) 0 0 100px 0;}
.slide_logo{text-align: center;border-bottom: 1px solid #E7E7E7;padding: 20px;}
.slide_logo img{max-width: 100px;}
.mobile_close{position: absolute;right: 30px;top: 30px;}
.footer_links{text-align: center;padding: 0 5px;}
.footer_links a{display: inline-block;margin: 0 3px;color: #161616;font-size: 12px;}
.slide_menu_ul{height:calc(100% - 240px);overflow-y: auto;}
.slide_menu_ul .nav{float:none;clear:both;}
.slide_menu_ul .navbar-header{margin: 0;position: absolute;right:15px;top:10px;width:auto; z-index:99;}
.slide_menu_ul .nav > li {float: none; text-align:left; display:block;margin:0;padding: 0; position:relative;}
.slide_menu_ul .navbar-nav{margin:7px 0;}
.slide_menu_ul .nav > li.active > a i, .side-menu .nav > li.active .toggle-button i {-ms-transform: rotate(-180deg);-webkit-transform: rotate(-180deg);-o-transform: rotate(-180deg);transform: rotate(-180deg);}
.slide_menu_ul .nav > li > a {padding:8px 20px; margin:0;font-size: 20px;display: block;color: #161616; height:auto;text-align:left;line-height:1.6;border-bottom:none;}
.slide_menu_ul .nav > li > .toggle-button {position: absolute;padding:0;margin-top:12px; z-index: 999; font-size:20px;cursor: pointer;right: 20px;}
.slide_menu_ul .nav > li.active > .toggle-button i:before{content:"\f106";}
.slide_menu_ul .number{position: absolute;right: 20px;top: 7px;font-size: 16px;}
.side-menu .nav > li {margin:0 15px;padding: 15px 0; position:relative; float:none; display:inline-block;}
.side-menu .navbar-nav{ float:none; text-align:right; position:relative;}
.nav > li > a:focus, .nav > li > a:hover{background:none;}
.side-menu .nav > li > a{text-align:center;padding:0 0;vertical-align: middle;margin:0;color: #FFF;font-size:18px; display:inline-block;}
.side-menu .nav > li > .toggle-button {display:inline-block;vertical-align: middle;}
.side-menu .nav > li > .toggle-button .fa{font-weight:bold;}
.visible-m{display: none !important}
.tech{padding: 160px 0; border-bottom: 1px solid #6E236F;}
.tech .title{font-size: 48px; font-weight: 700;text-align: center;margin-bottom: 48px;}
.tech .introduction{font-size: 32px; font-weight: 700;text-align: center;}
.business{padding: 160px 0;display: flex;justify-content: space-between;align-items: center;}
.business .left{flex: 1;text-align: center;}
.business .right{flex: 1;}
.business .right div{font-size: 64px;font-weight: 700;}
.our_services{width: 100%;}
.our_services .bg-t{background: url("../image/services.svg") no-repeat; background-size: cover;}
.our_services .bg-t div{font-size: 64px;font-weight: 700;padding: 160px 0 260px 0;}
.our_services .bg-b{width: 100%;background-color: #6E236F;height: 300px;}
.our_services .card{display: flex;flex-wrap: wrap;padding: 0;justify-content: space-between;}
.our_services .card::before{display: none;}
.our_services .card::after{display: none;}
.our_services .card .item{width: 280px;padding: 32px;border-radius: 24px;box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);background: #FFFFFF;position: relative;height: 400px;top: -260px;margin: 0 10px;}
.our_services .card .item .item-img{width: 100px;height: 100px;line-height: 100px;display: table-cell;vertical-align: middle;text-align: center;}
.our_services .card .item .item-title{font-size: 24px;font-weight: 700;position: absolute;bottom: 32px;left: 32px;transition: all .3s;}
.our_services .card .item .item-introduction ul{margin-top: 92px;padding-left: 25px;display: none;transition: all .3s;}
.our_services .card .item .item-introduction ul li{list-style: disc;font-size: 16px;font-weight: 400;}
.our_services .card .item:hover .item-introduction ul{display: block;-webkit-animation-name: fadeIn; -webkit-animation-duration: 2s;-webkit-animation-iteration-count: 1;-webkit-animation-delay: 0s;}
.our_services .card .item:hover .item-title{bottom: 200px;}
.our_services .card .item:hover .item_fast{bottom: 180px;}
.our_services .card .item:hover{box-shadow: 0px 0px 30px #ccc}
.our_clients{font-size: 64px;font-weight: 700;padding-top: 160px;}
.clients_item{display: grid;grid-template-columns:repeat(auto-fill,138px) ;row-gap: 100px;column-gap: 60px;padding-bottom: 160px;padding-top: 200px;}
.clients_item div{width: 138px;height: 103.5px; line-height: 103.5px;text-align: center;display: table-cell;vertical-align: middle;}
.companies{background: url("../image/companies.svg") no-repeat;background-color: #6E236F;background-size: cover;}
.companies_item{padding-bottom: 220px;padding-top: 200px;display: flex;justify-content: space-between;align-items: center;}
.companies_item div{width: 138px;height: 103.5px; text-align: center;}
.companies_item .cyberport{width: 220px;height: 220px;border-radius: 50%;background: #fff;}
.companies_item .cyberport a img{margin: 48px 27px;}
.cyberport_t{margin-top: 24px;color: #fff;font-size: 14px;font-weight: 700;}
.hello{display: flex;padding: 160px 0;}
.hello .hello-left{width: 33%;}
.hello .hello-left .text_1{font-size: 160px;font-weight: 700;line-height: 1;}
.hello .hello-left .text_2{font-size: 24px;font-weight: 400;}
.hello .hello-left .text_3{font-size: 18px;font-weight: 700;margin-top: 160px;}
.hello .hello-left .text_4{font-size: 18px;font-weight: 700;margin-top: 32px;}
.hello .hello-left .text_5{font-size: 18px;font-weight: 700;margin-top: 32px;}
.hello .hello-right{flex:1;margin-left: 20%;}
.hello-right .form .group{display: flex;justify-content: start;align-items: center;border-bottom: 1px solid #161616;margin-bottom: 48px;}
.hello-right .form .group_label{width: 70px;font-size: 18px;font-weight: 700;}
.hello-right .form .group_input{width: 100%;}
.hello-right .form .group_input input{height: 70px;width: 100%;border: none;padding-left: 20px;}
.hello-right .form .form_input input{height: 70px;width: 100%;border: none;padding-left: 20px;border-bottom: 1px solid #161616;}
.hello-right .form .form-group .submit{margin-top: 100px;}
.hello-right .form .form-group .submit .btn{color: #fff;font-weight: 700;font-size: 24px;line-height: 76px;border: none;background: #6E236F;padding: 1px 74px;border-radius: 100px;background: #6E236F;}
.footer{width: 100%;}
.map{width: 100%;}
.map img{width:100%}
.copyright{background: url("../image/copyright.png") no-repeat;background-size: cover;}
.copyright_content{display: flex;justify-content: space-between;align-items: center;padding: 24px 0;}
.copyright_right a{color: #fff;}
body.body-overflow::before {opacity: 1;z-index:2;}
body:before {content: '';background: rgba(41, 45, 53, 0.5);position: fixed;top: 0;left: 0;right: 0;bottom: 0;opacity: 0;z-index: -1;pointer-events: none;transition: .3s opacity;}


@media (max-width:1600px) {
    .part_brand .left{padding:130px 50px;}
    .part_brand .right{padding:47px 50px;}

}

@media (max-width:1200px) {
    .visible-m{display:block !important;}
    .hidden-m{display:none !important;}
    .navbar-header{margin: 0!important;}
    .navbar-header{margin: 0;width:auto;}
    .header{display: flex;justify-content: space-between;align-items: center;}
    .header .header_center{display: none;clear: both;width: 100%;}
    .header_bottom{display: block;padding-top: 10px;text-align: center;}
    .header_bottom .header_bottom_left{margin-bottom: 50px;}
    .header_right .right{position:fixed;top:inherit; bottom: 0;left: 0;width: 80%;text-align: center;padding-bottom: 30px;}
    .header_right{padding-right: 0;}
    .header .logo{padding: 10px 0;display: block;}
    .mobile-nav-icon{position: initial;}
    .side-menu .navbar-nav{text-align: center;}
    .side-menu .nav > li{padding-top: 10px;}
    .navbar-nav{margin-top: 0;margin-bottom: 0;}
    .business{padding: 160px 0;display: block;}
    .business .left{flex: 1;text-align: center;}
    .business .right{flex: 1;text-align: center;}
    .business .right div{font-size: 40px;font-weight: 700;margin-top: 20px;}
    .companies_item{padding-bottom: 220px;padding-top: 200px;display: grid;grid-template-columns:repeat(auto-fill,165px) ;row-gap: 80px;column-gap: 60px;}
    .companies_item div{width: 165px;height: 123.75px; text-align: center;margin-bottom: 20px;}
    .companies_item .cyberport{width: 220px;height: 220px;border-radius: 50%;background: #fff;}
    .companies_item .cyberport a img{margin: 48px 27px;}
    .clients_item{justify-content: space-around;}
    .hello .hello-left .text_1{font-size: 100px;font-weight: 700;line-height: 1;}
    .our_services .bg-t div{font-size: 64px;font-weight: 700;padding: 60px 0 360px 0;text-align: center;}
    .our_services .card .item{width: 300px;padding: 32px;border-radius: 24px;box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);background: #FFFFFF;position: relative;height: 400px;top: -600px;margin: 0 20px;margin-bottom: 40px;}
    .our_services .card .item .item-img{width: 100px;height: 100px;line-height: 100px;display: table-cell;vertical-align: middle;text-align: center;}
    .our_services .card .item .item-title{font-size: 24px;font-weight: 700;position: absolute;bottom: 32px;left: 32px;}
    .our_services .card .item .item-introduction ul{margin-top: 92px;padding-left: 25px;display: none;}
    .our_services .card .item .item-introduction ul li{list-style: disc;font-size: 16px;font-weight: 400;}
    .our_services .card .item:hover .item-introduction ul{display: block;}
}

@media (max-width:870px) {
    .companies_item{row-gap: 40px;column-gap: 20px;}
}

@media (max-width:767px) {
    .header_bottom_left .title_t{font-size: 50px;}
    .header_bottom_left .title_b span{font-size: 70px;}
    .side-menu .nav > li > a{font-size: 13px;}
    .side-menu .nav > li > a img{height: 40px;margin-bottom: 0;}
    .tech .title{font-size: 48px; font-weight: 700;text-align: center;margin-bottom: 48px;}
    .our_clients{font-size: 40px;}
    .hello{display: block;padding: 160px 0;}
    .hello .hello-left{width: 100%;text-align: center;}
    .hello .hello-right{width: 100%;margin-left: 0;margin-top: 50px;}
    .hello-right .form .form-group .submit{margin-top: 100px;text-align: center;}
    .companies{overflow-x: hidden;}
    .companies_item div{width: 165px;height: 123.75px; text-align: center;margin-bottom: 20px;}
    .companies_item{row-gap: 40px;column-gap: 10px;padding: 200px 40px 220px 0px;}
    .companies_item .cyberport{width: 185px;height: 185px;border-radius: 50%;background: #fff;}
    .companies_item .cyberport a img{margin: 30px 10px;}
}

@media (max-width:680px) {
    .companies_item{row-gap: 40px;column-gap: 40px;padding: 200px 40px 220px 0px;justify-content: space-around;}
    .our_services .card .item{width: 280px;padding: 32px;border-radius: 24px;box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);background: #FFFFFF;position: relative;height: 400px;top: -600px;margin: 0 20px;margin-bottom: 40px;}
}

@media (max-width:640px) {
    .our_services .bg-t div{font-size: 64px;font-weight: 700;padding-bottom: 860px;}
    .our_services .card{display: flex;flex-wrap: wrap;padding: 0;justify-content: center;}
    .our_services .card .item{width: 300px;padding: 32px;border-radius: 24px;box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);background: #FFFFFF;position: relative;height: 400px;top: -1570px;margin: 0 20px;margin-bottom: 40px;}
}

@media (max-width:500px) {
    .header_bottom_left .title_t{font-size: 30px;}
    .header_bottom_left .title_b span{font-size: 50px;}
    .side-menu .nav > li{margin: 0;}
    .side-menu .nav > li + li {margin-left: 5px;}
    .p_left{width: 150px;}
    .mobile_close{right: 15px;}
    .slide_menu_ul .nav > li > a{font-size: 16px;}
    .tech .title{font-size: 24px; font-weight: 700;text-align: center;margin-bottom: 48px;}
    .tech .introduction{font-size: 16px; font-weight: 700;text-align: center;}
    .business .right div{font-size: 20px;font-weight: 700;margin-top: 20px;}
    .our_clients{font-size: 24px;}
    .copyright_right{padding-left: 20px;}
    .companies_item{row-gap: 40px;column-gap: 0px;padding: 160px 10px 220px 0px;}
}