.banner{
	padding-top: 64px;
	width: 100%;
	height: auto;
	overflow: hidden;
}
.banner img{
	width: 100%;
}
.productItem{
	width: 1170px;
	margin: 0 auto;
	height: auto;
	overflow: hidden;
}
.productItem .content,.productItem .productPic{
	width:  585px;
	height: 700px;
	padding: 50px 0;
	float: left;
}
.productItem .content{
	padding: 78px 0;
}
.productItem .content .title-product{
	font-size: 24px;
	width: auto;
	position: relative;
	padding-bottom: 24px;
	display: inline-block;
	margin-bottom: 24px;
}
.productItem .content .title-product span{
	box-sizing: border-box;
	padding-left: 16px;
	border-left: 4px solid #4285ee;
	color: #4285ee;
}
.productItem .content .title-product .shadow{
	display: inline-block;
	width: 100%;
	height: 6px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(../img/shadow@2x.png) repeat-y;
	padding: 0;
	border: 0;
}
.productItem .title-product-memo{
	color: #666666;
	font-size: 14px;
	margin-bottom: 42px;
}
.productItem .iconBox{
	height: auto;
	overflow: hidden;
}
.productItem .iconBox .icon{
	width: 100px;
	height: 100px;
	float: left;
}
.fisrt .iconBox .icon:nth-child(1) {
	background: url(../img/icon1@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(1):hover,.fisrt .iconBox .icon:nth-child(1).active{
	background: url(../img/icon1_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(2) {
	background: url(../img/icon2@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(2):hover,.fisrt .iconBox .icon:nth-child(2).active{
	background: url(../img/icon2_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(3) {
	background: url(../img/icon3@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(3):hover,.fisrt .iconBox .icon:nth-child(3).active{
	background: url(../img/icon3_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(4) {
	background: url(../img/icon4@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(4):hover,.fisrt .iconBox .icon:nth-child(4).active{
	background: url(../img/icon4_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.fisrt .iconBox .icon:nth-child(5) {
	background: url(../img/icon5@2x.png) no-repeat center left;
	background-size: 72px 100px;
}

.fisrt .iconBox .icon:nth-child(5):hover,.fisrt .iconBox .icon:nth-child(5).active{
	background: url(../img/icon5_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.productItem .hr{
	width:  500px;
	margin: 46px 0;
	position: relative;
	height: 7px;
	padding: 3px 0;
	box-sizing: border-box;
}
.productItem .hr .circle{
	width: 8px;
	height: 8px;
	background: #4285ee;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 6;
}
.productItem .hr .horizontal{
	height: 2px;
	width: 100%;
	background: #dcdcdc;
	display: inline-block;
	position: absolute;
	top: 50%;
	margin-top: -1px;
}
.productItem .iconMemo{
	width: 500px;
	height: auto;
	overflow: hidden;
	background: url(../img/iconMemoRight@2x.png) no-repeat center right;
	background-size: 18px 100%;
	box-sizing: border-box;
	padding-right: 18px;
}
.productItem .iconMemo p{
	width: 100%;
	height: auto;
	padding: 18px 0;
	padding-left: 16px;
	background: #eff6ff;
	display: none;
}
.productPic{
	height: 100%;
	box-sizing: border-box;
	padding: 24px 0;
	background: url(../img/elements@2x.png) no-repeat top 50px center;
	background-size: 375px 600px;
	position: relative;
}
.productPic .phone{
	width: 260px;
	height: 446px;
	position: absolute;
	overflow: hidden;
	top: 126px;
	left: 50%;
	margin-left: -144px;
	-webkit-transition: all .3s;
    transition: all .3s;
}

.productPic .phone img{
	width: 100%;
	height: 100%;
	display: none;
}
.productPic .phone .active{
	display: block;
}

/*===========微信===========*/
.itemBox{
	width: 100%;
	height: auto;
	overflow: hidden;
	background: #eff6ff;
}
.second .productPic{
	width: 420px;
	background:url(../img/elements@2x.png) no-repeat top 50px left;
    background-size: 368px 600px;
}
.second .productPic .phone{
	left: 40px;
	margin-left: 0;
}
.second .iconMemo{
	padding-left: 18px;
	padding-right: 0;
	background: url(../img/iconMemoLeft@2x.png) no-repeat center left;
	background-size: 18px 100%;
}
.second .iconMemo p{
	background: #e7f0ff;
}
.second .iconBox .icon:nth-child(1) {
	background: url(../img/icon6@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(1):hover,.second .iconBox .icon:nth-child(1).active{
	background: url(../img/icon6_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(2) {
	background: url(../img/icon7@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(2):hover,.second .iconBox .icon:nth-child(2).active{
	background: url(../img/icon7_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(3) {
	background: url(../img/icon8@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(3):hover,.second .iconBox .icon:nth-child(3).active{
	background: url(../img/icon8_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(4) {
	background: url(../img/icon9@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(4):hover,.second .iconBox .icon:nth-child(4).active{
	background: url(../img/icon9_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.second .iconBox .icon:nth-child(5) {
	background: url(../img/icon5@2x.png) no-repeat center left;
	background-size: 72px 100px;
}

.second .iconBox .icon:nth-child(5):hover,.second .iconBox .icon:nth-child(5).active{
	background: url(../img/icon5_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
/*=====好店长管理软件PC端=====*/
.thrid .iconBox {
	width: 420px;
}
.thrid .iconBox .icon{
	margin-bottom: 16px;
}
.thrid .content {
	position: relative;
}
.thrid .content .productPic{
	position: absolute;
	top: 78px;
	left: 460px;
	background: none;
	width: 600px;
	height: 520px;
	padding: 0;
}
.thrid .content .productPic img{
	width: 100%;
	display: none;
}
.thrid .content .productPic .active{
	display: block;
}
.thrid .iconBox .icon:nth-child(1) {
	background: url(../img/icon10@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(1):hover,.thrid .iconBox .icon:nth-child(1).active{
	background: url(../img/icon10_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(2) {
	background: url(../img/icon11@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(2):hover,.thrid .iconBox .icon:nth-child(2).active{
	background: url(../img/icon11_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(3) {
	background: url(../img/icon12@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(3):hover,.thrid .iconBox .icon:nth-child(3).active{
	background: url(../img/icon12_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(4) {
	background: url(../img/icon13@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(4):hover,.thrid .iconBox .icon:nth-child(4).active{
	background: url(../img/icon13_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(5) {
	background: url(../img/icon14@2x.png) no-repeat center left;
	background-size: 72px 100px;
}

.thrid .iconBox .icon:nth-child(5):hover,.thrid .iconBox .icon:nth-child(5).active{
	background: url(../img/icon14_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}
.thrid .iconBox .icon:nth-child(6) {
	background: url(../img/icon5@2x.png) no-repeat center left;
	background-size: 72px 100px;
}

.thrid .iconBox .icon:nth-child(6):hover,.thrid .iconBox .icon:nth-child(6).active{
	background: url(../img/icon5_active@2x.png) no-repeat center left;
	background-size: 72px 100px;
}