html {
	font-size: 16px;
}

body{
    padding: 0;
    margin: 0;
    background: #020c25;
}
* {
	-webkit-text-size-adjust: none;
}
.hidden {
	display: none;
}
a,a:link,a:visited,a:hover,a:active{
    text-decoration: none;
    color:inherit;
}
.header {
	width: 100vw;
	height: 3.5416vw;
	background: #030A19;
	color: #fff;
	padding-left: 17.5521vw;
	box-sizing: border-box;
	position: fixed;
	top: 0;
	z-index: 999;
}
.header .brand {
	margin-top: .3645vw;
	margin-right: 11.6145vw;
	float: left;
}
.header .icon {
	width: 13.5416vw;
	height: 2.8125vw;
}
.header .tags {
	font-size: 1.1458vw;
	line-height: 1.71875vw;
	display: flex;
}
.header .tag {
	padding: 1.0416vw 2.2916vw 0;
	height: 3.5416vw;
	position: relative;
	box-sizing: border-box;
	cursor: pointer;
}
.header .tag.active::after,
.header .tag:hover::after,
.header .tag:active::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 0.2083vw;
	background: #FFFFFF;
	border-radius: 0.15625vw;
}
.content {
	width: 100vw;
	height: 143.28125vw;
	background: url(./imgs/bg.jpg) 0 0/cover;
	padding-top: 16.61458vw;
	box-sizing: border-box;
	text-align: center;
}
.content .word1 {
	width: 52.0833vw;
}
.content .word2 {
	width: 41.8229vw;
	display: block;
	margin: 4.84375vw auto 0;
}
.content .chip {
	position: absolute;
	top: 68.0208vw;
	right: 0;
	width: 57.6041vw;
	height: 42.1354vw;
}
.content .qrcode {
	width: 10.8333vw;
	height: 11.1458vw;
	background: url(./imgs/box.png) 0 0/cover;
	margin: 4.8958vw auto 0;
	padding-top: 0.8854vw;
	box-sizing: border-box;
	font-size: 0.9375vw;
	color: #fff;
	position: relative;
}
.content .qrcodeImg {
	width: 7.0833vw;
	height: 7.0833vw;
	background: #fff;
	margin-top: 0.5729vw;
}
.content .word3 {
	width: 47.2916vw;
	height: 5.9375vw;
	display: block;
	margin: 15.75vw auto 0;
	padding-top: 5vw;
	position: relative;
}
.content .subTitle {
	font-size: 1.4583vw;
	color: rgba(255,255,255,0.85);
	margin-top: 1.4583vw;
	position: relative;
}
.content .products {
	position: relative;
	margin: 4.7916vw 0 0 4.375vw;
	width: 52vw;
}
.content .products .item {
	width: 21.5625vw;
	height: 10.4166vw;
	background: rgba(4,90,179,0.15);
	font-size: 1.4583vw;
	color: #fff;
	display: inline-block;
	margin: 0 1.6666vw 1.6666vw 0;
	padding: 2.3958vw 0 0 3.2291vw;
	box-sizing: border-box;
	text-align: left;
}
.content .products .item span {
	float: left;
	min-width: 8vw;
	margin-bottom: 1.4583vw;
}
.content .word4 {
	width: 33.3333vw;
	height: 5.9375vw;
	position: relative;
	margin-top: 7.3959vw;
}
.content .boards {
	margin-top: 4.2708vw;
	margin-left: 6.1979vw;
	position: absolute;
}
.content .board {
	width: 17.65625vw;
	height: 37.9166vw;
	float: left;
	margin-left: -1px;
	padding: 2.7083vw 2.03125vw;
	box-sizing: border-box;
}
.content .board.bg1 {
	background: url(./imgs/board1.png) 0 0/cover;
}
.content .board.bg2 {
	background: url(./imgs/board2.png) 0 0/cover;
}
.content .board.bg3 {
	background: url(./imgs/board3.png) 0 0/cover;
}
.content .board.bg4 {
	background: url(./imgs/board4.png) 0 0/cover;
}
.content .board.bg5 {
	background: url(./imgs/board5.png) 0 0/cover;
}
.content .board .title {
	font-size: 1.875vw;
	font-weight: 600;
	color: #000D27;
}
.content .board .tag {
	width: 13.4896vw;
	height: 2.6041vw;
	line-height: 2.6041vw;
	background: url(./imgs/tag.png) 0 0/cover;
	margin-top: 2.1875vw;
	margin-bottom: 0.3125vw;
	font-size: 1.1458vw;
	color: #fff;
}
.content .board .label {
	text-align: left;
	padding-top: 0.9375vw;
}
.content .board .label .name {
	font-size: 1.1458vw;
	color: rgba(0,13,39,0.45);
	margin-bottom: .4166vw;
}
.content .board .label .number {
	font-size: 2.0833vw;
	font-weight: 600;
	color: #000D27;
	line-height: 2.9166vw;
}
.content .board .label .unit {
	font-size: 1.1458vw;
	color: rgba(0,13,39,0.45);
	margin-left: .41666vw;
}
.content .board .result {
	font-size: 1.3541vw;
	color: #000D27;
	text-align: left;
	margin-top: 1.6666vw;
}
.content .board .result .number {
	font-size: 3.2291vw;
	font-weight: 600;
	color: #FD9422;
	line-height: 4.53125vw;
	margin: 0 .4166vw;
}
.boardall {
	width: 100vw;
	height: 21.1458vw;
}
.cases {
	margin-top: -4.5834vw;
	padding-top: 5vw;
	padding-bottom: 4.5555vw;
	position: relative;
}
.cases .title {
	width: 45.9375vw;
	height: 5.9375vw;
	margin: 0 auto;
	display: block;
}
.cases .list {
	display: flex;
	flex-wrap: wrap;
	margin: 3.6979vw 6.8229vw 0;
	justify-content: space-around;
}
.cases .item {
	width: 15.78125vw;
	height: 9.5833vw;
	margin-bottom: 1.875vw;
	color: #fff;
	text-align: center;
	padding-top: 2.5521vw;
	box-sizing: border-box;
}
.cases .name {
	font-size: 1.4583vw;
	font-weight: 600;
}
.cases .pos {
	font-size: 1.0416vw;
	margin-top: .9375vw;
}
.cases .figure {
	width: 100vw;
	height: 32.7604vw;
	position: absolute;
	bottom: 0;
	left: 0;
}
.cooperates {
	width: 100vw;
	height: 53.6979vw;
	background: url(./imgs/cooperates.jpg) 0 0/ cover;
	padding: 8.59375vw 4vw 0;
	box-sizing: border-box;
}
.cooperates .title {
	width: 54.375vw;
	height: 5.9375vw;
	margin: 0 auto;
	display: block;
}
.cooperates .list {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 7vw;
}
.cooperates .list .item {
	width: 20%;
	height: 5.2083vw;
	margin-bottom: 5vw;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.footer {
	width: 100vw;
	height: 54.53125vw;
	background: url(./imgs/footer.jpg) 0 0/ cover;
	padding: 4.84375vw 6.8229vw 0;
	box-sizing: border-box;
	font-size: 1.4583vw;
	color: rgba(255,255,255,0.85);
	position: relative;
}
.footer .title {
	font-weight: 600;	
}
.footer .title .icon {
	width: 2.5vw;
	height: 2.5vw;
	float: left;
	margin-right: .78125vw;
}
.footer .title .name {
	font-size: 1.7708vw;
}
.footer .title .sub {
	font-size: 2.8125vw;
	margin-top: .67708vw;
	line-height: 3.90625vw;
}
.footer .des {
	margin-top: 1.6666vw;
	width: 71.875vw;
}
.footer .tel {
	margin-top: 14.84375vw;
}
.footer .pos {
	margin-top: .6770vw;
}
.footer .copyright {
	position: absolute;
	bottom: 0;
	left: 4.375vw;
	right: 4.375vw;
	height: 4.0104vw;
	line-height: 4.0104vw;
	border-top: 1px solid rgba(255,255,255,0.45);
	font-size: .8333vw;
	color: rgba(255,255,255,0.65);
	text-align: center;
}
.footer .copyright a {
	text-decoration: underline;
	cursor: pointer;
}
.sus {
	width: 5.9375vw;
	background: rgba(0,0,0,0.45);
	border-radius: .2083vw;
	padding: 1.6666vw 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	position: fixed;
	right: 0;
	top: calc(50vh - 12vw);
	text-align: center;
}
.sus .icon {
	width: 1.7708vw;
	height: 1.7708vw;
}
.sus .icon.active {
	display: none;
}
.sus .item {
	position: relative;
	cursor: pointer;
}
.sus .item + .item {
	margin-top: 1.25vw;
}
.sus .name {
	font-size: .9375vw;
	margin-top: .5208vw;
	color: rgba(255,255,255,0.85);
}
.sus .hoverbox {
	position: absolute;
	right: 5.9vw;
	display: none;
	border: 0;
}
.sus .item:hover .hoverbox,
.sus .item:active .hoverbox,
.sus .item.active .hoverbox {
	display: block;
}
.sus .item:hover .icon.normal,
.sus .item:active .icon.normal,
.sus .item.active .icon.normal {
	display: none;
}
.sus .item:hover .icon.active,
.sus .item:active .icon.active,
.sus .item.active .icon.active {
	display: inline;
}
.sus .item:hover .name,
.sus .item:active .name,
.sus .item.active .name {
	color: #1890FF;
}
.sus .hoverbox.weixin {
	width: 16.09375vw;
	height: 16.0416vw;
	bottom: -5.5208vw;
	background: url(./imgs/wechatbox.png) 0 0/contain no-repeat;
}
.sus .hoverbox .weixin_tip {
	font-size: 1.1458vw;
	color: #000D27;
	padding-top: 1.25vw;
	padding-left: 2.9166vw;
	width: 9.1666vw;
}
.sus .hoverbox .weixin_qr {
	width: 11.1458vw;
	height: 11.1458vw;
	margin-left: 1.9271vw;
	display: block;
}
.sus .hoverbox.tel {
	width: 16.09375vw;
	height: 5.4166vw;
	bottom: -.5208vw;
	background: url(./imgs/telbox.png) 0 0/contain no-repeat;
	font-size: 1.1458vw;
	text-align: left;
}
.sus .hoverbox .tel_icon {
	width: 2.7083vw;
	height: 2.7083vw;
	float: left;
	margin: 1.3541vw 1.3541vw 0 1.5625vw;
}
.sus .hoverbox.talk {
	width: 17.03125vw;
	height: 4.7916vw;
	bottom: .2604vw;
	background: url(./imgs/kfbox.png) 0 0/contain no-repeat;
	text-align: left;
	font-size: 1.1458vw;
	color: rgba(0,13,39,0.65);
	line-height: 1.5625vw;
}
.sus .hoverbox .talk_icon {
	width: 3.4375vw;
	height: 3.4375vw;
	float: left;
	margin: .67708vw .9375vw 0 1.3541vw;
}
.dialog {
	width: 31.6145vw;
	height: 21.5104vw;
	position: fixed;
	top: 32.5925vh;
	left: 34.1666vw;
	background: url(./imgs/dialog.jpg) 0 0/cover no-repeat;
	border-radius: 4px;
	padding: 1.8229vw;
	box-sizing: border-box;
	display: none !important;
}
.dialog .tel {
	font-size: 1.4583vw;
	color: #FD9422;
	font-weight: 600;
}
.dialog .tip {
	font-size: .9375vw;
	margin-top: .8333vw;
}
.dialog .qrcode {
	width: 8.6979vw;
	height: 8.6979vw;
	margin-top: .78125vw;
	display: block;
}
.dialog .btn {
	width: 27.96875vw;
	height: 2.3958vw;
	line-height: 2.3958vw;
	margin-top: 2.34375vw;
	background: #1890FF;
	color: #fff;
	font-size: 1.0416vw;
	text-align: center;
}
.dialog .close {
	width: 1.9791vw;
	height: 1.9791vw;
	position: absolute;
	top: .5208vw;
	right: .5208vw;
}
@media screen and (max-width: 720px) {
  .content .board .label {
  	padding-top: 0.2vw;
  }
  .content .board .result {
  	margin-top: .2vw;
  }
}
@media screen and (min-width: 768px) {
  .content {
  	margin-top: calc(50vh - 31.92708vw);
  }
}

@media screen and (max-width: 720px) {
	html,body,.content,.header {
		width: 100vw;
		overflow-x: hidden;
	}
	.header {
		padding-left:  5vw;
		height: 26px;
	}
	.header .brand {
		margin-right: 10px;
	}
	.header .icon {
		width: 102px;
		height: 22px;
	}
	.header .tag {
		font-size: 10px;
		padding-top: 8px;
    height: 26px;
    line-height: 12px;
    white-space: nowrap;
	}
	.content {
		margin-left: -25%;
		transform: scale(1.5);
    transform-origin: left top;
		height: 224.921875vw;
		padding: 16.61458vw 25vw 0;
		background: url(./imgs/bg.jpg) top center / 100vw auto no-repeat;
	}
	.content .word1 {
		position: relative;
    top: -5vw;
	}
	.content .word2 {
		position: relative;
    top: 7vw;
	}
	.content .qrcode {
		transform: scale(2.5);
		padding-top: 0;
	}
	.content .qrcode span {
		white-space: nowrap;
		transform: scale(.4);
    font-size: 10px;
		display: block;
		width: 150%;
		margin-left: -25%;
		margin-bottom: -1vw;
	}
	.content .products {
		margin: 4.7916vw auto 0 auto;
	}
	.content .chip {
		left:  0;
		margin: auto;
	}
	.content .boards {
		width: 60%;
    margin: 4.2708vw auto 0;
    left: 0;
    right: 0;
			display: flex;
			flex-wrap: wrap;
    justify-content: space-around;
    white-space: nowrap;
	}
	.content .board {
		height: unset
	}
	.content .board .tag {
		width: 26.9792vw;
    height: 5.2082vw;
    line-height: 5.2082vw;
		font-size: 2.2916vw;
		transform: scale(.5);
		transform-origin: left;
	}
	.content .board .label .name {
		font-size: 1.0416vw;
	}
	.boardall {
		margin-top: 80vw;
	}
	.cases .item {
		width: 23.671875vw;
		height: 14.37495vw;
	}
	.cases .name {
		font-size: 2.18745vw;
	}
	.cases .pos {
		font-size: 1.5624vw;
	}
	.dialog {
		transform: scale(2);
		height: unset;
	}
	.sus {
		transform: scale(2);
    transform-origin: right;
		min-width: 5.9375vw;
		width: auto;
	}
	.sus .name {
		font-size: 1.875vw;
    margin-top: 1.0416vw;
		transform: scale(.5);
	}
	.sus .item {
		white-space: nowrap;
	}
	.sus .hoverbox {
		font-size: 10px;
	}
	.sus .hoverbox.talk {
		line-height: 2.5vw;
	}
	.sus .hoverbox.tel div {
		font-size: 10px;
		height: 10px;
		line-height: 10px;
	}
	.sus .hoverbox.tel div {
		transform: scale(.6);
		transform-origin: center top;
		white-space: nowrap;
		margin-top: .3vw !important;
		margin-left: -20px;
	}
	.sus .hoverbox .talk_icon {
		margin: .67708vw .5vw 0 .1vw;
	}
	.sus .hoverbox.weixin .weixin_tip {
		width: 200%;
		margin-left: -66%;
		margin-bottom: -8.5vw;
		font-size: 16px;
		transform: scale(.35);
		transform-origin: top;
	}
	.cooperates {
		height: 105vw;
		background:  url(./imgs/cooperates.jpg) center center/ 100% auto no-repeat;
	}
	.cooperates .list .item {
		width: 30%;
		height: 8vw;
		transform: scale(1.3);
		transform-origin: center top;
		height: 40px;
	}
	.footer .title {
		transform: scale(1.8);
		transform-origin: left top;
		height: 49px;
	}
	.footer {
		font-size: 8px;
	}
	.footer .tel {
		margin-top: 11vw;
	}
	.footer .copyright {
    font-size: 8px;
    height: 20px;
    line-height: 20px;
	}
}