.body {
	width: 100%;
	overflow: hidden;
}

body {
	/*background: #000000;*/
	/*padding-top: 5.729vw;*/
}

.pic img {
	width: 100%;
	display: block!important;
	margin: 0 auto;
	transition: all ease .3s;
}

header {
	padding: 0 2.813vw 0 4.948vw;
	width: 100%;
	height:110px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	/*background: #000000;*/
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
	transition: all ease .3s;
}

.scroll header {
	/*height: 3.125vw;*/
}

header .logo {
	width: 180px;
	transition: all ease .3s;
}

header .logo img {
	/*width: 100%;*/
}

.scroll header .logo {
	width: 7.292vw;
}

header .nav {
	height: 100%;
}

header .nav .link {
	display: flex;
	align-items: center;
	height: 100%;
	font-size:15px;
	margin: 0 1.76vw;
	transition: all ease .3s;
	position: relative;
	cursor: pointer;
}

header .nav .link>a {
	color: #fff;
}

header .nav .link:hover>a,
header .nav .link.on>a {
	color: #0382D3;
}

header .nav .link .down {
	display: flex;
	flex-direction: column;
	position: absolute;
	left: 50%;
	top: 100%;
	padding: 0.938vw 2.083vw;
	min-width: 100%;
	width: max-content;
	transform: translateX(-50%);
	box-shadow: 0 0 0.26vw #f3f3f3 inset;
	background: #000;
	transition: all ease .3s;
	opacity: 0;
	pointer-events: none;
	z-index: 5;
	text-align: center;
}

header .nav .link:hover .down {
	opacity: 1;
	pointer-events: visible;
}

header .nav .link .down a {
	margin: 0.521vw 0;
	color: #fff;
	font-size: 15px;
	transition: all ease .3s;
}

header .nav .link .down a:hover {
	color: #0382D3;
}

header .nav .link .down a.on {
	color: #0382D3;
}

header .en {
	width: 3.125vw;
	height: 3.125vw;
	font-size: 1.25vw;
	font-weight: bold;
	color: #000000;
	background: #FFFFFF;
	border-radius: 50%;
	transition: all ease .3s;
}

.scroll header .en {
	width: 2.083vw;
	height: 2.083vw;
	font-size: 0.833vw;
}

footer {
	padding: 7.813vw 10.833vw 0 6.563vw;
	background: #131313;
}

.foot-logo {
	width: 9.792vw;
	margin: 0 9.896vw 2.771vw 0;
}

.foot-logo img {
	width: 100%;
}

.foot-link dl {
	margin-right: 7.292vw;
	text-align: center;
}

.foot-link dl:last-child {
	margin-right: 0;
}

.foot-link dt {
	font-size: 1.25vw;
	margin-bottom: 1em;
	color: #fff;
	font-weight: 600;
	letter-spacing: 0.052vw;
}

.foot-link dd,
.foot-logo-bottom li {
	font-size: 1.042vw;
	margin-bottom: 1.3em;
	color: #878787;
	transition: all ease .3s;
}

.foot-link dd:hover,
.foot-logo-bottom li:hover {
	color: #fff;
}

.foot-link dd img {
	width: 13.802vw;
}

footer .line {
	padding: 2.344vw 0;
}

footer .line::after {
	content: '';
	display: block;
	height: 0.104vw;
	border-radius: 0.10417vw;
	width: 100%;
	background: #2B2B2B;
	transform: translateX(3.125vw);
}








.C-more {
	width: 9.375vw;
	height: 3.281vw;
	background: #0382D3;
	box-shadow: 0vw 0.625vw 0.365vw 0vw rgba(0, 0, 0, 0.35);
	font-size: 1.25vw;
	color: #FFFFFF;
	transition: all ease .3s;
}

.C-more:hover {
	background: #fff;
	color: #0382D3;
}

.C-banner {
	padding: 6.563vw 0 0;
}

.C-banner .main {
	width: 62.5vw;
	margin: 0 auto;
	position: relative;
}

.C-banner .main .pic {
	width: 35.042vw;
	font-size: 2.41667vw;
	margin: 0 auto;
	margin-top: -5.813vw;
}

.C-banner .main .intr {
	position: absolute;
	left: 0;
	top: 52%;
	width: 100%;
}

.C-banner .main .intr p {
	font-size: 2.64583vw;
	text-align: center;
	letter-spacing: 1em;
	transform: translateX(1em);
	color: #FFFFFF;
	text-shadow: 0vw 0vw 80vw #fff;
}

.C-banner.product {
	padding: 0 0 0;
}

