*{padding:0;margin:0;} 
html { font-size:62.5%!important;} 
body { background: #fff;  font-family: 'Microsoft Yahei', '微软雅黑', 'simsun', Arial; color:#333; font-size:1.2rem ; }
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
:focus{outline: 0;} 
ol,ul{list-style:none;} 
hr{ border:0; padding:0; margin:0; display:block}
a{ text-decoration:none;}
a:hover{text-decoration:none;}   
/* 头部 */
.head {
	width: 100%;
	background-color: #fefefe;
	position: fixed;
	top: 0;
	z-index: 99;
	box-shadow: 0 0.2rem 0.8rem 0 #0000001a; 
}
.head_con { 
	width:120rem;
	height: 7rem;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	overflow:hidden;
}
.head .logo img { width: 90%;}
.head_nav {
	height: 100%; 
	display: flex;
  align-items: center; 
}
.head_nav a {
	height: 100%;
	line-height: 7rem;
	font-size: 1.6rem;
	float: left;
	color: #23314f;
	padding: 0 0.7rem;
	margin: 0 1.2rem 0 1.2rem;
	box-sizing: border-box;
} 
.head_nav .on { 
	border-bottom: 0.2rem #3086f2 solid; 
}
.head_nav a:hover {
	color: #3086f2;
}
.head_nav .btn-top { 
	display: inline-block;
	width: 11.4rem;
	height: 4rem;
	color: #fff;
	border: solid 0.1rem #5383FE;
	font-size: 1.4rem;
	line-height: 4rem;
	background-color: #5383FE;
	-moz-border-radius: 0.2rem;
	-webkit-border-radius: 0.2rem;
	border-radius: 0.2rem;
	text-align: center;
	margin-right: 0;
} 
.head_nav .btn-top:hover {
	opacity: 0.9;
	color: #fff;
}
/* i-banner */ 
.i-banner {
  width: 100%;
  height: 76rem; 
	display: flex;
  overflow: hidden;
  background-image:url(../images/banner1.png?1);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}
.i-banner .banner-box {
  width: 120rem;
	margin: 0 auto;
  display: flex;
	justify-content: space-between;
	align-items: center;
}
.i-banner .banner-box .banner-left { 
  width: auto; 
}
.i-banner .banner-box .banner-left h1 {
  line-height: 7.3rem;
  font-size: 5.2rem;
  font-weight: bold;
  color: #fff;
}
.i-banner .banner-box .banner-left h2 {
  font-size: 2.4rem;
  font-weight: 300;
  line-height: 3.3rem;
  letter-spacing: 0.2rem;
  margin-top: 0.6rem;
  color: #fff;
}
.i-banner .banner-box .banner-left h2:first-child{
	font-weight: 500;
	margin-bottom: 2rem; 
} 
.i-banner .banner-box .banner-left #version-info {
  margin-top: 2rem;
  font-size: 1.4rem;
  color: #ffffff;
  opacity: 0.7;
}
.i-banner .banner-box .banner-left #version-info .mac-info {
  display: none;
}
.i-banner .banner-box .banner-computer {
  background-image: url("../images/banner2.png?1");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  width: 66.8rem;
  height: 38.4rem; 
}

/* index */
.index-detail-main {
	width: 100%;
	padding: 10rem 0;	
}
.index-detail-main:nth-child(odd) {
	background-color: #f5f7fa;   
} 
.index-detail {
	width: 120rem; 
	padding: 0 4rem;
	box-sizing: border-box;
	margin: 0 auto; 	 
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: ; 
} 
.index-detail-main:nth-child(even) .index-detail {
	flex-direction:row-reverse;
}
.index-detail-main:nth-child(even) img {
	margin-left: -5rem;
}
.index-detail-main:nth-child(1) {
	padding-bottom: 0;
} 
.index-detail div{
	width: 41.6rem;
	flex: none; 
}
.index-detail img { 
	
}
.index-detail-main h2 {
	font-weight: 550;
	font-size: 4.4rem;
	color: #333333;
	padding-bottom: 2rem;
	line-height: 6.2rem; 
}
.index-detail-main h2 span {
	color: #e86554;
}
.index-detail-main p {
	font-size: 1.6rem;
	line-height: 3.6rem;
	text-align: justify;
	color: #666666;
}

 
/* 客户案例 */
.case-banner { 
	width: 100%;
	background: #2B2E33 url(../images/banner3.jpg) no-repeat top center;
	height: 30rem;
	padding-top: 19rem; 
	background-size: cover; 
	text-align: center;
}
.case-banner h2 { 
	line-height: 8.4rem;
	color: #fff;
	font-weight: 500;
	font-size: 6rem; 
}
.case-banner .js-free-use {
	display: block;
	width: 22rem;
	height: 4.4prem;
	line-height: 4.4rem;
	background: #2373FF;
	-webkit-border-radius: 4.5rem;
	-moz-border-radius: 4.5rem;
	border-radius: 4.5rem;
	text-align: center;
	font-size: 1.6rem;
	letter-spacing: -0.336rem;
	color: #FFFFFF;
	margin: 2.7rem auto 0;
}

