.esop-banner-1 {
	font-size: 48px;
	color: #333
}

.esop-banner-2 {
	margin-top: 6px;
	font-size: 24px;
	font-weight: 300
}

.esop-banner-button {
	width:auto;
	font-size: 24px;
	line-height: 48px;
	margin-top: 49px;
	padding: 0 24px;
	font-weight: 400;
	color: #fff;
	background: #c8132d;
	border-radius: 4px;
	cursor: pointer
}

.top-banner .item .esop-banner-button a{
	position:relative;
	display:inline-block;
	width:auto;
	left: 0;
	margin: 0;
	color: #fff;
}

.esop .esop-section2 {
	padding-top: 62px;
	padding-bottom: 62px
}

.esop h2 {
	font-size: 48px;
	font-weight: 400;
	font-family: "Microsoft YaHei","SimSun","\5b8b\4f53",sans-serif;
	text-align: center;
	color: #333
}

.esop .text {
	max-width: 874px;
	margin: 0 auto;
	padding-top: 12px;
	font-size: 16px;
	font-weight: 400;
	text-align: center;
	color: #333
}

.esop .esop-server-wrap {
	margin-top: 82px;
	padding: 51px;
	height: 460px;
	background: #fff;
	border: 1px solid #dcdfe6;
	border-radius: 10px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start
}

.esop .esop-server-wrap .esop-server-l,.esop .esop-server-wrap .esop-server-r {
	width: 50%
}

.esop .esop-server-wrap .esop-server-l ul,.esop .esop-server-wrap .esop-server-r ul {
	padding-left: 45px;
	padding-right: 69px
}

.esop .esop-server-wrap .esop-server-l ul li,.esop .esop-server-wrap .esop-server-r ul li {
	font-size: 14px;
	font-weight: 400;
	text-align: justifyLeft;
	color: #999
}

.esop .esop-server-wrap .esop-server-l .esop-server-title2 {
	margin-top: 32px
}

.esop .esop-server-wrap .esop-server-r {
	padding-left: 49px
}

.esop .esop-server-wrap .esop-server-m {
	width: 15px;
	height: 460px;
	background: url(../img/icon-server-m.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-server-m.png) 1x, url(../img/icon-server-m@2x.png) 2x)
}

.esop .esop-server-wrap h3 {
	position: relative;
	line-height: 30px;
	font-size: 20px;
	font-weight: 600;
	text-align: left;
	color: #313131;
	padding-left: 45px;
	margin-bottom: 20px
}

.esop .esop-server-wrap h3 .icon-server {
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
	height: 30px
}

.esop .esop-server-wrap h3 .icon-server-1 {
	background: url(../img/icon-server-1.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-server-1.png) 1x, url(../img/icon-server-1@2x.png) 2x);
}

.esop .esop-server-wrap h3 .icon-server-2 {
	background: url(../img/icon-server-2.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-server-2.png) 1x, url(../img/icon-server-2@2x.png) 2x);
}

.esop .esop-server-wrap h3 .icon-server-3 {
	background: url(../img/icon-server-3.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-server-3.png) 1x, url(../img/icon-server-3@2x.png) 2x);
}

.esop .esop-section3 {
	padding-top: 62px;
	padding-bottom: 62px;
	background: #f4f6f9
}

.esop .esop-check-wrap {
	padding-top: 70px;
	display: flex;
	flex-wrap: wrap
}

.esop .esop-check-item {
	box-sizing: border-box;
	width: 49%;
	padding: 51px;
	background: #fff;
	margin-bottom: 24px;
	border-radius: 4px;
        height:300px
}

.esop .esop-check-item:nth-child(odd) {
	margin-right: 24px
}

.esop .esop-check-item .icon-check {
	width: 80px;
	height: 80px
}

.esop .esop-check-item .icon-check-1 {
	background: url(../img/icon-check-1.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-check-1.png) 1x, url(../img/icon-check-1@2x.png) 2x);
        background-size: 80px 80px;
}

.esop .esop-check-item .icon-check-2 {
	background: url(../img/icon-check-2.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-check-2.png) 1x, url(../img/icon-check-2@2x.png) 2x);
        background-size: 80px 80px;
}

.esop .esop-check-item .icon-check-3 {
	background: url(../img/icon-check-3.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-check-3.png) 1x, url(../img/icon-check-3@2x.png) 2x);
        background-size: 80px 80px;
}

.esop .esop-check-item .icon-check-4 {
	background: url(../img/icon-check-4.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-check-4.png) 1x, url(../img/icon-check-4@2x.png) 2x);
        background-size: 80px 80px;
}