.C-banner.product .main .intr {
	top: 58%;
}

.C-banner.letter .main .intr p {
	letter-spacing: 0.26vw;
	transform: translateX(0.26vw);
	font-weight: 600;
}


.C-title {
	color: #FFFFFF;
	text-align: center;
}

.C-title h2 {
	font-size: 4vw;
}

.C-title h3 {
	font-size: 2.5vw;
	margin-bottom: 1.042vw;
	font-family: 'OPPOSans-L';
}

.C-title p {
	font-size: 1.15vw;
	line-height: 1.8;
}

.body.product-bg {
	background-repeat: repeat-y;
	background-size: 100% auto;
	background-position: top;
}

.add .pic {
	width: 4.688vw;
	margin: 0.521vw 0;
	position: absolute;
	animation: ani-zoom 2s linear infinite alternate;
}

@keyframes ani-zoom {
	0% {
		transform: scale(0.5);
	}

	100% {
		transform: scale(1);
	}
}

.add .pic:nth-of-type(1) {
	left: 0;
	top: 0;
}

.add .pic:nth-of-type(2) {
	right: 0;
	top: 0;
}

.add .pic:nth-of-type(3) {
	left: 0;
	bottom: 0;
}

.add .pic:nth-of-type(4) {
	right: 0;
	bottom: 0;
}

.add .pic:nth-of-type(5) {
	left: 0;
	top: 50%;
}

.add .pic:nth-of-type(6) {
	right: 0;
	top: 50%;
}


.points {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	text-align: center;
	padding: 0 0 1.042vw;
}

.points span {
	display: inline-block;
	margin: 0 6.771vw;
	width: 0.729vw;
	height: 0.729vw;
	border-radius: 100%;
	background: #fff;
	animation: ani-shadow 1s ease infinite alternate;
}

@keyframes ani-shadow {
	0% {
		box-shadow: 0 0 0.521vw 0vw #fff;
	}

	100% {
		box-shadow: 0 0 0.521vw 0.156vw #fff;
	}
}

/* 
*======================================================media===============================================================
*/
@media screen and (max-width:1919px) {}

@media screen and (max-width:1519px) {
	.foot-link dl {
		margin-right: 5.292vw;
	}
}

@media screen and (max-width:1366px) {
	.scroll header {
		height: 110px;
	}
}

@media screen and (max-width:1250px) {
	.foot-link dl {
		margin-right: 5.292vw;
	}
}

@media screen and (max-width:991px) {


	.navbar-toggle {
		display: flex;
		flex-direction: column;
	}

	body {
		padding-top: 80px;
	}

	header {
		padding: 0 5% 0 8%;
		height: 80px;
	}

	.scroll header {
		height: 60px;
	}

	header .logo {
		width: 120px;
	}

	.scroll header .logo {
		width: 100px;
	}

	header .nav {
		position: fixed;
		right: 100vw;
		top: 0;
		width: 100%;
		height: 100%;
		background: #000;
		flex-direction: column;
		padding: 0 5%;
		align-items: center;
		justify-content: center;
		background: url('../images/about-bg.jpg') repeat;
	}

	header .nav.open {
		right: 0;
	}

	header .nav .link {
		height: auto;
		font-size: 17px;
		margin: 10px 0;
	}

	header .nav .link .down {
		padding: 18px 40px;
		box-shadow: 0 0 5px #f3f3f3 inset;
	}

	header .nav .link .down a {
		margin: 10px 0;
		font-size: 15px;
	}

	header .en {
		width: 60px;
		height: 60px;
		font-size: 24px;
	}

	.scroll header .en {
		width: 40px;
		height: 40px;
		font-size: 16px;
	}

	footer {
		padding: 75px 104px 70px 63px;
	}

	.foot-logo {
		width: 104px;
		margin: 0 40px 50px 0;
	}

	.foot-link dl {
		width: 50%;
		text-align: left;
		margin: 0 0 50px;
	}

	.foot-logo-bottom {
		width: 100%;
		margin: 0 0 50px;
	}

	.foot-link {
		width: 100%;
	}

	.foot-link dt {
		font-size: 14px;
		margin-bottom: 1em;
		letter-spacing: 1px;
	}

	.foot-link dd,
	.foot-logo-bottom li {
		font-size: 12px;
		margin-bottom: 1.3em;
		color: #878787;
	}

	.foot-link dd img {
		width: 125px;
	}

	footer .line {
		display: none;
		padding: 25px 0;
	}

	footer .line::after {
		height: 2px;
		border-radius: 2px;
		transform: translateX(0px);
	}








	.C-more {
		box-shadow: 0px 12px 7px 0px rgba(0, 0, 0, 0.35);
		width: 140px;
		height: 46px;
		font-size: 14px;
	}

	.C-banner {
		padding: 111px 0 0;
	}

	.C-banner .main {
		width: 600px;
	}

	.C-banner .main .pic {
		width: 490px;
	}

	.C-banner .main .intr {
		top: 52%;
	}

	.C-banner .main .intr p {
		font-size: 28px;
		text-shadow: 0px 0px 40px #fff;
	}

	.C-banner.product .main .intr {
		top: 58%;
	}

	.C-banner.letter .main .intr p {
		letter-spacing: 5px;
		transform: translateX(5px);
	}

	.C-title h2 {
		font-size: 52px;
	}

	.C-title h3 {
		font-size: 44px;
		margin-bottom: 20px;
	}

	.C-title p {
		font-size: 16px;
	}

	.add .pic {
		width: 45px;
		margin: 5px 0;
	}

	.points {
		padding: 0 0 10px;
	}

	.points span {
		margin: 0 65px;
		width: 7px;
		height: 7px;
	}

	@keyframes ani-shadow {
		0% {
			box-shadow: 0 0 5px 0px #fff;
		}

		100% {
			box-shadow: 0 0 5px 2px #fff;
		}
	}
}

