* {
	padding: 0;
	margin: 0;
}

li {
	list-style: none;
}

.box {
	width: 1000px;
	margin: 0 auto;
}

header {
	height: 165px;
	background-color: #191919;
}

.header_top {
	height: 58px;
	margin-bottom: 30px;
}

ul {
	width: 100%;
}

.header_top ul li {
	width: 33%;
	height: inherit;
	float: left;
	line-height: 58px;
	color: white;
	font-size: 14px;
	text-align: center;
}

.refresh {
	width: 49px;
	height: 23px;
	line-height: 23px;
	border: none;
	background-color: #ffeb0c;
	font-size: 16px;
	margin-left: 26px;
	text-decoration: none;
	border-radius: 5px;
}

.money {
	width: 100px;
	height: 33px;
	line-height: 33px;
	background-color: #e94335;
	border: none;
	display: inline-block;
	color: #ffffff;
	font-size: 18px;
	text-decoration: none;
	margin-left: 60px;
	cursor: pointer;
}

.balance-select {
	height: 76px;
	/*  border: 1px solid red;*/
}

.balance-select li {
	width: 24.5%;
	float: left;
	height: 80px;
	line-height: 80px;
	/*  border:1px solid pink;*/
	text-align: center;
	position: relative;
	color: white;
}

.balance-select li span {
	width: auto;
	height: 16px;
	line-height: 16px;
	position: absolute;
	top: 0;
	font-size: 16px;
}

.balance-select li select, input {
	width: 170px;
	height: 30px;
}

.balance-select li button {
	width: 161px;
	height: 29px;
	background-color: #cccccc;
	border: none;
	border-radius: 14px;
	cursor: pointer;
}

.balance-select li:hover button {
	background-color: #ffffff;
}

/*导航*/
nav {
	width: 100%;
	height: 83px;
	background-color: #131212;
}

nav li {
	width: 19.6%;
	height: 40px;
	line-height: 40px;
	float: left;
	text-align: center;
}

.ico {
	position: relative;
	width: 170px;
	height: 40px;
	line-height: 40px;
	display: block;
	background: url(../images/hover-ico.png) no-repeat 10% 10%;
	background-position: 5%;
	color: #dddddd;
	font-size: 16px;
	left: 28px;
}

nav li a {
	text-decoration: none;
	color: #ffffff;
}

.bbin-ico {
	background: url(../images/hover-ico.png) no-repeat 10% 10%;
	background-position: 0%;
}

.item .ico:hover {
	background: url(../images/onclic-ico.png) no-repeat 10% 10%;
	background-position: 5%;
	color: #e0be4a;
}

.item .bbin-ico:hover {
	background: url(../images/onclic-ico.png) no-repeat 10% 10%;
	background-position: 0%;
}

/*体育背导航景图*/
.ag-ico {
	background: url(../images/hover-ico.png) no-repeat 10% 10%;
	background-position: 11%;
}

.item .ag-ico:hover {
	background: url(../images/onclic-ico.png) no-repeat 10% 10%;
	background-position: 11%;
}

.bbin-ico {
	background: url(../images/hover-ico.png) no-repeat 10% 10%;
	background-position: 0%;
}

.item .bbin-ico:hover {
	background: url(../images/onclic-ico.png) no-repeat 10% 10%;
	background-position: 0%;
}

.sbo-ico {
	background: url(../images/hover-ico.png) no-repeat 10% 10%;
	background-position: 17%;
}

.item .sbo-ico:hover {
	background: url(../images/onclic-ico.png) no-repeat 10% 10%;
	background-position: 17%;
}

main {
	width: 100%;
	height: 414px;
}

main ul li {
	width: 33%;
	height: 126px;
	float: left;
}

/*真人*/
ul {
	width: 100%;
	height: auto;
	overflow: hidden;
	margin: 0 auto;
}

main ul li {
	width: 320px;
	height: 124px;
	float: left;
	margin: 6px;
	cursor: pointer;
}

main ul li span {
	position: relative;
	left: -152px;
	bottom: 52px;
	color: #ffffff;
	font-size: 18px;
}