.esop .esop-check-item .esop-check-title {
	margin-top: 38px;
	margin-bottom: 12px;
	font-size: 16px;
	font-weight: bold;
	text-align: left;
	color: #313131
}

.esop .esop-check-item .esop-check-text {
	font-size: 14px;
	font-weight: 400;
	text-align: left;
	color: #999
}

.esop .esop-section4 {
	padding-top: 62px;
	padding-bottom: 62px
}

.esop .esop-flow-wrap {
	position: relative
}

.esop .esop-flow-wrap ul {
	margin: 0 auto;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: flex-start
}

.esop .esop-flow-wrap ul:nth-child(3) {
	flex-direction: row-reverse
}

.esop .esop-flow-bg {
	position: absolute;
	left: 110px;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	z-index: -1;
	width: 1088px;
	height: 254px;
	border: 2px solid #dcdfe6;
	border-radius: 44px
}

.esop .esop-flow-bg::before {
	content: '';
	position: absolute;
	left: -112px;
	top: -5px;
	width: 180px;
	height: 274px;
	background: #fff
}

.esop .esop-flow-item {
	max-width: 200px;
	margin: 0 20px;
	padding-top: 60px;
	width: 20%
}

.esop .esop-flow-item .icon-flow {
	width: 120px;
	height: 120px;
	margin: 0 auto
}

