/* 公共样式 */
body {
	padding-top: 82px;
}

.container {
	width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

.container::before,
.container::after {
	display: table;
	content: "";
}

.container::after {
	clear: both;
}

.header {
	position: fixed;
	z-index: 199;
	left: 0;
	top: 0;
	width: 100%;
	height: 82px;
	background-color: #193458;
}

.header .logo {
	float: left;
	width: 200px;
	margin-top: 20px;
}

.nav {
	float: left;
	margin-left: 50px;
	text-align: center;
	font-size: 16px;
}

.nav li {
	float: left;
	width: 100px;
	height: 82px;
	overflow: hidden;
	line-height: 82px;
}

.nav a {
	display: block;
	position: relative;
	font-weight: bold;
	color: rgba(255, 255, 255, .6);
}

.nav a:hover,
.nav a.active {
	color: #fff;
	text-decoration: none;
}

.nav a::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 0;
	height: 2px;
	overflow: hidden;
	background-color: #fff;
	transition: all .3s;
}

.nav a:hover::after,
.nav a.active::after {
	left: 0;
	width: 100%;
}

.nav .link-product {
	cursor: default;
}

.header .hotline,
.header .btn-online-service {
	vertical-align: top;
}

.header .hotline {
	display: inline-block;
	margin-top: 26px;
	font-size: 20px;
	font-weight: bold;
	color: #fff;
}

.header .hotline .icon-phone {
	width: 22px;
	height: 21px;
	margin-top: -2px;
	margin-right: 12px;
	background-image: url(../images/icons/icon_phone_orange.png);
}

.header .btn-wrap {
	display: inline-block;
	position: relative;
	width: 110px;
	height: 36px;
	margin-top: 23px;
	margin-left: 60px;
}

.header .btn-wrap:hover figure{
	display: inline-block;
}

.header .btn-wrap figure{
	display: none;
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	margin-top: 10px;
	background-color: #fff;
	box-shadow: 0 0 4px rgba(0, 0, 0, .2);
}

.header .btn-wrap figure img{
	margin:10px;
}

.header .btn-online-service {
	width: 110px;
	height: 36px;
	border-radius: 3px;
	font-weight: bold;
	line-height: 36px;
	color: #fff;
	background-color: #ff6418;
}

.nav-dropdown {
	position: absolute;
	z-index: 199;
	left: 0;
	top: 100%;
	width: 100%;
	height: 0;
	overflow: hidden;
	background-color: rgba(47, 126, 234, .7);
	transition: all .3s ease-in-out;
}

.nav-menu {
	text-align: center;
	font-size: 16px;
}

.nav-menu li {
	display: inline-block;
	margin: 30px;
}

.nav-menu a {
	display: block;
	padding: 3px;
	color: #fff;
}

.nav-menu a:hover,
.nav-menu a:focus {
	text-decoration: none;
}

