body{
	font-family: FZLanTingHei-L-GBK, GothamBook, helvetica, arial, "Microsoft Yahei", 微软雅黑, sans-serif;
    color: rgb(102, 102, 102);
    font-weight: 200;
    background: white;
}
.navbar{
	width: 100%;
	height: auto;
	margin: 0;
	background:rgba(255,255,255,1);
	border: none;
}
/*当滚动条拉到300px以后改变背景色*/
.newnavbar{
	background:rgba(255,255,255,0.9) ;
}

/*这个媒体查询的作用是让盒子在屏幕大于1420px时始终居中显示*/	
@media only screen and (min-width: 1441px) {
	.navbar .navbar-header{
		position: relative;
		width:1400px;
		margin:auto !important; /*始终居中显示*/
		padding-left:30px ;
		padding-right:30px ;
	}
}
/*这个媒体查询的作用是让盒子在屏幕小于1420px时与屏幕等宽*/
@media (max-width: 1440px) {
	.navbar-header{
		position: relative;
		width: 100%;
		margin:0;
		padding-left:30px ;
		padding-right:30px ;
		/*overflow: hidden;*/
	}
}

/*进入新版本提示的样式*/
.navbar-header .new-vivo {
	position: absolute;
	display: block;
	width: 120px;
	height: 28px;
	margin-left: 150px;
	margin-top: 25px;
	padding-top: 4px;
	display: block;
	text-decoration: none;
	font-size: 0.5em;
	color: #2498D4;
	text-align: center;
	border-radius: 40px;
	border: 1px solid #2498D4;
	box-sizing: border-box;
}
/*当屏幕小于1201px时,提示进入新版官网的提示框消失*/
@media only screen and (max-width:1200px){
	.navbar-header .new-vivo{
		display: none;
	}
}

/*当屏幕宽度大于768px时的样式*/
@media only screen and (min-width:769px) {
	.navbar-header{
		float: none;
		margin: auto !important;
	}
	
	/*导航条的样式（折叠面板的样式）*/
	.navbar-header .navbar-collapse{
		float: left;
		width:650px;
		height: 80px !important;
		max-height: none;
		margin: 0;
		margin-left:18%;
		padding: 0 !important;
		background:rgba(255,255,255,0);
		box-sizing: border-box;
	}
	.navbar-header .navbar-collapse .dropmenu{
		list-style: none;
		display:inline-block;
		overflow: hidden;
		width: 100%;
		margin: 0 ;
		padding: 0;			
	}
	.navbar-header .navbar-collapse .dropmenu>li{
		list-style: none;
		display: inline-block;
		float: left;
		width: 75px;
		height:100%;
		margin: 0;
		color: rgb(102, 102, 102);
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(4){
		width: 110px; /*第四个和第五个li占得宽度不一样,要另外设置宽度*/
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(5){
		width: 150px;
	}
	.navbar-header .navbar-collapse .dropmenu>li>a{
		display: block;
		width: 100%;
		height: 80px;
		text-decoration: none;
		text-align:center;
		font-size: 1.2em;
		color:inherit;
		line-height: 80px;
	}
	/*当前鼠标移上的样式*/
	.nav-active{
		background: #008CD6;
		transition: background-color .3s ease,transform .3s .41s ease,opacity .3s .41s ease;
	}
	.nav-active>.active-a{
		color:white !important;
	}
	
	/*导航条右边小图标的样式*/
	.navbar-header .nav-icon{
		display: inline-block;
		list-style: none;
		width:166px;
		height: 80px;
		margin: 0;
		padding: 0;
	}
	.navbar-header .nav-icon li{
		display: inline-block;
		float: right;
		width: 32px;
		height: 32px;
		padding-left:5px;
		padding-top: 6px;
		margin-top: 25px;
		margin-left: 10px;
		vertical-align: middle;
		border: 1px solid #BFBFBF;
		border-radius: 50%;
	}
	.navbar-header .nav-icon >li>a{
		display: block;
		width: 80%;
		height: 80%;
		text-decoration: none;
	}
	.navbar-header .nav-icon #kefu{
		background-image: url(../img/vivo-gb-ico.png);
		background-position: -35px 0px;
	}
	.navbar-header .nav-icon #search{
		background-image: url(../img/vivo-gb-ico.png);
		background-position: 2px 0px;	
	}
	.navbar-header .nav-icon #login{
		background-image: url(../img/vivo-gb-ico.png);
		background-position-x: -16px;
		background-position-y: 0;
	}
	.navbar-header .nav-icon li:last-child:hover{
		background: #008CD6;
	}
	
	/*产品导航下拉面板的样式*/
	.product-dropmenu{
		top: -1px;
		left: 0px;
		display:none;
		position: absolute;
		width: 100%;
		height:330px;
		margin-top: 81px;
		border-top: 1px solid rgba(201,201,201,0.2);
		background:rgba(255,255,255,1);
		z-index: 999;
	}
	.product-hover{
		display: block;
	}
	.all-col{
		position: relative;
		display: block;
		list-style: none;
		overflow: hidden;
		width: 70%;
		height: 85%;
		padding: 0;
		margin:auto;
		margin-top: 30px;
	}
	.all-col .col-lg-12{
		display: block;
		list-style: none;
		float: left;
		overflow: hidden;
		width:100%;
		height: 40px;
		margin-bottom: 3px;
	}
	
	.col-lg-12 a{
		opacity: 0;
		display: inline-block;
		text-decoration: none;
		float: left;
		width: 20%;
		height: 100%;
		margin-left: 20px;
		text-align: left;
		font-size: 1.1em;
		color: #666;
	}
	.col-lg-12:first-child{
		margin-bottom:15px ;
	}
	.col-lg-12:first-child a{
		font-size: 1.17em;
		color: black;
	}
	/*产品下拉菜单的动画*/
	@keyframes product-ml{
		from{margin-left: 20px;}
		to{margin-left:0}
	}
	@keyframes product-op{
		from{opacity: 0;}
		to{opacity: 1;}
	}
	.col-lg-12:nth-child(2) a,.col-lg-12:first-child a{
		animation: product-ml .5s forwards linear .5s, product-op .6s forwards linear .4s;
	}
	.col-lg-12:nth-child(3) a{
		animation: product-ml .5s forwards linear .5s, product-op .7s forwards linear .4s;
	}
	.col-lg-12:nth-child(4) a{
		animation: product-ml .5s forwards linear .5s, product-op .8s forwards linear .4s;
	}
	.col-lg-12:nth-child(5) a{
		animation: product-ml .5s forwards linear .5s, product-op .9s forwards linear .4s;
	}
	.col-lg-12:nth-child(6) a{
		animation: product-ml .5s forwards linear .5s, product-op 1s forwards linear .4s;
	}
	.col-lg-12 a:hover,.col-lg-12:first-child a:hover,.col-lg-12:first-child a:hover b{
		color: #008CD6;
	}
	.col-lg-12 a .glyphicon{
		color: rgba(102, 102, 102,0.6);
		font-size: 0.5em;
	}	
}