.case-page {
	width: 120rem;
	margin: 0 auto;
	padding: 10rem 0 ;
}
.case-page-details {
	padding: 10rem 5rem;
	padding-top: 15rem;
	box-sizing: border-box;
}
.case-page-title {
	line-height: 4rem;
	text-align: center;
	margin-bottom: 5rem;
}
.case-page-title h2 { 
	font-size: 2.4rem; 
}
.case-page-title p { 
	font-size: 1.4rem;
	color: #666;
} 
.case-page ul { 
	width: 100%; 
	display: inline-block; 
}
.case-page ul li {
	width: 20%;
	float: left;
	padding: 0 0.4rem;
	box-sizing: border-box;
	margin-bottom: 2rem;
}
.case-page ul li a {
	width: 100%;
	height: 12rem;
	padding: 2rem; 
	box-sizing: border-box;
	border: .1rem solid #f0f0f0;
	display: flex; 
	justify-content: center;
}
.case-page ul li a div {
	height: 8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow:hidden;
}
.case-page ul li a img {
	width: 100%;
}
.case-page-article {
	font-size: 1.4rem;
	line-height: 3rem;
}
.case-page-article p {
	margin-bottom: 2rem;
}
/* 关于我们 */
.about-page {
	width: 100%;
	height: 100vh; 
	position: relative;
}
.about-page .map {
	width: 100%;
	height: 100vh; 
	padding-top: 7rem;
	box-sizing: border-box;
	position: absolute;
	left: 0;
	top: 0;
}
.about-page-rbg {
	position: absolute;
	bottom: 0;
	z-index: 1;
	right: 0; 
	border-bottom: 95rem solid; 
	border-color: #0000009c;
	border-left: 35rem solid transparent;
	border-right: 0 solid transparent;
	width: 28%;
	opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
}
.about-page-r {
	position: absolute;
	top: 30%;
	right: 20rem; 
	z-index: 9;
	width: 28%;
	text-align: right; 
	color: #fff;
	font-size: 1.6rem;
	line-height: 5rem;
	cursor: pointer;
}
.about-page-r1,.about-page-r2 {
	position: relative;
	transition: all 0.6s cubic-bezier(0.77,0,0.175,1) 600ms;
	transition-duration: 1.2s;
	margin-bottom: 5rem;
} 
.about-page-r .title {  
    position: relative; 
	display: table;
    margin-inline-start: auto;
}
.about-page-r1 .title {
	font-size: 2.4rem;
	height: 6rem;
	font-weight: normal; 
}
.about-page-r .line {
	position:absolute;
	right: 0;
	top: 5rem;
	height: .15rem;
	width: 100%;
	background-color: #e86554;
	opacity: 1;
	transform: translateY(0);
	right: 0;
	left: auto;
	transition: width 0.5s ease-out;
}
.about-page-r2 .line {
	top: 0rem;
}
.about-page-r1:hover .line,
.about-page-r2:hover .line {
    width: 60%;
}
/* 账户开通 */
.open-page {
	width: 80rem;
	margin: 0 auto;
	padding: 12rem 0 10rem;
	/* display: flex;
	justify-content: space-between; */
}
.open-page-title {  
	font-size: 1.4rem;
	line-height: 4rem;
	color: #676C73;
	margin-top: 1rem;
}
.open-page-title h2 {
	font-weight: 500;
	font-size: 2.4rem;
	line-height: 3.4rem;
	color: #111F33;
	margin-bottom: 2rem;
}
.open-page-main { 
	box-sizing: border-box;
	padding: 3rem 10rem 3rem 3rem;
	border: 0.1rem solid #eee;
	margin-top: 4rem;
	width:70rem;
	font-size: 1.4rem;
} 
.open-page-main div { 
	margin-bottom: 2rem;
	display: flex;
  	align-items: center;
} 
.open-page-main label {
	width: 10rem;  
	text-align: right;
	display: inline-block;
}
.open-page-main input { 
	flex: 1;
	height: 3.6rem;
	line-height: 3.6rem;
	border: 0.1rem solid #eee;
	display: inline-block;
	box-sizing: border-box; 
	padding-left: .8rem;
}
.open-page-main .auth input {
margin-right: 3rem;
}
.open-page-main .auth .log-yzm {
 	color: #4799fe;
	background: none;
	border: none;
	font-weight: bold;
}
.open-page-main .submit { 
	height: 4.5rem;
	line-height: 4.5rem; 
	text-align: center;
	font-size: 1.6rem; 
	border-radius: .2rem;
	background: #e86553; 
	color: #fff; 
	flex: 1; 
	margin-top: 2rem;
}