.nav-menu a span {
	float: left;
	width: 32px;
	height: 32px;
	overflow: hidden;
	padding: 1px;
	margin-right: 20px;
	border-radius: 4px;
	background: linear-gradient(315deg, #2083e8, #0068d3);
}

.nav-menu a i {
	width: 30px;
	height: 30px;
	background-position: 0 -60px;
}

.nav-menu a .icon-alumni {
	background-image: url(../images/icons/icon_alumni.png);
}

.nav-menu a .icon-alumni-directory {
	background-image: url(../images/icons/icon_alumni_directory.png);
}

.nav-menu a .icon-alumni-collect {
	background-image: url(../images/icons/icon_alumni_collect.png);
	background-position:5px 5px;
	background-size: 20px 20px;
}

.nav-menu a .icon-smile {
	background-image: url(../images/icons/icon_smile.png);
}

.nav-toggler,
.nav-drawer-wrapper {
	display: none;
}

.footer, 
.footer a {
	color: rgba(255, 255, 255, .6);
}

.footer {
	height: 248px;
	overflow: hidden;
	font-size: 12px;
	background-color: #193458;
}

.footer .logo {
	float: left;
	width: 100px;
	margin-top: 45px;
}

.co-brand,
.contact-us {
	float: left;
	width: 360px;
	margin-top: 40px;
}

.co-brand {
	margin-left: 125px;
}

.co-brand h2,
.contact-us h2 {
	font-size: 16px;
	font-weight: normal;
	color: #fff;
}

.co-brand h2 {
	margin-bottom: 27px;
}

.co-brand li,
.contact-us p {
	margin-top: 10px;
}

.contact-us h2 {
	margin-bottom: 20px;
}

.contact-us address {
	font-style: normal;
} 
.contact-us address .tel-num{
	font-size:16px;
	font-weight:600;
}
.wx-pa {
	float: right;
	margin-top: 45px;
	font-size: 16px;
	text-align: center;
}

.wx-pa img {
	width:85px;
	margin-bottom: 6px;
}

.copyright {
	margin-top: 30px;
	text-align: center;
}

.toolbar {
	position: fixed;
	z-index: 199;
	right: -40px;
	bottom: 20px;
	width: 40px;
	text-align: center;
	font-size: 12px;
	transition: right .3s;
}

.toolbar.visible {
	right: 20px;
}

.toolbar li {
	position: relative;
	min-height: 40px;
	padding: 10px;
	margin-top: 10px;
	background-color: #fff;
	box-shadow: 0 0 4px rgba(0, 0, 0, .2);
}

.toolbar li:first-child {
	margin-top: 0;
}

.toolbar .back-top {
	cursor: pointer;
}

.toolbar i {
	width: 21px;
	height: 20px;
}

.toolbar .icon-phone {
	background-image: url(../images/icons/icon_phone.png);
}

.toolbar .icon-wx {
	background-image: url(../images/icons/icon_wx.png);
}

.toolbar .icon-apply {
	background-image: url(../images/icons/icon_apply.png);
}

.toolbar .icon-top {
	background-image: url(../images/icons/icon_top.png);
}

.toolbar .v ,
.apply-box .v{
	display: inline-block;
	color: rgba(0, 0, 0, .5);
}

.toolbar figure,
.apply-box figure{
	display: none;
	position: absolute;
	top: 0;
	right: 100%;
	margin-right: 10px;
	background-color: #fff;
	box-shadow: 0 0 4px rgba(0, 0, 0, .2);
}

.toolbar .v2,
.apply-box .v2{
	padding: 5px 15px;
	font-size: 16px;
	font-weight: bold;
	line-height: 30px;
	white-space: nowrap;
}

.toolbar li:hover figure,
.apply-wrap:hover figure{
	display: block;
}

.toolbar figure img,
.apply-box figure img,
.btn-wrap figure img {
	width: 120px;
	margin-bottom:5px;
}

.apply-wrap{
	position: relative;
	float: right;
}

.apply-box{
	position:absolute;
	top:50%;
	right:100%;
	transform: translateX('-50%');
	text-align:center;
}
/* 页面样式 */

/* 首页样式 */
.banner-swiper .swiper-slide .swiper-slide-content {
	opacity: 0;
	transform: translateY(30px);
}

.banner-swiper .swiper-slide-active .swiper-slide-content {
	animation: .6s ease-in-out forwards slideIn;
}

@keyframes slideIn {
	from {
		opacity: 0;
		transform: translateY(30px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.banner-swiper .swiper-pagination-bullets {
	bottom: 70px;
	height: 3px;
}

.banner-swiper .swiper-pagination-bullet {
	width: 50px;
	height: 100%;
	margin-left: 5px !important;
	margin-right: 5px !important;
	border-radius: 0;
	opacity: 1;
	background-color: rgba(0, 123, 234, .2);
	vertical-align: top;
}

.banner-swiper .swiper-pagination-bullet::after {
	content: "";
	display: block;
	width: 0;
	height: 100%;
	background-color: #007bea;
}

.banner-swiper .swiper-pagination-bullet-active::after {
	animation: 3s ease-in-out forwards bulletProgress;
}

@keyframes bulletProgress {
	from {
		width: 0;
	}

	to {
		width: 100%;
	}
}

.index-banner {
	height: 550px;
	overflow: hidden;
}

.index-banner .banner-content {
	margin-top: 235px;
}

.index-banner h2 {
	font-size: 40px;
	color: #007bea;
}

.index-banner p {
	margin-top: 35px;
	font-size: 20px;
	color: rgba(0, 0, 0, .6);
}

.index-section {
	font-size: 16px;
}

.index-section .section-title {
	margin-top: 60px;
	text-align: center;
	font-size: 30px;
	color: #007bea;
}

.index-section .section-desc {
	margin-top: 15px;
	text-align: center;
	color: rgba(0, 0, 0, .5);
}

.estate-new-ecology {
	min-height: 700px;
	padding-bottom:45px;
	background: url(../images/bgs/bg_estate_new_ecology.jpg) repeat center;
}

.estate-new-ecology .ecology-intro {
	min-height: 350px;
	padding-left: 680px;
	margin-top: 65px;
	background-repeat: no-repeat;
	background-position: left 10px;
}

.estate-new-ecology .ecology-intro.ecology-intro-left{
	padding-left:0;
	padding-right:680px;
	background-position: right 10px;	
}

.estate-new-ecology .ecology-intro.ecology-intro-alumni{
	background-image: url(../images/products/alumni.png);
}

.estate-new-ecology .ecology-intro.ecology-intro-contacts{
	background-image: url(../images/products/contacts.png);
}

.estate-new-ecology .ecology-intro.ecology-intro-info{
	background-image: url(../images/products/info.png);
}

.estate-new-ecology .ecology-intro.ecology-intro-smile{
	background-image: url(../images/products/smile.png);
}

.estate-new-ecology .mask{
	display: none;
}

.estate-new-ecology .ecology-intro p {
	line-height: 36px;
	text-align:justify;
}

.estate-new-ecology .btn-more {
	width: 120px;
	height: 40px;
	margin-top: 40px;
	border-radius: 3px;
	line-height: 40px;
	color: #fff;
	background-color: #007bea;
}

.estate-new-ecology .btn-more .icon-arrow {
	width: 7px;
	height: 13px;
	margin-left: 10px;
	background-image: url(../images/icons/icon_arrow_right_white.png);
	transition: margin-left .3s;
}

.estate-new-ecology .btn-more:hover .icon-arrow {
	margin-left: 16px;
}

.grayscale { 
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);    
    filter: grayscale(100%);	
    filter: gray;
}

.marketing-scene {
	height: 1000px;
	overflow: hidden;
}

.scene_mask{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.4);
}
.marketing-apps {
	overflow: hidden;
	margin-top: 20px;
	border-bottom: 1px solid #b5b5b5;
	text-align: center;
}

.marketing-apps li {
	position: relative;
	float: left;
	width: 320px;
	height: 150px;
	overflow: hidden;
	margin-left: 40px;
	margin-right: 40px;
	cursor: pointer;
}

.marketing-apps li::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 0;
	height: 0;
	overflow: hidden;
	background-color: #007bea;
	transition: all .3s ease-in-out;
}

.marketing-apps li.active {
	color: #007bea;
}

.marketing-apps li.active::after {
	left: 0;
	width: 100%;
	height: 4px;
}

.marketing-apps .icon-box {
	display: block;
	width: 110px;
	height: 110px;
	padding: 20px;
	margin-left: auto;
	margin-right: auto;
	background: url(../images/bgs/bg_scene_type.png) no-repeat center bottom;
}

.marketing-apps .icon-box i {
	width: 70px;
	height: 70px;
}

.marketing-apps li.active i {
	background-position: 0 -70px;
}

.marketing-apps .icon-alumni {
	background-image: url(../images/icons/icon_alumni_70.png);
}

.marketing-apps .icon-alumni-directory {
	background-image: url(../images/icons/icon_alumni_directory_70.png);
}

.marketing-apps .icon-smile {
	background-image: url(../images/icons/icon_smile_70.png);
}

.marketing-apps .scene-type {
	display: block;
	margin-top: 5px;
}

.marketing-app-scene {
	display: none;
	padding-top: 40px;
}

.marketing-app-scene.active {
	display: block;
}

.marketing-app-scene .type {
	margin-top: -18px;
	margin-bottom: -18px;
	text-align: center;
	font-size: 18px;
	line-height: 2;
	color: rgba(0, 0, 0, .6);
}

.marketing-scene-list {
	overflow: hidden;
}

.marketing-scene-list li,
.marketing-scene-list figure img {
	width: 332px;
	height: 229px;
}

.marketing-scene-list li {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 40px 34px;
}

.marketing-scene-list figure {
	position: relative;
}

.marketing-scene-list figure figcaption {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 20px 5px;
	text-align: center;
	font-size: 14px;
	color: #fff;
}

.marketing-scene-list figure figcaption em {
	display: block;
	margin-bottom: 5px;
	font-size: 16px;
	font-style: normal;
}

.digital-marketing {
	position: relative;
	height: 935px;
	background: url(../images/bgs/bg_digital_marketing.jpg) no-repeat center;
}

.digital-marketing-solutions {
	position: absolute;
	z-index: 19;
	left: 50%;
	top: 250px;
	margin-left: -623px;
	width: 383px;
	height: 517px;
	padding-top: 23px;
	padding-left: 23px;
	font-size: 14px;
	background-color: #dcefff;
}

.digital-marketing-solutions li {
	position: relative;
	width: 410px;
	height: 133px;
	overflow: hidden;
	margin-top: 16px;
	border-radius: 4px;
	background-color: #fff;
	cursor: pointer;
	box-shadow: 0 0 4px rgba(32, 32, 32, .16);
}

.digital-marketing-solutions li a{
	display: inline-block;
	width: 410px;
	height: 133px;	
	padding-left: 83px;
	padding-top: 18px;
	color:inherit;
	text-decoration: none;
}

.digital-marketing-solutions li:hover,
.digital-marketing-solutions li.active {
	color: #fff;
	background: url(../images/bgs/bg_digital_marketing_solution.png) repeat-y;
}

.digital-marketing-solutions .icon-box {
	position: absolute;
	left: 20px;
	top: 20px;
	width: 40px;
	height: 40px;
	padding: 5px;
	border-radius: 5px;
	background: linear-gradient(315deg, #377bff, #5eaaff);
}

.digital-marketing-solutions .icon-box i {
	width: 30px;
	height: 30px;
}

.digital-marketing-solutions .icon-alumni,
.marketing-cases .case-type .icon-alumni {
	background-image: url(../images/icons/icon_alumni.png);
}

.digital-marketing-solutions .icon-alumni-directory,
.marketing-cases .case-type .icon-alumni-directory {
	background-image: url(../images/icons/icon_alumni_directory.png);
}

.digital-marketing-solutions .icon-box .icon-alumni-collect,
.marketing-cases .case-type .icon-box .icon-alumni-collect {
	width: 40px;
	height: 40px;
	margin-left:-5px;
	margin-top:-5px;
	background-image: url(../images/icons/icon_alumni_collect2.png);
	background-position: 0 0;
}

.digital-marketing-solutions .icon-smile,
.marketing-cases .case-type .icon-smile {
	background-image: url(../images/icons/icon_smile.png);
}

.digital-marketing-solutions li:hover .icon-box,
.digital-marketing-solutions li.active .icon-box {
	background: #fff;
}

.digital-marketing-solutions li:hover .icon-box i,
.digital-marketing-solutions li.active .icon-box i {
	background-position: 0 -30px;
}

.digital-marketing-solutions li:hover .icon-box .icon-alumni-collect,
.digital-marketing-solutions li.active .icon-box .icon-alumni-collect {
	background-image: url(../images/icons/icon_alumni_collect3.png);
	background-position: 0 0;
}

.digital-marketing-solutions .solution-type {
	font-size: 18px;
	font-weight: normal;
}

.digital-marketing-solutions .solution-line {
	display: block;
	width: 23px;
	height: 2px;
	overflow: hidden;
	margin-top: 10px;
	background-color: #2d7eea;
}

.digital-marketing-solutions li:hover .solution-line,
.digital-marketing-solutions li.active .solution-line {
	background-color: #fff;
}

.digital-marketing-solutions .solution-name {
	margin-top: 12px;
	font-size: 14px;
	font-weight: normal;
}

.digital-marketing-solutions .solution-desc {
	margin-top: 3px;
	font-size: 12px;
	color: rgba(0, 0, 0, .5);
}

.digital-marketing-solutions li:hover .solution-desc,
.digital-marketing-solutions li.active .solution-desc {
	color: rgba(255, 255, 255, .9);
}

.digital-marketing-previews {
	position: absolute;
	z-index: 9;
	left: 50%;
	bottom: 0;
	margin-left: -600px;
}

.digital-marketing-previews li {
	display: none;
}

.digital-marketing-previews li.active {
	display: block;
}

.digital-marketing-statistics {
	height: 325px;
	overflow: hidden;
	color: #fff;
	background: url(../images/bgs/bg_digital_marketing_statistics.jpg) no-repeat center;
}

.digital-marketing-statistics .large-text {
	margin-top: 130px;
	font-size: 28px;
}

.digital-marketing-statistics p {
	margin-top: 9px;
}

.digital-marketing-statistics ul {
	float: right;
	margin-top: 100px;
	text-align: center;
}

.digital-marketing-statistics li {
	float: left;
	width: 200px;
	overflow: hidden;
}

.digital-marketing-statistics em {
	display: block;
	font-size: 36px;
	font-style: normal;
}

.digital-marketing-statistics strong {
	font-family: Arial;
	font-size: 60px;
	font-weight: normal;
}

.digital-marketing-statistics span {
	margin-top: 5px;
	font-size: 14px;
}

.cooperative-brand {
	height: 800px;
	overflow: hidden;
	background: url(../images/bgs/bg_cooperative_brand.jpg) no-repeat center top;
}

.cooperative-brand ul {
	margin-left: -12px;
	margin-right: -12px;
	margin-top: 65px;
}

.cooperative-brand li {
	float: left;
	width: 282px;
	height: 102px;
	margin: 12px;
	border: 1px solid #f2f3f5;
	box-shadow: 0 0 4px rgba(32, 32, 32, .05);
}

.featured-cases {
	height: 830px;
	overflow: hidden;
}

.marketing-cases-wrapper {
	overflow: hidden;
	margin-top: 40px;
	margin-left: -11.25px;
	margin-right: -11.25px;
}

.marketing-cases {
	overflow: hidden;
}

.marketing-cases li {
	position: relative;
	float: left;
	width: 385px;
	height: 480px;
	overflow: hidden;
	margin: 11.25px;
	box-shadow: 0 0 6px rgba(132, 155, 180, .2);
}

.marketing-cases .case-pic {
	height: 315px;
	overflow: hidden;
}

.marketing-cases .case-info {
	padding: 25px 30px 10px;
}

.marketing-cases .case-type {
	height: 30px;
	overflow: hidden;
	line-height: 30px;
	font-size: 18px;
	font-weight: bold;
}

.marketing-cases .case-type i {
	width: 30px;
	height: 30px;
	margin-right: 12px;
	background-position: 0 -30px;
}

.marketing-cases .case-line {
	display: block;
	width: 30px;
	height: 3px;
	overflow: hidden;
}

.marketing-cases .case-info .case-line {
	margin-top: 16px;
	background-color: #9ec5f9;
}

.marketing-cases .case-title {
	font-size: 18px;
}

.marketing-cases .case-info .case-title {
	margin-top: 16px;
}

.marketing-cases .case-desc {
	margin-top: 4px;
	font-size: 14px;
	color: #676767;
}

.marketing-cases .case-details {
	position: absolute;
	left: 0;
	top: 100%;
	width: 100%;
	height: 100%;
	padding: 35px 30px 30px;
	overflow: hidden;
	opacity: 0;
	background-color: #fff;
	transition: all .5s ease-in-out;
}

.marketing-cases li:hover .case-details {
	top: 0;
	opacity: 1;
}

.marketing-cases .case-details .case-title {
	color: #007bea;
}

.marketing-cases .case-details .case-line {
	margin-top: 20px;
	background-color: #007bea;
}

.marketing-cases .case-lead {
	margin-top: 15px;
	font-weight: bold;
}

.marketing-cases .case-intro {
	margin-top: 8px;
	line-height: 24px;
	color: #8d8d8d;
}

.marketing-cases .case-details .case-type {
	position: absolute;
	left: 30px;
	bottom: 50px;
}

.featured-cases .link-more {
	display: inline-block;
	margin-top: 60px;
	font-size: 16px;
	color: rgba(0, 0, 0, .6);
}

.featured-cases .link-more .icon-arrow,
.marketing-apply .btn-apply .icon-arrow,
.cooperation-apply .btn-apply .icon-arrow {
	width: 9px;
	height: 15px;
	margin-left: 10px;
	transition: margin-left .3s;
}

.featured-cases .link-more:hover .icon-arrow,
.marketing-apply .btn-apply:hover .icon-arrow,
.cooperation-apply .btn-apply:hover .icon-arrow {
	margin-left: 16px;
}

.featured-cases .link-more .icon-arrow {
	background-image: url(../images/icons/icon_arrow_right_grey.png);
}

.marketing-apply {
	height: 320px;
	overflow: hidden;
	text-align: center;
	font-size: 16px;
	color: #fff;
	background: url(../images/bgs/bg_marketing_apply.jpg) no-repeat center;
}

.marketing-apply .apply-poster,
.cooperation-apply .apply-poster {
	font-size: 28px;
	font-weight: bold;
}

.marketing-apply .apply-poster {
	margin-top: 80px;
	margin-bottom: 15px;
}

.marketing-apply .btn-apply,
.cooperation-apply .btn-apply {
	width: 120px;
	height: 40px;
	border-radius: 3px;
	line-height: 40px;
	color: #007bea;
	background-color: #fff;
}

.marketing-apply .btn-apply {
	margin-top: 55px;
}

.marketing-apply .btn-apply .icon-arrow,
.cooperation-apply .btn-apply .icon-arrow {
	background-image: url(../images/icons/icon_arrow_right.png);
}

.cooperation-plan {
	height: 925px;
}

.cooperation-support {
	overflow: hidden;
	margin-top: 60px;
	margin-left: -15px;
	margin-right: -15px;
}

.cooperation-support h3,
.purchase-process h3 {
	margin-bottom: 20px;
	text-align: center;
	font-size: 18px;
	font-weight: normal;
}

.cooperation-support dl {
	position: relative;
	float: left;
	width: 277.5px;
	height: 150px;
	overflow: hidden;
	padding: 30px;
	margin: 15px;
	border-radius: 5px;
}

.cooperation-support dl::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	width: 120px;
	height: 120px;
	background-repeat: no-repeat;
	background-position: right bottom;
}

.cooperation-support dt,
.cooperation-support dd {
	position: relative;
	z-index: 9;
}

.cooperation-support dt {
	margin-bottom: 5px;
}

.cooperation-support dd {
	font-size: 14px;
	line-height: 24px;
}

.cooperation-support .professional-training,
.cooperation-support .material-support {
	background: linear-gradient(#68c0de, #b1e3f8);
}

.cooperation-support .professional-training::after {
	background-image: url(../images/bgs/bg_professional_training.png);
}

.cooperation-support .sales-support,
.cooperation-support .technical-strength,
.cooperation-support .marketing-activity,
.cooperation-support .marketing-assistance {
	background: linear-gradient(#4f8bf8, #8dbdff);
}

.cooperation-support .sales-support::after {
	background-image: url(../images/bgs/bg_sales_support.png);
}

.cooperation-support .technical-strength::after {
	background-image: url(../images/bgs/bg_technical_strength.png);
}

.cooperation-support .sales-help,
.cooperation-support .regional-training {
	background: linear-gradient(#60b3f4, #acdaff);
}

.cooperation-support .sales-help::after {
	background-image: url(../images/bgs/bg_sales_help.png);
}

.cooperation-support .regional-training::after {
	background-image: url(../images/bgs/bg_regional_training.png);
}

.cooperation-support .marketing-activity::after {
	background-image: url(../images/bgs/bg_marketing_activity.png);
}

.cooperation-support .marketing-assistance::after {
	background-image: url(../images/bgs/bg_marketing_assistance.png);
}

.cooperation-support .material-support::after {
	background-image: url(../images/bgs/bg_material_support.png);
}

.purchase-process {
	margin-top: 40px;
	text-align: center;
}

.purchase-process ol {
	display: inline-block;
	overflow: hidden;
}

.purchase-process li {
	position: relative;
	float: left;
	width: 230px;
}

.purchase-process li::after {
	content: "";
	position: absolute;
	top: 29px;
	right: 50%;
	width: 100%;
	height: 2px;
	background-color: #eef5ff;
}

.purchase-process li:first-child::after {
	display: none;
}

.purchase-process .icon-box {
	position: relative;
	z-index: 9;
	display: block;
	width: 60px;
	height: 60px;
	padding: 10px;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	border-radius: 50%;
	text-align: center;
	background: linear-gradient(#f4f9ff, #d1e6ff);
}

.purchase-process .icon-box i {
	width: 40px;
	height: 40px;
}

.purchase-process .icon-buy {
	background-image: url(../images/icons/icon_buy.png);
}

.purchase-process .icon-shopping-cart {
	background-image: url(../images/icons/icon_shopping_cart.png);
}

.purchase-process .icon-order {
	background-image: url(../images/icons/icon_order.png);
}

.purchase-process .icon-download {
	background-image: url(../images/icons/icon_download.png);
}

.purchase-process .process-name {
	display: block;
	margin-top: 16px;
	color: rgba(0, 0, 0, .6);
}

.cooperation-apply {
	height: 323px;
	overflow: hidden;
	font-size: 16px;
	color: #fff;
	background: url(../images/bgs/bg_cooperation_apply.jpg) no-repeat center;
}

.cooperation-apply .btn-apply {
	float: right;
	margin-top: 141px;
}

.cooperation-apply .apply-poster {
	margin-top: 115px;
	margin-bottom: 24px;
}

.cooperation-apply .hotline {
	margin-left: 95px;
}

/* 产品页样式 */
.product-banner {
	height: 570px;
	overflow: hidden;
}

.alumni-banner{
	background: url(../images/banners/banner_alumni.jpg) no-repeat center;
}

.contacts-banner{
	background: url(../images/banners/banner_contacts.png) no-repeat center;
}

.info-banner{
	background: url(../images/banners/banner_info.png) no-repeat center;
}

.smile-banner{
	background: url(../images/banners/banner_smile.png) no-repeat center;
}

.product-banner .banner-content {
	margin-top: 195px;
	opacity: 0;
	transform: translateY(30px);
	animation: .6s ease-in-out .3s forwards slideIn;
}

.product-banner h2 {
	font-size: 40px;
	color: #007bea;
}

.product-banner p {
	margin-top: 45px;
	font-size: 18px;
	line-height: 2;
	color: rgba(0, 0, 0, .6);
}

.product-banner .banner-btn{
	margin-top: 40px;
}

.product-banner .btn-more {
	width: 120px;
	height: 40px;	
	border-radius: 3px;
	line-height: 40px;
	color: #fff;
	background-color: #007bea;
}

.product-banner .btn-more .icon-arrow {
	width: 7px;
	height: 13px;
	margin-left: 10px;
	background-image: url(../images/icons/icon_arrow_right_white.png);
	transition: margin-left .3s;
}

.product-banner .btn-more:hover .icon-arrow {
	margin-left: 16px;
}

.product-section .section-title {
	margin-top: 60px;
	text-align: center;
	font-size: 30px;
	color: #007bea;
}

.traditional-solutions,
.digital-solutions {
	background-color: #f6fbff;
}

.traditional-marketing-disadvantages {
	margin-top: 20px;
}

.digital-marketing-solution,
.digital-marketing-solution dl {
	height: 430px;
	overflow: hidden;
}

.digital-marketing-solution {
	background-repeat: no-repeat;
	background-position: center;
}

.digital-marketing-solution dl {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 485px;
}

.digital-marketing-solution dt {
	margin-top: 35px;
	margin-bottom: 15px;
	font-size: 20px;
	font-weight: bold;
}

.digital-marketing-solution dt:first-child {
	margin-top: 0;
}

.digital-marketing-solution dd {
	font-size: 16px;
	color: rgba(0, 0, 0, .6);
}

.alumni-solution1 {
	margin-top: 65px;
	background-image: url(../images/bgs/bg_alumni_solution1.jpg);
}

.alumni-solution2 {
	background-image: url(../images/bgs/bg_alumni_solution2.jpg);
}

.alumni-solution3 {
	background-image: url(../images/bgs/bg_alumni_solution3.jpg);
}

.contacts-solution1 {
	margin-top: 65px;
	background-image: url(../images/bgs/bg_contacts_solution1.png);
}

.contacts-solution2 {
	background-image: url(../images/bgs/bg_contacts_solution2.png);
}

.contacts-solution3 {
	background-image: url(../images/bgs/bg_contacts_solution3.png);
}

.info-solution1 {
	margin-top: 65px;
	background-image: url(../images/bgs/bg_info_solution1.png);
}

.info-solution2 {
	background-image: url(../images/bgs/bg_info_solution2.png);
}

.info-solution3 {
	background-image: url(../images/bgs/bg_info_solution3.png);
}

.smile-solution1 {
	margin-top: 65px;
	background-image: url(../images/bgs/bg_smile_solution1.png);
}

.smile-solution2 {
	background-image: url(../images/bgs/bg_smile_solution2.png);
}

.smile-solution3 {
	background-image: url(../images/bgs/bg_smile_solution3.png);
}

.digital-marketing-solution1 dl,
.digital-marketing-solution3 dl {
	float: right;
}


.digital-marketing-solution2 dt {
	color: #fff;
}

.digital-marketing-solution2 dd {
	color: rgba(255, 255, 255, .6);
}

.digital-marketing-solution2.contacts-solution2 dt,
.digital-marketing-solution2.info-solution2 dt{
	color: rgba(0, 0, 0, 1);
}

.digital-marketing-solution2.contacts-solution2 dd,
.digital-marketing-solution2.info-solution2 dd {
	color: rgba(0, 0, 0, .6);
}

.digital-marketing-guarantee {
	height: 500px;
	overflow: hidden;
	color: #fff;
	background: url(../images/bgs/bg_digital_marketing_guarantee.jpg) no-repeat center;
}

.digital-marketing-guarantee h4,
.digital-marketing-guarantee p {
	text-align: center;
}

.digital-marketing-guarantee h4 {
	margin-top: 55px;
	font-size: 28px;
}

.digital-marketing-guarantee p {
	margin-top: 15px;
	margin-bottom: 65px;
}

.digital-marketing-advantage,
.digital-marketing-process {
	overflow: hidden;
	text-align: center;
}

.digital-marketing-advantage dt,
.digital-marketing-advantage dd {
	float: left;
	height: 76px;
	overflow: hidden;
}

.digital-marketing-advantage dt {
	width: 100px;
	padding: 14px;
	font-size: 18px;
	line-height: 24px;
}

.digital-marketing-advantage dd,
.digital-marketing-process li {
	width: 200px;
	margin-left: 36px;
	margin-right: 36px;
}

.digital-marketing-advantage dd {
	padding: 12px;
	border-radius: 5px;
	line-height: 26px;
	background-color: rgba(255, 255, 255, .2);
}

.digital-marketing-process {
	margin-top: 30px;
	margin-bottom: 25px;
	margin-left: 100px;
	background: url(../images/bgs/bg_process_line.png) no-repeat center 105px;
}

.digital-marketing-process li {
	float: left;
	height: 150px;
	overflow: hidden;
}

.digital-marketing-process span {
	display: block;
}

.digital-marketing-process .process-name,
.digital-marketing-process .process-dot {
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
}

.digital-marketing-process .process-name {
	width: 82px;
	height: 94px;
	padding-top: 17px;
	font-size: 18px;
	line-height: 24px;
	background: url(../images/bgs/bg_process_step.png) no-repeat;
}

.digital-marketing-process .process-dot {
	width: 10px;
	height: 10px;
	margin-top: 7px;
	border: 2px solid rgba(255, 255, 255, .3);
	border-radius: 50%;
	background-color: #fff;
	background-clip: padding-box;
}

.digital-marketing-process .process-no {
	text-align: center;
	font-size: 26px;
}

.special-advantages {
	height: 850px;
	overflow: hidden;
	padding-top: 25px;
	padding-bottom: 25px;
	background-color: #f9f8fa;
}

.marketing-comparison {
	margin-top: 50px;
	text-align: center;
	font-size: 18px;
}

.marketing-comparison li {
	margin-bottom: 30px;
}

.marketing-comparison li:first-child {
	font-size: 24px;
}

.marketing-comparison .comparison-old,
.marketing-comparison .comparison-new,
.marketing-comparison .comparison-type {
	display: inline-block;
	height: 50px;
	overflow: hidden;
	padding: 5px;
	border-radius: 25px;
	line-height: 40px;
	vertical-align: top;
}

.marketing-comparison li:first-child .comparison-old,
.marketing-comparison li:first-child .comparison-new {
	width: 295px;
}

.marketing-comparison li:first-child .comparison-old {
	padding-right: 70px;
	margin-right: -50px;
}

.marketing-comparison li:first-child .comparison-new {
	padding-left: 70px;
	margin-left: -50px;
}

.marketing-comparison li:first-child .comparison-type {
	position: relative;
	margin-left: 0;
	margin-right: 0;
}

.marketing-comparison .comparison-old,
.marketing-comparison .comparison-new {
	width: 485px;
}

.marketing-comparison .comparison-old {
	text-align: right;
	color: #909090;
	background-color: rgba(188, 188, 188, .2);
}

.marketing-comparison .comparison-new {
	text-align: left;
	color: #ff6712;
	background-color: #f9ede8;
}

.marketing-comparison .comparison-old .icon-sad,
.marketing-comparison .comparison-new .icon-smile {
	width: 40px;
	height: 40px;
}

.marketing-comparison .comparison-old .icon-sad {
	float: right;
	margin-left: 12px;
	background: url(../images/icons/icon_sad.png) no-repeat;
}

.marketing-comparison .comparison-new .icon-smile {
	float: left;
	margin-right: 12px;
	background: url(../images/icons/icon_smile_orange.png) no-repeat;
}

.marketing-comparison .comparison-type {
	width: 100px;
	margin-left: 16px;
	margin-right: 16px;
	text-align: center;
	color: #fff;
	background: linear-gradient(315deg, #377bff, #5eaaff);
}

.appointment-experience {
	background-image: url(../images/bgs/bg_appointment_experience.jpg);
}

/* 精选案例页样式 */
.featured-cases-adaptation {
	height: auto;
	padding-bottom: 60px;
}

.featured-cases-adaptation h2 {
	color: #000 !important;
}

.marketing-apply1 {
	background-image: url(../images/bgs/bg_marketing_apply1.jpg);
}

/* 关于我们页样式 */
.aboutus-banner {
	height: 550px;
	overflow: hidden;
	background: url(../images/banners/aboutus_banner.jpg) no-repeat center;
}

.aboutus-banner h2 {
	margin-top: 325px;
	font-size: 40px;
}

.aboutus-banner p {
	margin-top: 45px;
	font-size: 18px;
	line-height: 2;
}

.develop-brand,
.develop-brand .content {
	height: 510px;
	overflow: hidden;
}

.develop-brand {
	background: url(../images/bgs/bg_develop_brand.jpg) no-repeat center;
}

.develop-brand .content,
.develop-ecology .content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 480px;
}

.develop-brand h3,
.develop-ecology h3,
.technical-support h3 {
	margin-bottom: -15px;
	font-size: 20px;
}

.develop-brand p,
.develop-ecology p,
.technical-support p {
	margin-top: 30px;
	font-size: 16px;
	line-height: 30px;
}

.develop-ecology,
.develop-ecology .content {
	height: 560px;
	overflow: hidden;
}

.develop-ecology {
	background: url(../images/bgs/bg_develop_ecology.jpg) no-repeat center;
}

.develop-ecology .content {
	float: right;
}

.technical-support {
	height: 588px;
	overflow: hidden;
	/* background-color: #f1f8fe; */
	background: linear-gradient(0deg, #f1f8fe, #e6f2fd);
}

.technical-support .content {
	display: inline-block;
	width: 460px;
	margin-top: 100px;
}

.patent-certificate {
	float: right;
	margin-top: 90px;
}

.patent-certificate img{
	width:450px;
}

.technical-services {
	overflow: hidden;
	margin-top: 100px;
	margin-left: -20px;
	margin-right: -20px;
	text-align: center;
}

.technical-services li {
	float: left;
	width: 270px;
	height: 148px;
	overflow: hidden;
	margin-left: 20px;
	margin-right: 20px;
	border: 1px solid #fff;
	border-radius: 3px;
	background-color: #f6faff;
}

.technical-services i {
	display: block;
	width: 64px;
	height: 64px;
	margin: 12px auto 10px;
}

.technical-services .icon-patent {
	background-image: url(../images/icons/icon_patent.png);
}

.technical-services .icon-security {
	background-image: url(../images/icons/icon_security.png);
}

.technical-services .icon-serv {
	background-image: url(../images/icons/icon_serv.png);
}

.technical-services .icon-defense {
	background-image: url(../images/icons/icon_defense.png);
}

.technical-services em,
.technical-services span {
	display: block;
}

.technical-services em {
	font-style: normal;
	font-weight: bold;
}

.technical-services span {
	margin-top: 5px;
	font-size: 12px;
	color: rgba(0, 0, 0, .6);
}
/* 校庆微笑接力推广页面图片 */

.smile-wrap .section3 {
    width: 100%;
    height: 4330px;
    background: url(../images/products/section3.jpg) no-repeat center center;
    background-size: cover;
}