/*调整导航条的媒体查询*/
/*当屏幕宽度小于1172px时的样式*/
@media only screen and (max-width:1172px) {
	.navbar-header .navbar-collapse{
		width:620px;
		margin-left: 15%;
	}
	.navbar-header .navbar-collapse .dropmenu>li{
		width: 70px;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(4){
		width: 105px; /*第四个和第五个li占得宽度不一样,要另外设置宽度*/
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(5){
		width: 145px;
	}
}
/*当屏幕宽度小于1124px时的样式*/
@media only screen and (max-width:1124px) {
	.navbar-header .navbar-collapse{
		width:600px;
		margin-left: 14%;
	}
	.navbar-header .nav-icon{
		width: 160px;
	}
}
/*当屏幕宽度小于1080px时的样式*/
@media only screen and (max-width:1080px) {
	.navbar-header .navbar-collapse{
		margin-left: 14%;
	}
	.navbar-header .nav-icon{
		width: 126px;
	}
}
/*当屏幕宽度小于1044px时的样式*/
@media only screen and (max-width:1044px) {
	.navbar-header .navbar-collapse{
		width:599px;
		margin-left: 10%;
	}
	.navbar-header .navbar-collapse .dropmenu>li{
		width: 68px;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(4){
		width: 102px; /*第四个和第五个li占得宽度不一样,要另外设置宽度*/
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(5){
		width: 142px;
	}
	.col-lg-12 a{
		width: 20%;
		text-align: center;
	}
}
/*当屏幕宽度小于994px时的样式*/
@media (max-width:994px) {
	.navbar-header .navbar-collapse{
		width:570px;
		margin-left: 6%;
	}
	.navbar-header .navbar-collapse .dropmenu>li{
		width: 65px;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(4){
		width: 99px; /*第四个和第五个li占得宽度不一样,要另外设置宽度*/
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(5){
		width: 139px;
	}
}
/*当屏幕宽度小于922px时的样式*/
@media (max-width:922px) {
	.navbar-header .navbar-collapse{
		width:560px;
		margin-left: 6%;
	}
	.navbar-header .navbar-collapse .dropmenu>li{
		width: 60px;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(4){
		width: 94px; /*第四个和第五个li占得宽度不一样,要另外设置宽度*/
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(5){
		width: 134px;
	}
}
/*当屏幕宽度小于911px时的样式*/
@media (max-width:911px) {
	.navbar-header .navbar-collapse{
		width:560px;
		margin-left:4%;
	}
}
/*当屏幕宽度小于893px时的样式*/
@media (max-width:893px) {
	.navbar-header .navbar-collapse{
		width:500px;
		margin-left: 4%;
	}
	.navbar-header .navbar-collapse .dropmenu>li{
		width: 55px;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(4){
		width: 89px; /*第四个和第五个li占得宽度不一样,要另外设置宽度*/
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(5){
		width: 129px;
	}
}
/*当屏幕宽度小于831px时的样式*/
@media (max-width:831px) {
	.navbar-header .navbar-collapse{
		width:500px;
		margin-left: 10px;
	}
	.navbar-header .nav-icon{
		margin-left: -50px;
	}
}/*调整导航条的媒体查询结束*/
	
/*logo的样式，用的是background-image方法*/
.navbar-header .vivo-logo{
	display: block;
	width: 95px;
	height: 25px;
	margin-top: 28px;
	background-image: url(../img/vivo-gb-logo.png);
	background-size: 95px 25px;
	background-repeat: no-repeat;
}

/*轮播器*/
.carousel{
	position: fixed;
	width: 100%;
	height:auto;
	z-index: 100;
}
.carousel-indicators{
	padding-bottom: 15px;
}
.carousel-indicators li{
	background: white;
	border: none;
	margin:5px;
	transform: scale(1);
	transition: all .4s ease-in;
}
.carousel-indicators li:hover{
	transform: scale(1.2);
	background: #008CD6;	
}
.carousel-indicators .active{
	margin:5px;
	transform: scale(1);
	background: white;
	border-radius: 50%;
	background: #008CD6;
}
.carousel-inner{
	width: 100%;
	height:800px;
	background: rgba(0,0,0,0.5);
}
.item{
	width: 100%;
	height:100%;
	
}
#lunbo-img1{
	background-image:url(../img/vm-h-x9slive-bg-mini.jpg);
	background-repeat: no-repeat;
	background-size: 100% 100%;	
}
#lunbo-img1 img,#lunbo-img2 img, #lunbo-img3 img{
	width: 100%;
	height: 100%;
}
@keyframes title-opacity{
	from{opacity: 0;}
	to{opacity: 1;}
}
@keyframes title1{
	from{margin-top: 250px;}
	to{margin-top: 260px;}
}
@keyframes title2{
	from{margin-top: 290px;}
	to{margin-top: 300px;}
}
@keyframes title3{
	from{margin-top: 330px;}
	to{margin-top: 340px;}
}
@keyframes title4{
	from{margin-top: 430px;}
	to{margin-top: 440px;}
}
#lunbo-img1 a,#lunbo-img2 a,#lunbo-img3 a{
	display: inline-block;
	position: absolute;
	text-decoration: none;
	margin-left: 40%;
	height: 30px;
}
#lunbo-img1 .lunbo-img1-title1{
	animation: title1 1s forwards linear,title-opacity 1s forwards linear;
}

#lunbo-img1 .lunbo-img1-title2{
	animation: title2 1s forwards linear 1s,title-opacity 1s forwards linear 1s;
}
#lunbo-img1 .lunbo-img1-title3{
	animation: title3 1s forwards linear 1.5s,title-opacity 1s forwards linear 1.5s;
}
#lunbo-img1 .go-to-call,#lunbo-img2 .go-to-buy, #lunbo-img3 .buy-soon{
	margin-left: 45%;
	text-decoration: none;
	width: 100px;
	height: 30px;
	color: white;
	font-size: 14px;
	text-align: center;
	line-height: 28px;
	border: 1px solid white;
	border-radius: 20px;
}
#lunbo-img3 .buy-soon{
	color: #008CD6;
	border: 1px solid #008CD6;
	border-radius: 20px;
}
#lunbo-img1 .go-to-call{
	animation: title4 1s forwards linear 2s,title-opacity 1s forwards linear 2s;
}
.go-to-call:after, #lunbo-img2 .go-to-buy:after,#lunbo-img3 .buy-soon:after{
	content: " ";
	display: inline-block;
	width: 12px;
	height: 10px;
	margin-top: 3px;
}
.go-to-call:after, #lunbo-img2 .go-to-buy:after{
	background-image: url(../img/vivo-high-ico.png);
	background-position: 7px 1px;
	background-repeat: no-repeat;
	transition: all .2s linear;
}
#lunbo-img3 .buy-soon:after{
	background-image: url(../img/vivo-high-ico.png);
	background-position: 7px -11px;
	background-repeat: no-repeat;
	transition: all .2s linear;
}