/* 底部 */
footer {
	width: 120rem;
	margin: 0 auto;
	background-color: #fff;
}
.footer1 {
	padding: 10rem 0;
	text-align: center;
}
.footer1 h2 {
	font-size: 4.4rem;
	font-weight: 550;
}
.footer1 p{
	padding: 10rem 0 5rem;
	font-size: 1.6rem;
}
.footer1 a {
	width: 14rem;
	height: 5rem;
	display: block;
	text-align: center;
	line-height: 5rem;
	margin: 0 auto;
	background-color: #5383fe;
	color: #fff;
	font-size: 1.8rem;
}
.footer2 {
	padding: 5rem 0;
	border: 0.1rem solid #eee;
	border-left: none;
	border-right: none; 
}
.footer2 ul {
	width: 100%;
	display: flex;
	justify-content: space-between;
}
.footer2 ul li {
	display: flex;
	align-items: center;
}
.footer2 ul li i {
	margin-right: 3rem;
}
.footer2 ul li i img {
	width: 80%; 
}
.footer2 ul li:last-child i img {
	width: 90%;
}
.footer2 ul li h4 {
	font-size: 2rem;
	margin-bottom: 1.2rem;
}
.footer2 ul li p {
	font-size: 1.4rem;
}
.footer2 ul li .ico3 {
	margin: 0 0 0 3rem;
}
.footer3 {
	padding: 5rem 0;
	text-align: center;
	font-size: 1.4rem;
}
/* 手机端 */
@media screen and (min-width:0) and (max-width:1200px) { 
	.head_con { width: 100%; padding:0  1rem; box-sizing: border-box;}
	.head .logo img { width: 80%;}
	.head_nav a { margin: 0; padding: 0; margin-left: 1.5rem;}
	.head_nav .btn-top {width:initial; padding: 0 1rem;}
	.i-banner { height: initial; position: relative; }
	.i-banner .banner-box { width: 100%; padding: 0 2rem; box-sizing: border-box; display: flex; flex-wrap: wrap-reverse; justify-content: center; align-items: center; margin-top: 13rem;}
	.i-banner .banner-box .banner-computer { background-image: url(../images/b1.png?1); background-size: auto; margin-top: 3rem;}
	.i-banner .banner-box .banner-left h1 { font-size:3.2rem; letter-spacing: .3rem;}
	.i-banner .banner-box .banner-left h2:first-child { text-align: center; font-size: 3.2rem;}
	.i-banner .banner-box .banner-left h2 { font-size: 2.2rem; letter-spacing: 0;}
	.i-banner::after { width: 3rem; height: 3rem;  background: url(../images/a1.png?1) no-repeat center bottom;background-size: cover; position:absolute; bottom: 2rem; left: 50%; margin-left: -1.5rem; content: "";}
	/* 首页main */
	.index-detail { width: 100%; flex-wrap: wrap;}
	.index-detail-main { padding: 5rem 0;}
	.index-detail div { width: 100%;}
	.index-detail img { width: 100%;}
	.index-detail-main h2 { font-size: 3.2rem; text-align: center;}
	.index-detail-main:nth-child(5) .index-detail img {margin-left: -1.5rem;} 
	.index-detail-main:nth-child(6) .index-detail img {margin-left: -3.5rem;}  
	.index-detail-main:nth-child(7) .index-detail img { width: 90%; margin-left: 2.5rem;} 
	.index-detail-main:nth-child(9) .index-detail img {margin-left: -1.5rem;} 
	/* 案例 */
	.case-banner { padding: 10rem 0 5rem; height: initial; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
	.case-banner h2 { font-size: 3rem; width: 100%;}
	.case-page { width: 100%; padding: 5rem 2rem; box-sizing: border-box;}
	.case-page ul li { width: 50%;}
	.case-page-details { padding-top: 15rem;}
	/* 联系我们 */
	.about-page-rbg { width: 100%;}
	.about-page-r { width: 100%; padding: 0 2rem; box-sizing: border-box; right: 0;}
	.about-page-rbg {border-color: #000000b5;}
	/* 试用申请 */
	.open-page { width: 100%; padding: 10rem 2rem; padding-bottom: 5rem; box-sizing: border-box;}
	.open-page-main { width: 100%; padding:2rem;}
	/* .open-page-main .auth { position: relative;} */
	.open-page-main .auth input { margin-right: 1rem; min-width: 10rem; }
	/* .open-page-main .auth .log-yzm { position: absolute; right: 0;} */
	.open-page-main div:last-child label { display: none;}
	/* 底部 */
	footer { width: 100%;}
	.footer1 { padding: 8rem 2rem; box-sizing: border-box;}
	.footer1 p { line-height: 4rem; padding-top: 5rem;}
	.footer1 h2 { font-size: 3.2rem;}
	.footer2 ul {flex-wrap: wrap-reverse; padding: 0 2rem; box-sizing: border-box;}
	.footer2 ul li { width: 100%; margin-bottom: 3rem;}
	.footer2 ul li i { width: 3rem; margin-right:2rem;}
	.footer2 ul li i  img { width: 90%; }
	.footer3 { padding: 3rem 0;}
}