.esop .esop-flow-item .icon-flow-1 {
	background: url(../img/icon-flow-1.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-1.png) 1x, url(../img/icon-flow-1@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-2 {
	background: url(../img/icon-flow-2.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-2.png) 1x, url(../img/icon-flow-2@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-3 {
	background: url(../img/icon-flow-3.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-3.png) 1x, url(../img/icon-flow-3@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-4 {
	background: url(../img/icon-flow-4.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-4.png) 1x, url(../img/icon-flow-4@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-5 {
	background: url(../img/icon-flow-5.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-5.png) 1x, url(../img/icon-flow-5@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-6 {
	background: url(../img/icon-flow-6.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-6.png) 1x, url(../img/icon-flow-6@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-7 {
	background: url(../img/icon-flow-7.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-7.png) 1x, url(../img/icon-flow-7@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-8 {
	background: url(../img/icon-flow-8.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-8.png) 1x, url(../img/icon-flow-8@2x.png) 2x)
}

.esop .esop-flow-item .icon-flow-9 {
	background: url(../img/icon-flow-9.png) no-repeat;
	background-image: -webkit-image-set(url(../img/icon-flow-9.png) 1x, url(../img/icon-flow-9@2x.png) 2x)
}

.esop .esop-flow-item .esop-flow-text {
	margin-top: 20px;
	font-size: 16px;
	font-weight: 400;
	text-align: center;
	color: #333
}

.esop .esop-section5 {
	padding-top: 62px;
	padding-bottom: 50px;
	background: #f4f6f9
}

.esop .esop-it-wrap {
	padding-top: 23px;
	text-align: center
}

.esop .esop-it-wrap .esop-it-img {
	width: 700px;
	height: 500px
}

.esop .esop-section6 {
	height: 83px;
	padding-top: 58px;
	padding-bottom: 59px;
	background: url(../img/img-esop-section6.png) no-repeat center;
	background-image: -webkit-image-set(url(../img/img-esop-section6.png) 1x, url(../img/img-esop-section6@2x.png) 2x);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center
}

.esop .esop-section6 .esop-section6-title {
	font-size: 34px;
	line-height: 34px;
	color: #333
}

.esop .esop-section6 .esop-section6-text {
	font-size: 22px;
	line-height: 22px;
	color: #333
}

.esop .esop-dialog {
	position: absolute;
	display: none
}

.esop .esop-dialog .esop-mask {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.4);
	z-index: 999
}

.esop .esop-dialog .esop-dialog-content {
	position: fixed;
	left: 50%;
	top: 50%;
	z-index: 1000;
	transform: translate(-50%, -50%);
	padding: 25px 32px 32px;
	width: 336px;
	background: #fff;
	border-radius: 4px
}

.esop .esop-dialog .esop-dialog-content .dialog-header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center
}

.esop .esop-dialog .esop-dialog-content .dialog-header .dialog-title {
	font-size: 24px;
	color: #333
}

.esop .esop-dialog .esop-dialog-content .dialog-header .dialog-close {
	width: 18px;
	height: 18px;
	background: url('../img/tankuang-normal.png') no-repeat center;
	cursor: pointer
}

.esop .esop-dialog .esop-dialog-content .dialog-header .dialog-close:hover {
	background-image: url('../img/tankuang-hover.png')
}

.esop .esop-dialog .esop-dialog-content .dialog-con {
	padding-top: 12px;
	padding-bottom: 52px;
	font-size: 18px;
	color: #999
}

.esop .esop-dialog .esop-dialog-content .dialog-footer {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center
}

.esop .esop-dialog .esop-dialog-content .dialog-footer .dialog-btn {
	padding: 8px 16px;
	font-size: 16px;
	color: #fff;
	background: #c8132d;
	border-radius: 4px;
	cursor: pointer
}

@media screen and (max-width:1230px) {
	.esop .esop-check-item:nth-child(odd) {
		margin-right: 2%
	}

	.esop .esop-flow-bg {
		left: 95px
	}

	.esop .esop-flow-bg::before {
		width: 190px
	}
}

@media screen and (max-width:1200px) {
	.esop .esop-banner-1 {
		font-size: 44px
	}

	.esop .esop-banner-2 {
		font-size: 22px
	}

	.esop .esop-banner-button {
		font-size: 22px
	}

	.esop .esop-flow-bg {
		left: 80px
	}

	.esop .esop-flow-bg::before {
		width: 200px
	}
}

@media screen and (max-width:1190px) {
	.esop .esop-flow-bg {
		display: none
	}

	.esop .esop-flow-wrap ul:nth-child(3) {
		flex-direction: row
	}
}

@media screen and (max-width:1150px) {
	.esop .esop-server-wrap .esop-server-l ul li,.esop .esop-server-wrap .esop-server-r ul li {
		font-size: 15px
	}
}

@media screen and (max-width:1065px) {
	.esop .esop-server-wrap .esop-server-l ul li,.esop .esop-server-wrap .esop-server-r ul li {
		font-size: 14px
	}
}

@media screen and (max-width:992px) {
	.esop .esop-banner-1 {
		font-size: 38px
	}

	.esop .esop-banner-2 {
		font-size: 20px
	}

	.esop .esop-banner-button {
		font-size: 20px;
		line-height: 40px;
		margin-top: 30px
	}

	.esop .esop-server-wrap {
		height: auto;
		flex-direction: column
	}

	.esop .esop-server-wrap .esop-server-l,.esop .esop-server-wrap .esop-server-r {
		width: auto
	}

	.esop .esop-server-wrap .esop-server-l ul,.esop .esop-server-wrap .esop-server-r ul {
		padding-right: 0
	}

	.esop .esop-server-wrap .esop-server-l ul li,.esop .esop-server-wrap .esop-server-r ul li {
		font-size: 16px
	}

	.esop .esop-server-wrap .esop-server-r {
		padding-left: 0
	}

	.esop .esop-server-wrap .esop-server-r .esop-server-title3 {
		margin-top: 32px
	}

	.esop .esop-server-wrap .esop-server-m {
		display: none
	}

	.esop .esop-check-item .esop-check-title {
		font-size: 20px
	}

	.esop .esop-check-item .esop-check-text {
		font-size: 16px
	}

	.esop .esop-flow-item .esop-flow-text {
		font-size: 16px
	}
}

@media screen and (max-width:908px) {
	.esop .text {
		max-width: 100%;
		margin: 0 10px
	}
}

@media screen and (max-width:856px) {
	.esop .esop-flow-wrap ul {
		flex-wrap: wrap
	}

	.esop .esop-flow-item {
		width: 33%
	}
}

@media screen and (max-width:768px) {
	.esop .esop-banner-1 {
		font-size: 30px
	}

	.esop .esop-banner-2 {
		font-size: 18px
	}

	.esop .esop-banner-button {
		font-size: 18px
	}

	.esop h2 {
		font-size: 40px
	}

	.esop .text {
		font-size: 16px
	}

	.esop .esop-flow-item {
		width: 25%
	}
}

@media screen and (max-width:700px) {
	.esop .esop-check-wrap {
		margin: 0 10px
	}

	.esop .esop-check-wrap .esop-check-item {
		width: 100%
	}

	.esop .esop-check-wrap .esop-check-item:nth-child(odd) {
		margin-right: 0
	}

	.esop .esop-it-wrap {
		margin: 0 10px
	}

	.esop .esop-it-wrap .esop-it-img {
		width: 100%;
		height: auto
	}
}

@media screen and (max-width:640px) {
	.esop .esop-banner-1 {
		font-size: 26px
	}

	.esop .esop-banner-2 {
		font-size: 16px
	}

	.esop .esop-banner-button {
		font-size: 16px;
		line-height: 32px;
		margin-top: 20px
	}

	.esop h2 {
		font-size: 30px
	}

	.esop .text {
		font-size: 14px
	}

	.esop .esop-section2,.esop .esop-section3,.esop .esop-section4,.esop .esop-section5 {
		padding-top: 45px;
		padding-bottom: 32px
	}

	.esop .esop-server-wrap {
		margin-top: 48px;
		padding: 32px
	}

	.esop .esop-check-wrap {
		padding-top: 32px
	}

	.esop .esop-check-item .icon-check {
		width: 80px;
		height: 80px;
		background-size: 80px
	}

	.esop .esop-flow-item {
		padding-top: 48px;
		margin: 0 10px;
		width: 27%
	}

	.esop .esop-flow-item .icon-flow {
		width: 80px;
		height: 80px;
		background-size: 80px
	}

	.esop .esop-section6 {
		padding: 24px 0;
		justify-content: center
	}

	.esop .esop-section6 .esop-section6-title {
		font-size: 30px;
		line-height: 45px
	}

	.esop .esop-section6 .esop-section6-text {
		font-size: 18px;
		line-height: 27px
	}
}

@media screen and (max-width:560px) {
	.esop .esop-banner-1 {
		font-size: 22px
	}

	.esop .esop-banner-2 {
		font-size: 14px;
		margin-top: 0
	}

	.esop .esop-banner-button {
		font-size: 14px;
		line-height: 28px;
		margin-top: 15px;
		padding: 0 15px
	}

	.esop .text {
		font-size: 12px
	}

	.esop .esop-server-wrap h3 {
		font-size: 18px
	}

	.esop .esop-server-wrap .esop-server-l ul li,.esop .esop-server-wrap .esop-server-r ul li {
		font-size: 14px
	}

	.esop .esop-check-item .esop-check-title {
		font-size: 16px
	}

	.esop .esop-check-item .esop-check-text {
		font-size: 14px
	}

	.esop .esop-check-item {
		padding: 32px
	}

	.esop .esop-check-item .esop-check-title {
		margin-top: 24px
	}

	.esop .esop-check-item .esop-flow-text {
		font-size: 14px
	}

	.esop .esop-check-item .icon-check {
		width: 60px;
		height: 60px;
		background-size: 60px
	}

	.esop .esop-dialog .esop-dialog-content {
		padding: 24px
	}
}

@media screen and (max-width:480px) {
	.esop .esop-banner-1 {
		font-size: 16px
	}

	.esop .esop-banner-2 {
		font-size: 12px
	}

	.esop .esop-banner-button {
		font-size: 12px;
		line-height: 18px;
		margin-top: 10px;
		padding: 0 10px
	}

	.esop h2 {
		font-size: 20px
	}

	.esop .text {
		padding-top: 8px;
		font-size: 12px
	}

	.esop .esop-server-wrap {
		margin-top: 32px;
		padding: 24px 12px
	}

	.esop .esop-server-wrap h3 {
		margin-bottom: 10px;
		font-size: 14px
	}

	.esop .esop-server-wrap .esop-server-l ul li,.esop .esop-server-wrap .esop-server-r ul li {
		font-size: 12px
	}

	.esop .esop-server-wrap .esop-server-l .esop-server-title2 {
		margin-top: 24px
	}

	.esop .esop-server-wrap .esop-server-r .esop-server-title3 {
		margin-top: 24px
	}

	.esop .esop-check-wrap {
		padding-top: 24px
	}

	.esop .esop-check-item {
		padding: 24px 12px
	}

	.esop .esop-check-item .esop-check-title {
		margin-top: 12px;
		margin-bottom: 8px;
		font-size: 14px
	}

	.esop .esop-check-item .esop-check-text {
		font-size: 12px
	}

	.esop .esop-check-item .icon-check {
		width: 40px;
		height: 40px;
		background-size: 40px
	}

	.esop .esop-flow-item {
		padding-top: 24px;
		margin: 0 5px;
		width: 30%
	}

	.esop .esop-flow-item .esop-flow-text {
		font-size: 12px
	}

	.esop .esop-flow-item .icon-flow {
		width: 40px;
		height: 40px;
		background-size: 40px
	}

	.esop .esop-section6 {
		padding: 0;
		justify-content: center
	}

	.esop .esop-section6 .esop-section6-title {
		font-size: 20px;
		line-height: 20px
	}

	.esop .esop-section6 .esop-section6-text {
		font-size: 12px;
		line-height: 18px
	}

	.esop .esop-dialog .esop-dialog-content {
		width: 240px;
		padding: 16px
	}

	.esop .esop-dialog .esop-dialog-content .dialog-header .dialog-title {
		font-size: 14px
	}

	.esop .esop-dialog .esop-dialog-content .dialog-con {
		padding-top: 10px;
		padding-bottom: 20px;
		font-size: 12px
	}

	.esop .esop-dialog .esop-dialog-content .dialog-footer .dialog-btn {
		padding: 2px 8px;
		font-size: 12px
	}
}
