* {
	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.3%;
	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: 16.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;
}

main ul li:nth-child(1) {
	background: url("../images/ab.jpg") no-repeat;
}

main ul li:nth-child(2) {
	background: url("../images/ag.jpg") no-repeat;
}

main ul li:nth-child(3) {
	background: url("../images/bbin.jpg") no-repeat;
}

main ul li:nth-child(4) {
	background: url("../images/bg.jpg") no-repeat;
}

main ul li:nth-child(5) {
	background: url("../images/dg.jpg") no-repeat;
}

main ul li:nth-child(6) {
	background: url("../images/og.jpg") no-repeat;
}

main ul li:nth-child(7) {
	background: url("../images/ag2.jpg") no-repeat;
}

main ul li:nth-child(8) {
	background: url("../images/mg.jpg") no-repeat;
}

main ul li:nth-child(9) {
	background: url("../images/ds.jpg") no-repeat;
}

/*体育*/
.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 0px 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-ag {
	background-image: url('../images/sport_01.png');
}

.sport-list :hover.in-ag {
	background-image: url('../images/sport_1.png');
}

.sport-list .out-188 {
	background-image: url('../images/sport_02.png');
}

.sport-list :hover.in-188 {
	background-image: url('../images/sport_2.png');
}

.sport-list .out-sb {
	background-image: url('../images/sport_05.png');
}

.sport-list :hover.in-sb {
	background-image: url('../images/sport_5.png');
}

.sport-list .out-sob {
	background-image: url('../images/sport_03.png');
}

.sport-list :hover.in-sob {
	background-image: url('../images/sport_3.png');
}

.sport-list .out-hg {
	background-image: url('../images/sport_04.png');
}

.sport-list :hover.in-hg {
	background-image: url('../images/sport_4.png');
}

.sport-list .out-tycr {
	background-image: url('../images/sport_07.png');
}

.sport-list :hover.in-tycr {
	background-image: url('../images/sport_7.png');
}

.sport-list .out-tyim {
	background-image: url('../images/sport_08.png');
}

.sport-list :hover.in-tyim {
	background-image: url('../images/sport_8.png');
}

.sport-list .out-tybbin {
	background-image: url('../images/sport_010.png');
}

.sport-list :hover .in-tybbin {
	background-image: url('../images/sport_10.png');
}

.sport-list .out-tyxb {
	background-image: url('../images/sport_09.png');
}

.sport-list :hover.in-tyxb {
	background-image: url('../images/sport_9.png');
}

.sport-list .out-tyxj_sport {
	background-image: url('../images/sport_tyxj_188_0.png');
}

.sport-list :hover.in-tyxj_sport {
	background-image: url('../images/sport_tyxj_188.png');
}