@
keyframes items {from { width:0;
	height: 0;
	opacity: 0;
}

to {
	width: 335px;
	height: 126px;
	opacity: 1;
}

}
.items {
	display: none;
	width: 335px;
	height: 126px;
	background-color: #0a0a0a80;
	position: absolute;
	margin: 7px;
	margin-top: -3px;
	margin-left: -3px;
	cursor: pointer;
	animation: items .5s ease-in-out;
}

.bbin-ico spanb {
	
}

@
keyframes items_span {from { width:0;
	height: 0px;
	font-size: 0;
	left: 0;
	top: 0;
}

to {
	width: 112px;
	height: 16px;
	font-size: 16px;
	left: 106px;
	top: 28px;
}

}
.items span {
	position: absolute;
	width: 112px;
	height: 16px;
	font-family: 'MicrosoftYaHei';
	font-size: 16px;
	font-weight: normal;
	font-stretch: normal;
	line-height: 1px;
	letter-spacing: 0px;
	color: #ffc600;
	left: 106px;
	top: 28px;
	animation: items_span .5s ease-in-out;
}

.lists:hover .items {
	display: block;
	cursor: pointer;
	animation: items .5s ease-in-out;
}

.lists:hover .title {
	display: none;
	cursor: pointer;
	animation: title .5s ease-in-out;
}

@
keyframes title {from { width:0;
	height: 0;
	opacity: 0;
}

to {
	width: 335px;
	height: 126px;
	opacity: 1;
}

}
.title {
	width: 335px;
	height: 126px;
	cursor: pointer;
	animation: title .5s ease-in-out;
}

.items a {
	display: block;
	position: absolute;
	width: 135px;
	height: 36px;
	line-height: 36px;
	background-color: #a68000;
	border: solid 1px #eacca5;
	left: 25%;
	text-align: center;
	top: 38%;
	color: #ffffff;
	text-decoration: none;
	font-family: 'MicrosoftYaHei';
	font-size: 18px;
	font-weight: normal;
	font-style: italic;
	font-stretch: normal;
	cursor: pointer;
	animation: items_a .5s ease-in-out;
}

@
keyframes items_a {from { width:0;
	height: 0;
	top: 0;
	left: 0;
}

to {
	width: 135px;
	height: 36px;
	top: 38%;
	left: 25%;
}

}
a:hover {
	background-color: #ecbe20;
	/* border: solid 1px #eacca5;*/
	cursor: pointer;
}


/*体育*/
.sport-nav {
	height: 41px;
	line-height: 41px;
}

main .sport-list {
	width: 90%;
}

@
keyframes sport_span {from { width:0;
	height: 0px;
	transform: matrix(0);
}

to {
	width: 251px;
	height: 347px;
	transform: matrix(30deg);
}

}
.sport-list aside {
	width: 251px;
	height: 347px;
	float: left;
	margin: 22px 22px 22px 22px;
	position: relative;
	cursor: pointer;
}

.move-out {
	width: inherit;
	height: inherit;
	display: block;
	position: relative;
}

.move-in {
	position: absolute;
	width: inherit;
	height: inherit;
	top: 0;
	left: 0;
	display: none;
}

.move-in:hover .but {
	background-color: #f5f0f03b;
}

.sport-list aside:hover .move-out {
	animation: out .5s ease-in-out;
	display: none;
}

.sport-list aside:hover .move-in {
	display: block;
}

.but {
	position: absolute;
	width: 114px;
	height: 31px;
	line-height: 31px;
	text-align: center;
	bottom: 11%;
	left: 25%;
	background-color: #63636387;
	border: solid 1px #e2e4eb;
	color: white;
}

.sport-items:hover .but {
	background-color: #a68000cf;
}

.sport-list .out-avia {
	background-image: url('../images/esport_01.png');
}

.sport-list :hover.in-avia {
	background-image: url('../images/esport_1.png');
}

.sport-list .out-im {
	background-image: url('../images/esport_02.png');
}

.sport-list :hover.in-im {
	background-image: url('../images/esport_2.png');
}

.sport-list .out-djxa {
	background-image: url('../images/esport_03.png');
}

.sport-list :hover.in-djxa {
	background-image: url('../images/esport_3.png');
}

.sport-list .out-djlh {
	background-image: url('../images/esport_04.png');
}

.sport-list :hover.in-djlh {
	background-image: url('../images/esport_4.png');
}