body{ font-family: PingFang SC,Helvetica Neue,Hiragino Sans GB,Microsoft Yahei,WenQuanYi Micro Hei,sans-serif; }
blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,th,ul{margin:0;padding:0 }
a:link,a:visited{text-decoration:none; }
a img{ border:0 }
body{ margin:0; padding:0; color: #031b4d; font-size: 16px; background:  #eff6ff; line-height: 1.5; }
ul,li{ list-style:none; }
img{ margin:0; padding:0; border: none; }
button:focus,input:focus,select:focus,textarea:focus{outline:0 }
input[type=text],input[type=password],input[type=search],input[type=tel],input[type=number],input[type=email],input[type=url],textarea{-webkit-appearance:none;-webkit-border-radius:0;border-radius:0 }
input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none }
:-moz-placeholder { color: #999; opacity:1; }
::-moz-placeholder {  color: #999;opacity:1; }
input:-ms-input-placeholder{ opacity:1; }
input::-webkit-input-placeholder{ opacity:1; }
em{ font-style: normal; }
a{ color: #031b4d; -webkit-tap-highlight-color:rgba(0,0,0,0); }

.color-9{ color: #999; }
.pst{ position: relative;}
.pt-100{ padding-top: 100px;}
.bg-white{ background-color: #fff;}
.bg-grey{ background-color: #f9fafb;}
.hidden{ display: none;}

.module{ padding: 40px 0;}
.container{ width: 1400px; margin: 0 auto;}
.header { position: fixed; top: 0; left: 0; right: 0; z-index: 10; padding: 10px 0; transition: all 0.3s ease; }
.header.transparent { background-color: #eff6ff; }
.header.scrolled { background-color: #fff;  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); }
.header-menu{  display: flex; justify-content: space-between; align-items: center; }
.logo { width:200px; }
.nav-menu { width: calc(100% - 330px); display: flex; align-items: center; justify-content: center; }
.nav-menu li {  margin: 0 15px; }
.nav-menu a {  text-decoration: none; font-size: 18px; transition: color 0.3s ease; padding: 5px 10px; border-radius: 3px; }
.nav-menu a:hover { color: #0560e2; }
.header-btn{ width: 130px;}
.header-btn a{ display: block; text-align: center; padding: 10px 0; border-radius: 50px; background-color: #0560e2; color: #fff;}

.banner-wrap{ display: flex; align-items: center; margin: 50px auto; }
.banner-txt{ width: calc(50% - 50px); margin-right: 50px; }
.banner-pic{ width: 50%;  position: relative; height: 400px; }
.tit-label span{ background-color: #dbeafe; padding: 5px 15px; color: #0560e2; border-radius: 20px; }
.banner-txt h2{ margin: 15px 0 0px 0; font-size: 3.2rem;}
.banner-txt h3{ font-size: 3.2rem; color: #0560e2;}
.banner-txt .txt-intro{ margin-top: 5px; font-size: 20px;}
.banner-img{ position: absolute; left:20px; top: 20px; z-index: 7; transform:rotate(-1.5deg); transition: all 0.3s ease; width: 660px; height: 370px; border: 1px #e5e7eb solid; overflow: hidden; border-radius: 1rem;  box-shadow: 0 25px 50px 0px rgb(0 0 0 / 0.25);}
.banner-img img{ width: 100%; height: 100%; object-fit: cover;}
.banner-img:hover{ transform:rotate(0deg);  }
.num-one{ position: absolute; left: 0px; bottom: -10px; z-index:8;  background-color: #fff; border-radius: 5px; padding: 12px 15px; }
.num-two{ position: absolute; right: 0px; top: -10px; z-index:8; background-color: #fff; border-radius: 5px; padding: 12px 15px; }
.banner-pic dl{ display: flex; align-items: center; box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.05), 0 4px 6px -4px rgb(0 0 0 / 0.05) }
.banner-pic dt{ margin-right: 10px;  }
.banner-pic dt{  padding: 0.5rem; border-radius:20px; }
.num-one dt{ background-color: #dcfce7; }
.num-two dt{ background-color: #dbeafe}
.banner-pic dt img{ width: 24px; height: 24px; margin-bottom: -5px; }
.user-score{ margin-top: 20px;}
.user-score dl{ display: flex; align-items: center; }
.user-score dt{ margin-right: 10px;}
.user-score dt img{ width: 140px; }
.score{ display: flex; align-items: center;}
.score img{ width: 120px; margin-right: 8px; }
.index-tit{ text-align: center;}
.index-tit h2{ font-size: 30px; margin: 15px 0 20px;}
.index-tit p{ font-size: 18px;}
.index-tit p span{ font-size: 14px;}
.weakness .index-tit p span{ background-color: #ffedd5; color: #c2410c;}
.advantage .index-tit p span{ background-color: #f3e8ff; color: #7e22ce;}
.data .index-tit p span{ background-color: #dcfce7; color: #15803d;}
.safe .index-tit p span{ background-color: #fee2e2; color: #b91c1c;}
.customer .index-tit p span{ background-color: #fce7f3; color: #be185d;}
.package .index-tit p span{ background-color: #ffedd5; color: #c2410c;}
.feature-info { margin-top: 30px; display: flex;}
.feature-info dl{  padding: 30px; width: calc(25% - 30px); margin: 0 15px; border: 1px #efefef solid; border-radius: 10px; box-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)}
.feature-info dl dt{ transition: all 0.3s ease; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; margin-bottom: 25px; border-radius: 10px; background-image: linear-gradient(to left,#f97316,#facc15); }
.feature-info dl:nth-child(2) dt{ background-image: linear-gradient(to left,#10b981,#4ade80);}
.feature-info dl:nth-child(3) dt{ background-image: linear-gradient(to left,#2563eb,#60a5fa);}
.feature-info dl:nth-child(4) dt{ background-image: linear-gradient(to left,#8b5cf6,#c084fc);}
.feature-info dl:hover dt{ transform:scale(1.1) }
.feature-info dl dt img{ width: 32px; height: 32px;}
.feature-info dd h4{ margin-bottom: 8px;}
.feature-info dd .line{ opacity: 0; transition: all 0.3s ease; margin-top: 20px; width: 48px; height:5px; background-image: linear-gradient(to right,#fff,#0560e2,#fff);}
.feature-info dl:hover dd .line{ opacity: 1;}
.weakness-table{ width: 1200px; margin: 0 auto; height: 426px; overflow: hidden; border-radius: 20px; margin-top: 30px; box-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) }
.weakness-table img{ width: 100%; height: 100%; object-fit: cover;}
.advan-info{ margin-top: 30px; }
.advan-info dl{ width: 1200px; margin: 0 auto; margin-bottom: 60px; display: flex; align-items: center; }
.advan-info dl:last-child{ margin-bottom: 0;}
.advan-info dt{ width: 500px; height: 320px; border-radius: 10px; overflow: hidden; box-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)  }
.advan-info dt img{ width: 100%; height: 100%; object-fit: cover;}
.advan-info dd{ width: calc(100% - 550px);}
.ml-50{ margin-left: 50px;}
.advan-info dd h4{ font-size: 28px; }
.advan-info dd p{ font-size: 20px; margin: 15px 0;}
.advan-info dd li{ font-size: 18px; margin: 10px 0;}
.advan-info dd li img{ margin-right: 8px; width: 22px; height: 22px; margin-bottom: -5px; }
.square{ width: 48px; height: 48px; text-align: center; border-radius: 48px; margin-bottom: 10px; background-image: linear-gradient(to right,#3b82f6,#4f46e5); }
.square img{ width: 24px; height: 24px; margin-bottom: -18px;}
.data-info { margin-top: 30px;}
.data-info ul{ width: 1020px; margin: 0 auto; display: flex; align-items: center;}
.data-info li{ padding: 20px; text-align: center; width: calc(25% - 20px); margin: 0 10px; background-color: #fff; border-radius: 10px; box-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) }
.data-info li h4{ font-size: 30px; color: #2563eb;}
.safe-info{ margin-top: 30px; }
.safe-info ul{ width: 1200px; margin: 0 auto; display: flex; align-items: center;}
.safe-info li{ padding: 20px; width: calc(25% - 20px); height: 200px; margin: 0 10px; background-color: #f9fafb; border-radius: 10px;  }
.safe-info li h4{ font-size: 20px; margin: 15px 0;}
.safe-info li:hover{ background-color: #f3f4f6;}
.round{ width: 56px; height: 56px; text-align: center; border-radius: 10px; margin-bottom: 10px; background-color:#dbeafe; }
.round img{ width: 28px; height: 28px; margin-bottom: -24px;}
.customer-words{ width: 1024px; margin: 0 auto; margin-top: 30px; overflow: hidden; background-color: #fff; border-radius: 10px;}
.customer-words .swiper-container{ min-height:100px;  }
.customer-words .swiper-pagination{ text-align: left; bottom: 20px; left: 30px; }
.customer-words .swiper-pagination-bullet{ width: 12px; height: 12px; border-radius: 6px;}
.customer-words .swiper-pagination-bullet-active{ width: 28px;}
.customer-words .swiper-slide{ display: flex; align-items: center;}
.customer-info{ width: calc(50% - 60px); padding: 30px;}
.customer-info ul{ display: flex; margin: 15px 0; padding-bottom: 20px;}
.customer-info li{ background-color: #eff6ff; border-radius: 5px; padding: 15px; text-align: center; width: calc(30% - 20px); margin-right: 15px;}
.customer-info li h5{ font-size: 18px; color: #2563eb;}
.customer-info li p{ font-size: 14px;}
.customer-info .score{ margin: 15px 0;}
.customer-info dl{ display: flex; align-items: center; }
.customer-info dt{ width: 64px; height: 64px; overflow: hidden; margin-right: 16px; border-radius: 32px; background-color: #f9fafb;}
.customer-info dt img{ width: 100%; height: 100%; object-fit: cover; }
.customer-info dd{ width: calc(100% - 80px);}
.customer-img{ width: 50%; height: 399px; overflow: hidden;}
.customer-img img{ width: 100%; height: 100%; object-fit: cover; }
.package-info{  width: 1024px; margin: 0 auto; margin-top: 30px; display: flex; justify-content: center; }
.package-item{ width:320px; min-height: 400px; border: 2px transparent solid; border-radius: 10px; margin-right: 32px; background-color: #fff; box-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); }
.package-item:last-child{ margin-right: 0;}
.package-tit{ height: 60px; padding: 20px; border-radius: 6px 6px 0 0; color: #fff; position: relative;}
.price-label{ position: absolute; right:-2px; top:-10px; padding: 3px 15px 3px 20px; font-size: 12px; border-radius: 0 10px 0 20px; background-image: linear-gradient(to right,#fb443e,#ff6a53);}
.package-tit h4{ margin-bottom: 6px; font-size: 20px;}
.package-item:nth-child(1) .package-tit{ background:url(../images/bci/tit-bg01.png) no-repeat; background-size: 320px 100px; }
.package-item:nth-child(2) .package-tit{ background:url(../images/bci/tit-bg02.png) no-repeat; background-size: 320px 100px; }
.package-item:nth-child(3) .package-tit{ background:url(../images/bci/tit-bg03.png) no-repeat; background-size: 320px 100px; }
.package-item:nth-child(1):hover{ border: 2px #9fa6b7 solid;}
.package-item:nth-child(2):hover{ border: 2px #2c8bff solid;}
.package-item:nth-child(3):hover{ border: 2px #d3b775 solid;}
.package-price{ padding: 20px; border-bottom: 1px #efefef solid;  }
.package-price h4{ font-size: 32px; text-align: center;}
.package-price h4::before{ content: "¥"; font-size: 16px; font-weight: normal; margin-right: 6px; }
.package-price h4 em{ font-size: 16px; font-weight: normal; margin-left: 6px; }
.package-price p{margin-top: 10px; }
.package-price p a{ background-color: #fff; padding: 8px 0; border-radius: 5px; display: block; text-align: center; }
.package-item:nth-child(1) .package-price p a{ border: 1px #9fa6b7 solid;  }
.package-item:nth-child(2) .package-price p a{ border: 1px #2c8bff solid; background-color: #2c8bff; color: #fff; }
.package-item:nth-child(3) .package-price p a{ border: 1px #d3b775 solid; background-color: #d3b775; color: #fff; }
.package-service{ padding: 20px;}
.package-service li{ margin-bottom: 10px; display: flex; align-items: center;}
.package-service li img{ width: 18px; height: 18px; margin-right: 6px; }
.faq-wrap{ margin-top: 30px;  } 
.tab-bar{ display: flex; justify-content: center; }
.tab-bar li{ cursor: pointer; padding: 10px 25px; margin: 0 15px; background-color: #fff; border-radius: 30px;  }
.tab-bar li.active{ background-color: #2563eb; color: #fff;}
.tab-content{ width: 900px; margin: 0 auto; margin-top: 30px;  border-radius: 10px; background-color: #fff; box-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);} 
.faq-wrap .tab-pane { display: none;}
.faq-wrap .active {display: block;}
.panel-item{ border-bottom: 1px #efefef solid; padding: 0 20px 0px 20px; }
.panel-head { cursor: pointer; display: flex; align-items: center;  padding: 20px 0; }
.panel-head h5{ width: calc(100% - 30px); font-size: 18px;}
.panel-head em{ width: 30px; text-align: center;}
.panel-head em img{ width: 20px; height: 20px;}
.panel-head em.270deg{ transform: rotate(270deg);}
.panel-body{  display: none; padding-bottom: 20px; }
.panel-wrap .panel-item:last-child{ border-bottom: none;}

.bg-package{ background: url(../images/bci/package-bg.png) no-repeat;}
.bg-advan{  background: url(../images/bci/table-bg.png); background-size: cover; }

.app-copyright{ background-color: #1c2e70; padding: 30px 15px; color: #fff; text-align: center;}
.app-copyright a{ color: #fff;} 

.app-layer{ display: none;}
.layer-mask{ position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 99; background-color: rgba(0, 0, 0, 0.5);}
.layer-wrap{ position: fixed; left: 30%; right: 30%; top: 200px; bottom: 200px; z-index: 100; background-color: #fff; border-radius: 10px;}
.layer-header{ height: 60px; padding: 0 15px; border-bottom: 1px #ddd solid; display: flex; align-items: center; }
.layer-header h4{ width: calc(100% - 40px);}
.layer-header a{ width: 40px; text-align: center;}
.layer-header a img{ width: 24px; height: 24px;}
.layer-body{ padding: 30px;}
.layer-tip{ background-color: #ecf8ff; padding: 15px; border-radius: 5px;}
.layer-form{ margin-top: 30px;}
.form-item{ margin-bottom: 15px; display: flex; align-items: center;}
.form-tit{ width: 120px; text-align: right; margin-right: 15px;}
.form-con{ width: calc(100% - 135px);}
.form-con input{ font-size: 14px; width: calc(100% - 100px); height: 40px; line-height: 40px; box-sizing: border-box; padding: 0 10px; border-radius: 4px; border: 1px solid #dcdfe6;}
.form-con input::placeholder{ color: #c0c4cc;}
.form-opera{ padding-left: 135px;}
.form-opera a{ height: 40px; line-height: 40px; width: 120px; text-align: center; display: block; background-color: #2a5dff; color: #fff; border-radius: 5px;}
.index-code{ display: none; position: absolute; right: 0px; top: 67px; z-index: 900; width: 200px; height: 218px; border-radius: 5px 0 5px 5px; overflow: hidden;}
.index-code img{ width: 100%; height: 100%; object-fit: contain;}
.mobile-link,.btn-code-mobile{ display: none;}

.select-form{  font-size: 14px; width: calc(100% - 100px); height: 40px; line-height: 40px; box-sizing: border-box; padding: 0 10px; border-radius: 4px; border: 1px solid #dcdfe6;  }

@media screen and (max-width:1300px) {
	.container{ width: 100%;}
	.nav-menu{ display: none;}
	.header-btn{ display: none;}
	.menu-toggle{ display:  block; position: absolute; right: 20px; top: 10px; }
	.menu-toggle img{ width: 24px; height:24px; margin-bottom: -20px;}
	.banner-wrap{ flex-wrap: wrap; }
	.banner-txt{ width: calc(100% - 30px); text-align: center; margin-right: 0; padding: 15px; }
	.banner-txt h3{ font-size: 2rem;}
	.banner-pic{ width: 100%; }
	.feature-info{ flex-wrap: wrap; width:100%; justify-content: center; }
	.feature-info dl{ margin: 0 10px; padding: 10px; margin-bottom: 15px;  width: calc(50% - 50px);}
	.weakness-table{ width: calc(100% - 30px); height: auto; }
	.advan-info dl{ width: calc(100% - 30px); flex-wrap: wrap;}
	.advan-info dt,.advan-info dd{ width: 100%; height: auto;}
	.advan-info dt{ display: none;}
	.ml-50{ margin-left: 0;}
	.data-info ul{ flex-wrap: wrap; width: 100%;}
	.data-info ul li{ margin-bottom: 15px;  width: calc(50% - 60px); }
	.safe-info ul{ width: 100%; flex-wrap: wrap; }
	.safe-info ul li{ padding: 15px; height: auto; margin-bottom: 15px; width: calc(50% - 50px);}
	.customer-words{ width: calc(100% - 30px); margin: 15px 15px 0;}
	.customer-words .swiper-slide{ flex-wrap: wrap;}
	.customer-info{ width: 100%;}
	.customer-img{ display: none;}
	.package-info{ width: calc(100% - 30px); margin: 15px 15px 0; flex-wrap: wrap;}
	.package-item{ width: 100%; margin-bottom: 20px; margin-right: 0; }
	.package-item:nth-child(1) .package-tit,.package-item:nth-child(2) .package-tit,.package-item:nth-child(3) .package-tit{ background-size: cover;}
	.tab-content{ width: calc(100% - 30px); margin: 15px; }
	.banner-pic{ display: none; }
	.tab-bar li{ padding:5px 15px; margin: 0 5px; }
	.index-tit{ margin: 0 15px; }
	.square{ margin: 0 auto;}
	.advan-info dl{ margin-bottom: 15px;}
	.advan-info dd{ background-color: #f9fafb; border-radius: 5px; padding: 15px;}
	.advan-info dd h4{ text-align: center; font-size: 20px; margin-top: 10px; }
	.index-tit h2{ font-size: 24px;}
	.index-tit p{ font-size: 16px;}
	.user-score dl{ justify-content: center;}
	.banner-wrap{ margin: 0 auto;}
	.header-menu{ padding: 0 15px;}
	.logo{ width: 150px;}
	.pt-100{ padding-top: 70px;}
	.banner-txt h2{ font-size: 2.6rem;}
	.mobile-menu{ display: none; position: fixed; left: 0; right:0; top: 72px; z-index: 99; min-height: 120px; background-color: #fff;}
	.mobile-menu ul{ display: flex; flex-wrap: wrap; justify-content: center; padding: 15px 0; }
	.mobile-menu li{ width: calc(30% - 20px); margin: 0 10px; margin-bottom: 10px; text-align: center;}
	.mobile-menu li a{ background-color: #dbeafe; display: block; height: 40px; line-height: 40px; padding: 0 15px; border-radius: 5px; }
	.layer-wrap{ left: 0; right: 0; bottom: 0; top: auto; height: 560px; border-radius: 10px 10px 0 0;}
	.form-tit{ width: 80px;}
	.form-con{ width: calc(100% - 80px);}
	.form-con input{ width: 100%;}
	.layer-body{ padding: 15px;}
	.form-opera{ padding-left: 90px;}
}