#lunbo-img1 .go-to-call:hover:after,#lunbo-img2 .go-to-buy:hover:after{
	height: 10px;
	background-image: url(../img/vivo-high-ico.png);
	background-position: 7px -25px;
	background-repeat: no-repeat;
}

@keyframes title5{
	from{margin-top: 190px;}
	to{margin-top: 210px;}
}
@keyframes title6{
	from{margin-top: 230px;}
	to{margin-top: 250px;}
}
@keyframes title7{
	from{margin-top: 340px;}
	to{margin-top: 350px;}
}
@keyframes title8{
	from{margin-top: 280px;}
	to{margin-top: 290px;}
}
#lunbo-img2{
	background-image:url(../img/vm-h-game0627-bg.jpg);
	background-repeat: no-repeat;
	background-size: 100% 100%;	
}
#lunbo-img2 a{
	margin-left: 25%;
}
#lunbo-img2 .go-to-buy{
	margin-left: 30%;
}
#lunbo-img2 .lunbo-img2-title1,#lunbo-img3 .lunbo-img1-title1{
	animation: title5 1s forwards linear,title-opacity 1s forwards linear;
}

#lunbo-img2 .lunbo-img2-title2, #lunbo-img3 .lunbo-img1-title2{
	animation: title6 1s forwards linear 1s,title-opacity 1s forwards linear 1s;
}
#lunbo-img3 .lunbo-img1-title3{
	animation: title8 1s forwards linear 1.5s,title-opacity 1s forwards linear 1.5s;
}
#lunbo-img2 .go-to-buy,#lunbo-img3 .buy-soon{
	animation: title7 1s forwards linear 2s,title-opacity 1s forwards linear 2s;
}
#lunbo-img3{
	background:white;
}
#lunbo-img3 span{
	position: absolute;
	display:block;
	width: 41%;
	height: 57%;
}
@keyframes wrap1{
	from{margin-top: -140px;}
	to{margin-top: 0;}
	from{margin-left: 56%;}
	to{margin-left: 52%;}
}
@keyframes wrap2{
	from{margin-top: 38%;}
	to{margin-top: 25%;}
	from{margin-left: 60%;}
	to{margin-left: 65%;}
}
#lunbo-img3 .wrap-img1{
	margin-left: 52%;
	background-image: url(../img/vm-h-x9plus-figure1-mini.jpg);
	background-repeat: no-repeat;
	background-size: 95% 40%;
	animation: wrap1 3s forwards linear;
}
#lunbo-img3 .wrap-img2{
	width: 40%;
	height:60%;
	margin-top: 25%;
	margin-left: 65%;
	background-image: url(../img/vm-h-x9plus-figure2-mini.jpg);
	background-repeat: no-repeat;
	background-size: 95% 40%;
	animation: wrap2 3s forwards linear;
}
#lunbo-img3 a{
	margin-left: 20%;
}
#lunbo-img3 .buy-soon{
	margin-left: 25%;
}
#lunbo-img4{
	background-image: url(../img/vm-h-x9pyy-bg.jpg);
	background-repeat: no-repeat;
	background-size: 100% 100%;	
}