@media screen and (max-width:768px) {


	footer {
		padding: 45px 5% 0px;
	}

	.foot-link dt {
		font-size: 12px;
	}

	.foot-link {
		width: 100%;
	}

	.foot-link dl {
		width: 50%;
		text-align: left;
		margin: 0 0 50px;
	}

	.C-title h2 {
		font-size: 40px;
	}

	.C-title h3 {
		font-size: 32px;
		margin-bottom: 10px;
	}

	.C-title p {
		font-size: 12px;
	}

	.C-banner {
		padding: 73px 0 0;
	}

	.C-banner .main {
		width: 396px;
	}

	.C-banner .main .pic {
		width: 323px;
	}

	.C-banner .main .intr p {
		font-size: 18px;
		text-shadow: 0px 0px 26px #fff;
	}


	.add .pic {
		width: 45px;
		margin: 5px 0;
	}

	.points {
		padding: 0 0 10px;
	}

	.points span {
		margin: 0 25px;
		width: 7px;
		height: 7px;
	}

	@keyframes ani-shadow {
		0% {
			box-shadow: 0 0 5px 0px #fff;
		}

		100% {
			box-shadow: 0 0 5px 2px #fff;
		}
	}
}

@media screen and (max-width:480px) {

	.points span {
		margin: 0 15px;
		width: 3px;
		height: 3px;
	}

	.C-banner {
		padding: 48px 0 0;
	}

	.C-banner .main {
		width: 90%;
	}

	.C-banner .main .pic {
		width: 213px;
	}

	.C-banner .main .intr p {
		letter-spacing: 0.7em;
		transform: translateX(0.7em);
		font-size: 18px;
		text-shadow: 0px 0px 26px #fff;
	}
}






