html,
body {
	height: 100%;
	margin: 0px;
	font-size: 62.5%;
}

a {
	text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
	margin: 0px;
}

#app {
	width: 1200px;
	margin: auto;
	font-size: 1.4rem;
	font-family: Arial, 'Raleway', sans-serif;
}

.head {
	border-bottom: .1rem solid #bfbfbf;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0rem 0px 3.5rem;
}

.head .left {
	flex: 1;
}

.head .left h2 {
	font-size: 2.6rem;
	font-weight: bold;
	padding-bottom: 1rem;
	border-bottom: .1rem solid #bfbfbf;
}

.head .left .p {
	font-size: 2rem;
	line-height: 3rem;
	margin-top: 2.8rem;


}

.head .left .p span {
	color: #0292de;
	text-decoration: underline;
}

.head .right {
	width: 600px;
	margin-left: 3.6rem;


}

.head .right .video {
	width: 100%;
	height: 335px;
	display: block;
	margin-top: 5.6rem;
}

.tabs {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 2rem;
}

.tabs .item {
	width: 24%;
	line-height: 3.5rem;
	color: #222679;
	text-align: center;
	border-radius: 1rem;
	cursor: pointer;
	border: .1rem solid #ddd;
}

.tabs .active {
	background: #222679;
	color: #fff;
}

.calute-img {
	display: flex;
	justify-content: space-between;
	margin-top: 3rem;
}

.calute {
	width: 64rem;
	background: #f1f1f1;
	padding: 2rem;
	border-radius: .5rem;
	margin-right: 2rem;
}

.lazyload, .lazyloading {
	opacity: 1 !important;
}

.select-type {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-bottom: 2rem;
}

.select-type span {
	border: 1px solid #ddd;
	background: #fff;
	display: inline-block;
	width: 6rem;
	line-height: 3rem;
	margin-left: 1rem;
	text-align: center;
	cursor: pointer;
	border-radius: 1.5rem;
}

.select-type span.active {
	background: #0292de;
	color: #fff;
}

.from-item {
	display: flex;
	align-items: center;
	margin-bottom: 2rem;
	justify-content: center;
}

.col {
	display: flex;
	justify-content: space-between;
	align-items: center;

}

.col .from-item {
	width: 50%;

}

.from-item .name {
	width: 15rem;
	text-align: right;
}

.from-item .name span {
	display: block;
	font-size: 1.4rem;
}

.from-item .name.outerInnerType {
	cursor: pointer;
}

.from-item .name span.grey {
	color: #999;
}

.from-item input,
.from-item select {
	flex: 1;
	height: 2.66rem;
	margin-left: .4rem;
	outline: none;
}

.from-item select {

	height: 2.86rem;
}

.from-item .btn {
	width: 12rem;
	line-height: 3.6rem;
	text-align: center;
	border-radius: .5rem;
	background: #222679;
	color: #fff;
	cursor: pointer;
	margin-top: 2rem;

}

.calute-img .img {
	width: 50rem;

}

.calute-img .img img {
	width: 100%;
	display: block;
}

.email-specifications {
	margin-top: 4rem;
	display: flex;

}

.email {
	background: #f1f1f1;
	border-radius: 2rem;
	overflow: hidden;
	width: 49rem;
	margin-left: 3rem;
	color: #666;
}

.email .title {
	background: #0292de;
	line-height: 3.5rem;
	color: #fff;
	text-align: center;
}

.email .to {

	margin: 0px 5rem;
	padding: 2rem 0px;
	min-height: 20rem;
}

.email .to .to_icon {
	width: 10rem;
}

.email .to .i {

	display: flex;
	align-items: center;
}

.email .to .i .name {
	text-align: right;
	width: 20rem;
	color: #666;
	font-weight: 666;
	display: inline-block;
	line-height: 2.66rem;

}

.loaded-input {
	width: 29rem;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0px 1rem;
}

.email .to .i .loaded-input input {
	text-align: center;
	width: 95%;
	height: 2.66rem;
	outline: none;
	margin-right: .5rem;
}

.email .to .i .loaded-input span {
	width: 3rem;
	text-align: center;
	display: block;
}

.email .to .i .btn {
	width: 12rem;
}

.email-info {
	border-top: .1rem solid #bfbfbf;
	padding-top: 1rem;
	font-size: 1.3rem;
	color: #666;
	padding: 2rem 5rem;


}

.email-input {
	display: flex;
	align-items: center;
	justify-content: center;
}

.email-input input {
	text-align: center;
	width: 30rem;
	height: 2.66rem;
	outline: none;
	margin-left: .5rem;
}

.email .btn {
	width: 12rem;
	line-height: 3.2rem;
	text-align: center;
	border-radius: .5rem;
	background: #0292de;
	color: #fff;
	cursor: pointer;
	margin: 2rem auto;
}

.specifications {
	flex: 1;
	border-radius: 2rem;
	overflow: hidden;

	background-color: #f1f1f1;
}

.specifications .title {
	background: #222679;
	line-height: 3.5rem;
	color: #fff;
	text-align: center;
}

.attrs {
	display: flex;
	flex-wrap: wrap;
	padding: 2rem;
	color: #666;
	min-height: 21rem;
	padding-bottom: .1rem;
}

.attrs .attr {
	width: 49%;
	display: flex;
	align-items: center;
	margin-bottom: 2rem;
}

.attrs .attr span {
	font-weight: 666;
}

.attrs .attr p {
	margin-left: .4rem;
}

.info {
	border-top: .1rem solid #bfbfbf;
	display: flex;
	align-items: center;
	margin-top: 1rem;
	padding: 1.5rem 2rem 1.5rem;
}

.info p {
	color: #666;
	flex: 1;
	font-size: 1.3rem;
}

.info span {
	margin-left: 3rem;
	width: 12rem;
	line-height: 3.6rem;
	text-align: center;
	border-radius: .5rem;
	background: #222679;
	color: #fff;
	cursor: pointer;
}

.fo {
	margin-top: 3.6rem;
	border-top: .2rem solid #bfbfbf;
}

.fo h3 {
	margin-top: 2.6rem;
	font-size: 3.6rem;
	text-align: center;
	margin-bottom: 3.5rem;
}

.fo .grey {
	font-size: 2rem;
}

.fo .links {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 4.4rem 0px 4.4rem;
}

.fo .links a {
	margin-left: 3rem;
	width: 16rem;
	line-height: 4.2rem;
	text-align: center;
	border-radius: .5rem;
	background: #222679;
	color: #fff;
	cursor: pointer;
}