/*页面的中间部分内容*/
.vivo-main{
	position:absolute;
	overflow: hidden;
	height: auto;
	margin-top: 900px;
	margin-bottom: 330px;
	background:rgba(246,247,248,1);
	z-index: 1008;
}
/*免息购买*/
.vivo-main .free-buy{
	display: block;
	overflow: hidden;
	list-style: none;
	height: auto;
	padding: 0;
}
.vivo-main .free-buy li{
	overflow: hidden;
	display:inline-block;
	float: left;
	list-style: none;
	height: 300px;
	padding: 0;
}
.vivo-main .free-buy li a{
	display:inline-block;
	text-decoration: none;
	width: 100%;
	height: 100%;
}
 .vivo-main .free-buy li .free-buy-img1{
 	background-image: url(../img/freebuy-img1.jpg);
 	background-repeat: no-repeat;
 	background-size: 115% 100%;
 	background-position:-30px 0px;
}
.vivo-main .free-buy li .free-buy-img2{
	background-image: url(../img/freebuy-img2.jpg);
	background-repeat: no-repeat;
	background-size: 115% 100%;
	background-position:-50px 0px;
}
 .vivo-main .free-buy li .free-buy-img3{
	background-image: url(../img/freebuy-img3.jpg);
	background-repeat: no-repeat;
	background-size: 115% 100%;
	background-position:-40px 0px;
}
.vivo-main .free-buy li a .action{
	display: block;
	width: 82px;
	height: 85px;
	margin: 0 auto;
	margin-top: 110px;
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -520px 0px;	
}
.vivo-main .free-buy li a .action:hover{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -420px 0px;	
}
.vivo-main .free-buy h4{
	display: block;
	width: 200px;
	height: 25px;
	margin: 0 auto;
	margin-top: 230px;
	text-align: center;
	color: rgb(51,51,51);
}
.vivo-main .free-buy h4:nth-child(2){
	color:white;
	margin-top: 35px;
}
.vivo-main .free-buy h5{
	display: block;
	width: 200px;
	height: 25px;
	margin: 0 auto;
	text-align: center;
	color: rgba(102, 102, 102,0.7);
}
.vivo-main .free-buy h5:nth-child(3){
	color: white;
}