@charset "utf-8";
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "微软雅黑"
}
a {
    text-decoration: none
}
ul {
    list-style: none
}
.card-fouth {
    /*padding: 62px 0 88px;*/
    /*background: rgba(246,246,246,.31)*/
}
.card-fouth .sub-title {
    margin-bottom: 32px;
    text-align: center;
    font-size: 40px;
    color: #333
}
.card-fouth .desc.desc-list {
    font-size: 0;
    color: #3a3a3a;
    font-weight: 200;
    width: 1280px;
    margin: 0 auto;
    margin-bottom: 45px;
    white-space: nowrap;
    overflow: hidden;
    text-align: center
}
/*顶部分类*/
.card-fouth .industry {

    /*font-size: 12px;*/
    color: #999;
    padding: 15px 0 0 0;
    display: inline-block;
    /*border-bottom: 1px solid hsla(0,0%,85%,.4);*/
    width:145px
}
.xxf{width:55px;height: 55px}
.xxf1{width:80px;height: 80px}
.card-fouth .industry.first {

    padding-left: 0
}
.card-fouth .industry.last {
    padding-right: 0
}
.card-fouth .industry.active {
        transform: scale(1.2);
    /*padding-bottom: 14px*/
}
.card-fouth .industry span {
    font-family: PingFang SC;
    font-weight: 400
}
.card-fouth .industry.active span {
    background: #01ace6;
display: inline-block;
/*margin-top: 10px;*/
  /*width: 10px;*/
  /*height: 10px;*/
  border-radius: 50%;
  /*  font-size: 28px;
    font-weight: 700;
    color: #2267fa;
    border-bottom: 5px solid #2267fa;
    padding-bottom: 5px;
    font-weight: 500*/
}
/*内容*/
.card-fouth .case-container {
    position: relative;
    width: 1280px;
    margin: 0 auto;
    height: 480px
}
.card-fouth .case-panel {
    position: absolute;
    z-index: 1;
    opacity: 0;
    overflow: hidden;
    /*padding-left: 35px*/
}
.card-fouth .case-panel.active {
    z-index: 100;
    opacity: 1;
    -webkit-transition: all .2s ease-out .1s;
    transition: all .2s ease-out .1s
}
.card-fouth .case-preview {
    display: inline-block;
    width:800px;
    position: relative;
    top: 28px;
    /*left: -60px;*/
    z-index: 200
}
/*内容左侧*/
.card-fouth .case-left {
    display: inline-block;
    vertical-align: top
}
.card-fouth .case-left img {
    width: 435px
}
.card-fouth .phone-framework {
    z-index: 102;
    position: relative
}
.card-fouth .case-left .phone-image-cover {
    position: absolute;
    width: 250px;
    height: 426px;
    top: 30px;
    left: 35px;
    z-index: 101;
    background-color: rgba(0,0,0,.6);
    text-align: center;
    display: block
}
.card-fouth .case-left .phone-image-cover img {
    width: 118px;
    margin-top: 150px;
    z-index: 103
}
.card-fouth .case-left .phone-image-cover div {
    margin-top: 10px;
    color: #ffffff;
    font-size: 13px
}
.card-fouth .case-left .phone-image-cover.hidden {
    display: none
}
.card-fouth .case-left .phone-image {
    position: absolute;
    width: 240px;
    top: 30px;
    left:40px;
    z-index: 1;
    opacity: 0
}
.card-fouth .case-left .phone-image.active {
    z-index: 100;
    opacity: 1;
    -webkit-transition: all .2s ease-out .1s;
    transition: all .2s ease-out .1s
}
/*内容右侧*/
.card-fouth .case-head {
    font-size:28px;
    line-height: 36px
    color: #242424;
    margin-bottom: 20px;
    font-weight: bold
}
.card-fouth .case-text {
    font-size: 1.05vw;
    line-height: 2;
    color: #fff;
    padding-bottom: 50px;
    /*height: 107px*/
}
.card-fouth .case-content {
    width: 800px;
    margin-top: 10px
}
.card-fouth .case-icon-list {
    font-size: 0;
    width:800px
}
.card-fouth .case-icon-list img {
    margin-top: 35px;
    margin-right: 30px;
    display: inline-block;
    width: 117px;
    border-radius: 20px
}
.card-fouth .case-content img {
    margin-top: 15px;
    width: 576px;
    height: 1px;
    opacity: 0.3
}
.card-fouth .case-icon-list .image-hover {
    /*width: 75px*/
}
.card-fouth .case-icon-list div.active {
    /*border: 2px solid #1696ff*/
    background:#0382D3;
}
.card-fouth .case-icon-list div.last {
    margin-right: 0
}
.card-fouth .industry-tab-line {
    height: 2px;
    background: #2267fa;
    top: 164px;
    position: absolute;
    -webkit-transition: all .3s;
    transition: all .3s
}


.AvJmE.fade-in {
    animation: 1200ms cubic-bezier(0.25, 0.1, 0.25, 1) 0s 1 normal both running eyoqRe;
}

.AvJmE {
    width:1200px;
    margin:0 auto;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
}
.gMGPFV {
    width: 360px;
    height: 640px;
    position: relative;
}
.dIcerT {
    position: absolute;
    width: 30px;
    height: 30px;
    bottom: 110px;
    left: 212px;
}
.gMGPFV > img {
    width: 360px;
    height: 640px;
}

.gMGPFV > div:nth-child(2) {
    font-size: 18px;
    position: absolute;
    bottom: 20px;
    width: 360px;
    text-align: center;
    color: rgb(153, 153, 153);
}

.xym11 {
    background: rgba(38,45,60,.6);
    border-radius: 8px;
    padding: 32px 24px;
    width: 200px;
    height: 222px;
    float: left;
    margin-right: 30px;
}
.xym1 {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
}

.xym2 {
    color: #FFF;
    font-size:  0.742vw;
    line-height: 2;
    margin: 16px auto 32px;
}


/*12313*/