/*活动*/
.vivo-main .activity ,.vivo-main .state, .vivo-main .media{
	width: 100%;
	overflow: hidden;
	margin:auto;
	margin-top: 80px;
	padding-left: 30px;
	padding-right: 30px;
}
.vivo-main .activity h3,.vivo-main .state h3, .vivo-main .media h3{
	display: block;
	float: left;
	width: 70px;
	height: 50px;
	font-weight: bold;
	color: rgba(0,0,0,0.8);
}
.vivo-main .activity a, .vivo-main .state a, .vivo-main .media a{
	display: block;
	float: left;
	text-decoration: none;
	width: 65px;
	height: 35px;
	text-align:center;
	font-size: 0.5em;
	color: rgb(102, 102, 102);
	line-height: 35px;
	margin-top: 15px;
	border: 1px solid rgb(102, 102, 102);
	border-radius: 20px;
}
.vivo-main .activity a:hover, .vivo-main .state a:hover, .vivo-main .media a:hover{
	border-color: #008CD6;
	color: #008CD6;
}
.vivo-main .activity-icons{
	overflow: hidden;
	display: block;
	list-style: none;
	width: 100%;
	height:auto;
	margin:0 auto;
	padding-left:30px ;
	padding-right: 30px;
}
.vivo-main .activity-icons li{
	display: inline-block;
	float: left;
	list-style: none;
	width: 25%;
	padding: 5px;
	box-sizing: border-box;
}
.vivo-main .activity-icons li .activity-icons-img{
	display: inline-block;
	width: 100%;
	text-decoration: none;
}
.vivo-main .activity-icons li .activity-icons-img>img{
	width:100%;
	height: 70%;
}
.vivo-main .activity-icons li:hover a{
	color:#008CD6;
}
.vivo-main .activity-icons .new{
	display: block;
	margin-top: 15px;
	text-decoration: none;
	font-size: 1.2em;
	color:black;
}
.vivo-main .activity-icons .checkdetail{
	display: block;
	text-decoration: none;
	color:rgba(0,0,0,0.6);
}
.vivo-main .activity-icons h6{
	color:rgba(0,0,0,0.3);
}
.vivo-main .activity-icons h5{
	color:rgba(0,0,0,0.5);
	font-weight: bold;
}
.activity-hover{
	list-style: none;
}
.activity-hover a{
	color:#008CD6;
}

/*动态*/
.vivo-main .state-icons{
	overflow: hidden;
	display: block;
	list-style: none;
	width: 100%;
	height:auto;
	margin:0 auto;
	padding-left:30px ;
	padding-right: 30px;
}
.vivo-main .state-icons li{
	position: relative;
	overflow: hidden;
	display: block;
	float: left;
	list-style: none;
	width: 33%;
	height:auto;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
.vivo-main .state-icons li .state-icons-img{
	display: inline-block;
	float: left;
	text-decoration: none;
	width: 110px;
	height: 110px;
	margin: 0;
	padding: 0;
}
.vivo-main .state-icons li .state-icons-img img{
	width: 100%;
	height: 100%;
}
.vivo-main .state-icons li a{
	display: block;
	overflow: hidden;
	width: 60%;
	float: left;
	text-decoration: none;
	padding: 0;
	padding-left: 20px;
	margin: 0;
	box-sizing: border-box;
}
.vivo-main .state-icons li a h4{
	display: inline-block;
	width: 90%;
	margin: 0;
	line-height:20px;
	font-size: 16px;
	color:rgba(0,0,0,1);
	overflow: hidden; /*自动隐藏文字*/
	text-overflow: ellipsis;/*文字隐藏后添加省略号*/
	white-space: nowrap;/*强制不换行*/
}
.vivo-main .state-icons li a h4 b{
	display: block;
	width: 30px;
	float: left;
	padding: 3px;
	margin-right: 5px;
	background: #008CD6;
	color:white;
	text-align: center;
	font-size: 0.5em;
	font-weight: normal;
	border-radius: 5px;
	box-sizing: border-box;
}

.vivo-main .state-icons li a h5{
	margin-top: 0px;
	line-height:20px;
	color:rgba(0,0,0,0.6);
}
.vivo-main .state-icons li a:hover h4,.vivo-main .state-icons li a:hover h5{
	color:#008CD6;
}
.vivo-main .state-icons li h6{
	position: absolute;
	padding: 0;
	margin: auto;
	margin-left: 130px;
	margin-top:95px;
	color:rgba(0,0,0,0.5);
}

/*媒体*/
.vivo-main .media{
	padding-top: 60px;
	background:rgba(237,239,241,1);
}
.vivo-main .media-icons{
	overflow: hidden;
	display: block;
	width: 100%;
	height: auto;
	margin:0 auto;
	padding-bottom: 40px;
	padding-left:30px ;
	padding-right: 30px;
	background:rgba(237,239,241,1);
}
.vivo-main .media-icons li{
	position: relative;
	overflow: hidden;
	display: inline-block;
	float: left;
	width: 33.33%;
	height: 160px;
	box-sizing: border-box;
}
.vivo-main .media-icons li:nth-child(2){
	padding-left: 15px;
}
.vivo-main .media-icons li:nth-child(3){
	padding-left: 25px;
}
.vivo-main .media-icons li a{
	display: inline-block;
	text-decoration: none;
}
.vivo-main .media-icons li .media-text{
	float: left;
	display: inline-block;
	width: 50%;
	padding-right: 20px;	
	
}
.vivo-main .media-icons li .media-text .smartphone{
	font-size: 1.2em;
	color:rgba(0,0,0,1);
}
.vivo-main .media-icons li .media-text .newphone{
	color:rgba(0,0,0,0.6);
	line-height: 20px;
}
.vivo-main .media-icons li .media-text .newphone:hover{
	color:rgba(0,0,0,0.8);
}
.vivo-main .media-icons li .media-text h6{
	display: block;
	position: absolute;
	float: left;
	margin-top:30px;
	line-height: 25px;
	color:rgba(0,0,0,0.2);
}
.vivo-main .media-icons li:first-child .media-text h6{
	margin-top:55px;
}
.media-text .icons-bold{
	display: inline-block;
	width: 100%;
	height: 30px;
	margin-top: 0px;
	color:rgba(0,0,0,0.5);
	font-weight: bold;
}
.media-text .icons-bold .icons-weibo-bg,.media-text .icons-bold .icons-weixin-bg{
	display: block;
	float: left;
	width: 30px;
	height: 30px;
}
.media-text .icons-bold .icons-weibo-bg{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -430px -182px;
}
.media-text .icons-bold .icons-weixin-bg{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -565px -182px;
}
.vivo-main .media-icons li .media-img{
	display: inline-block;
	width: 50%;
	padding-left: 30px;
	float: right;
	text-decoration: none;
}

/*footer部分*/
.footer{
	display:none;
	position:fixed;
	width: 100%;
	height: auto;
	margin: auto;
	bottom: 0;
	background: rgba(34,34,34,1);
	z-index: -1;
}
.footer .footer-wrap{
	width: 100%;
	margin: auto;
	height: 300px;
	margin-bottom: 10px;
}
.footer .weixin-share .erweima{
	display: none;
	position: absolute;
	width: 110px;
	height: 120px;
	margin: 0 auto;
	margin-top:-120px ;
	margin-left: -3%;
	border: none;
}
.footer .weixin-share .erweima-v{
	display: block;
	width: 100%;
	height: 90%;
	margin: 0 auto;
	padding: 5px;
	background: white;
}
.footer .weixin-share .erweima h4{
	position: absolute;
	display: block;
	text-align: center;
	color: white;
	margin-top: 100px;
	margin-left: 45px;
}
.footer .footer-wrap #footer-vivo-logo{
	display: block;
	margin:auto;
	margin-top:20px;
}
.footer #footer-vivo-logo img{
	margin: auto;
}
.footer .share-icons{
	width: 100%;
	height: auto;
	margin: 0 auto;
	margin-top: 20px;
	padding: 0;
	text-align: center;
}
.footer .share-icons .share-icons-a{
	display: inline-block;
	text-decoration: none;
	width: 45px;
	height: 45px;
	margin-top: 20px;
	margin-left:25px ;
	border-radius: 50%;
	background:rgb(101,101,101);
}
.footer .share-icons span{
	display: inline-block;
	overflow: hidden;
	width: 200px;
	height: 50px;
	margin-top: 20px;
	margin-left:25px;
	border-left: 1px solid rgb(101,101,101);
}
.footer .share-icons span > a{
	display:inline-block;
	text-decoration: none;
	width: 140px;
	height: 40px;
	margin: 0;
	margin-top: 5px;
	font-size: 1em;
	color: white;
	line-height: 40px;
	text-align: left;
	background:rgb(101,101,101);
	border-radius: 20px;
}
.footer .share-icons b {
	display:inline-block;
	float: left;
	text-decoration: none;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	margin: 8px;
}
.footer .share-icons span a b{
	margin-left: 5px;
	margin-right: 8px;
	margin-top: 5px;
	background-image: url(../img/vivo-gb-ico.png);
	background-position:-242px -88px;
}
.footer .share-icons .weibo-share b{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -428px -88px;
}
.footer .share-icons .weixin-share b{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -563px -88px;
}
.footer .share-icons .vivo-share b{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -294px -87px;
}
.footer .share-icons .tieba-share b{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -338px -88px;
}
.footer .share-icons .buluo-share b{
	background-image: url(../img/vivo-gb-ico.png);
	background-position: -203px -88px;
}
.footer .share-icons .weibo-share:hover{
	background: rgb(240,69,69);
}
.footer .share-icons .weixin-share:hover{
	background: rgb(32,169,0);
}
.footer .share-icons .vivo-share:hover,.footer .share-icons span a:hover{
	background: rgb(0,140,214);
}
.footer .share-icons .tieba-share:hover{
	background: rgb(33,133,238);
}
.footer .share-icons .buluo-share:hover{
	background: rgb(66,176,244);
}
.footer .footer-nav{
	width: 100%;
	height: auto;
	margin: 0 auto;
	margin-top: 35px;
	padding: 0;
	text-align: center;
}
.footer .footer-nav a{
	text-decoration: none;
	width: 8%;
	height: 40px;
	margin-left: 15px;
	font-size: 1em;
	color: rgb(108,108,108);
}
.footer .footer-nav a b{
	font-size: 0.5em;
}
.footer .footer-nav a:hover{
	color: rgb(33,133,238);
}
.footer .copyright{
	width: 100%;
	height: auto;
	margin:0 auto;
	margin-top: 25px;
	padding: 0;
	text-align: center;
}
.footer .copyright h6{
	display: inline-block;
	width: 100%;
	height:20px;
	padding: 0;
	margin: 0;
	text-align: center;
}
.footer .copyright h6 b{
	display:inline-block;
	/*float: right;*/
	width:15px;
	height: 15px;
	margin: 0;
	margin-left: 5px;
	background-image: url(../img/gssw-icon.png);
	background-repeat: no-repeat;
	background-size: 15px 15px;
}

/*回到顶部*/
.back-to-top{
	display:none;
	text-decoration: none;
	position:fixed;
	width: 50px;
	height: 50px;
	margin: auto;
	bottom:40px;
	right: 20px;
	background: rgba(0,0,0,0.3);	
	border-radius: 5px;
	z-index: 1009;	
}
.back-to-top:hover{
	text-decoration: none;
	background: #008CD6;
}
.back-to-top b{
	display:block;
	width:15px;
	height: 18px;
	margin: 0 auto;
	margin-top: 5px;
	color: white;
}
.back-to-top h6{
	color: white;
	text-align: center;
	margin: 0;
}
@keyframes top-in{
	from{bottom: -10px;}
	to{bottom: 40px;}
}
.top-in-animate{
	animation: top-in .3s linear;
}

/*当屏幕宽度小于900px时的样式*/
@media only screen and (max-width:900px) {
	.vivo-main .media-icons li{
		width: 100%;
	}
}

/*当屏幕宽度小于1000px时的样式*/
@media (min-width:769px) and (max-width:1001px) {
	.vivo-main .activity-icons li{
		width:50% ;	
	}
	.vivo-main .state-icons li a{
		width:50%
	}
}

/*当屏幕宽度小于769px时的样式*/
@media only screen and (max-width: 768px) {
	.product-dropmenu{
		display: none;
	}
	
			
	/*进入新版本提示的样式*/
	.navbar-header .new-vivo {
		display:block;
		width: 150px;
		height: 29px;
		margin-left: 115px;
		margin-top: 12px;
		font-size: 1em;
		line-height: 20px;
	}
	
	/*logo样式*/
	.navbar-header .vivo-logo{
		width: 75px;
		height: 20px;
		margin-top: 15px;
		margin-left: 15px;
		background-image: url(../img/vivo-gb-logo.png);
		background-size: 75px 20px;
		background-repeat: no-repeat;
	}
	
	/*导航条右边的小图标消失*/
	.navbar-header .nav-icon{
		display: none;
	}
	
	/*下拉导航条的折叠按钮*/
	.navbar-header .btn-toggle {
		display: block;
		position: relative;
		width: 25px;
		height: 20px;
		margin-top: 15px;
	}
	
	/*折叠按钮里面的内容是张背景图*/
	.navbar-header .btn-toggle .collapse-btn-content{
		position: relative;
		display: block;
		width: 100%;
		height:20px;
		background-image: url(../img/vivo-gb-ico.png);
		background-position: 0px -36px;
		/*transition: transform 1.5s linear;*/
	}
	.small{
		transform: scale(0);
		transition: transform .2s linear;
	}
	.big{
		transform: scale(1);
		transition: transform .3s linear .5s;
	}
	/*点击按钮时改变按钮*/
	.changebutton{
		position:absolute;
		display: block;
		width: 100%;
		height:20px;
		margin-top: -20px;
		margin-left: -5px;
		background-image: url(../img/vivo-gb-ico.png);
		background-position: -20px -36px;
		z-index: 999;
		transform: scale(0);
		transition: transform .3s ease .2s;
	}
	
	/*鼠标移上折叠按钮时*/
	.navbar-header .btn-toggle .collapse-btn-content:hover{
		opacity: 0.7;
	}
	@keyframes minheightshow{
		from{min-height: 0;}
		to{min-height: 700px;}
	}
	@keyframes minheighthide{
		from{min-height: 700;}
		to{min-height: 0px;}
	}
	/*折叠面板的样式*/
	.navbar-header .navbar-collapse{
		float: left;
		overflow: hidden;
		margin:0;
		margin-top:40px;
		/*height: 700px;*/
		min-height:700px;
		background:rgba(255,255,255,1);
	}
	.navbar-header .navbar-collapse .dropmenu{
		list-style: none;
		display: block;
		width: 100%;
		padding: 0;
	}
	.navbar-header .navbar-collapse .dropmenu>li{
		list-style: none;
		display: block;
		width: 100%;
		height: 30px;
		margin-left: -130px;
		margin-bottom:20px;
		
	}
	@keyframes left-to-right{
		from{margin-left: -130px;}
		to{margin-left: -5px;}
	}
	@keyframes left-to-right-op{
		from{opacity: 0;}
		to{opacity: 1;}
	}
	.navbar-header .navbar-collapse .dropmenu>li:first-child{
		animation: left-to-right .8s forwards linear .3s,left-to-right-op .8s forwards linear .3s;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(2){
		animation: left-to-right .8s forwards linear .4s,left-to-right-op .8s forwards linear .4s;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(3){
		animation: left-to-right .8s forwards linear .5s,left-to-right-op .8s forwards linear .5s;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(4){
		animation: left-to-right .8s forwards linear .6s,left-to-right-op .8s forwards linear .6s;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(5){
		animation: left-to-right .8s forwards linear .7s,left-to-right-op .8s forwards linear .7s;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(6){
		animation: left-to-right .8s forwards linear .8s,left-to-right-op .8s forwards linear .8s;
	}
	.navbar-header .navbar-collapse .dropmenu>li:nth-child(7){
		animation: left-to-right .8s forwards linear .9s,left-to-right-op .8s forwards linear .9s;
	}
	.navbar-header .navbar-collapse .dropmenu>li>a{
		display: block;
		width: 100%;
		height: 100%;
		text-decoration: none;
		text-align: left;
		font-size: 1.15em;
		color: rgb(102, 102, 102);
		
	}
	.navbar-header .navbar-collapse .dropmenu>li>a:hover{
		background: white;
		color: rgb(22,150,217);
	}
	/*免息购买*/
	.vivo-main .free-buy li{
		margin: 0;
		padding: 0;
		padding-left: 15%;
		box-sizing: border-box;
	}
	.vivo-main .free-buy li:nth-child(2){
		background: black;
	}
	.vivo-main .free-buy li a{
		position:relative;
		width: 80%;
		padding: 0;
		margin:auto;
		box-sizing: border-box;
	}
	
	/*活动*/
	.vivo-main .activity-icons li{
		width:100% ;	
		margin-bottom: 20px;
	}
	
	/*动态*/
	.vivo-main .state{
		margin-top: 70px;
	}
	.vivo-main .state-icons li{
		width:100%;
		height: auto;
		margin-bottom: 30px;
	}
	.vivo-main .state-icons li a{
		width:50%
	}
	
	/*footer部分*/
	.footer .footer-wrap .share-icons{
		margin: 0 auto;
		margin-top: 10px;
	}
	.footer .footer-wrap .share-icons .share-icons-a:nth-child(2){
		display: none;
	}
	.footer .footer-wrap .share-icons .share-icons-a{
		margin: 0;
		margin-left:25px ;
	}
	.footer .footer-wrap .share-icons span{
		margin: 0;
		margin-left:25px;
	}
	.footer .footer-wrap .footer-nav{
		margin-top: 20px;
	}
	.footer .footer-wrap .footer-nav a{
		display: inline-block;
		float: left;
		width:24%;
		height: 20px;
		padding:0 ;
		margin: 0;
		margin-top: 5px;
	}
	.footer .footer-wrap .footer-nav a:nth-child(5){
		margin-left: 50px;
	}
	.footer .footer-wrap .footer-nav a:nth-child(8){
		width:30%;
		margin-left: 40px;
	}
	.footer .footer-wrap .copyright{
		width: 100%;
		height: auto;
		margin:0 auto;
		margin-top: 10px;
		padding: 0;
		text-align: center;
		margin-bottom: 20px;
	}
	.footer .footer-wrap .copyright h6{
		width: 100%;
		height: 15px;
		line-height: 20px;
		font-size: 8px;
		margin:auto;
	}
	.footer .footer-wrap .copyright h6:first-child{
		margin-top: 10px;
	}	
}