/* 头部样式 */
.header {
	height: 64px;
	position: fixed;
	background: #fff;
	z-index: 9;
	width: 100%;
	left: 0;
	top: 0;
}

.header-flex {
	height: 64px;
}

.container {
	width:80%;
	max-width: 1200px;
	min-width:600px;
	margin: 0 auto;
}

.container img{
	max-width: 900px;
	display: block;
	margin: 0 auto; /* 居中图片 */
}

.header-flex .logobox .logo {
	width: auto;
	height: 50px;
}

.header-flex .nav .nav-li {
	margin: 0 5px;
	height: 64px;
	line-height: 64px;
	font-size: 14px;
}

.header-flex .nav .nav-li>a {
	transition: all 0.4s;
	font-size: 14px;
}


#searchbtn img {
    margin-left: 10px;
    margin-top: 14px;
    height: 24px;
    width: 24px;
}

.header-flex .nav .nav-li a .downicon {
	color: #333;
	transition: all .5s;
}

.header-flex .nav .nav-li:hover>a {
	color: #3370CC;
}

.header-flex .nav .nav-li:hover a .downicon {
	transform: rotate(-180deg);
}

.header-flex .nav .show-nav-list .nav-li-list {
	visibility: visible;
	top: 100%;
	opacity: 1;
}

.nav-li-list {
	/* min-width: 150px; */
	/* max-height: 200px; */
	overflow: hidden;
	transition: all .3s;
	visibility: hidden;
	box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, .03);
	border-radius: 0 0 8px 8px;
	opacity: 0;
	top: 150%;
	left: -15px;
	z-index: 100;
	background-color: #fff;
	border: 1px solid #f0f0f0;
	display: block;
}

.nav-li-list .nav-li-list-item {
	border-bottom: 1px solid #bdbdbe;
	text-align: center;
}

.nav-li-list .nav-li-list-item:last-child {
	border-right: none;
}

.nav-li-list .nav-li-list-item a {
	display: block;
	width: 150px;
	line-height: 48px;
	font-size: 15px;
	padding-left: 15px;
	padding-right: 15px;
	cursor: pointer;
	position: relative;
	color: #2e2e2e;
}

.nav-li-list .nav-li-list-item a:after {
	position: absolute;
	width: 0;
	left: 0;
	top: 0;
	bottom: 0;
	transition: width .3s;
	z-index: -1;
	background-color: #57c2f3;
	content: " ";
}

.nav-li-list .nav-li-list-item a:hover:after {
	width: 100%;
}


.header-flex .user {
	font-size: 14px;
	line-height: 2;
	width: 400px;

}

.loginbtn span {
	color: #017AFF;
	transition: all .4s;
	font-size: 24px;
	line-height: 51px;
}



.search-box-container {
	display: none;
	z-index: 1011;
	position: fixed;
	padding: 0px;
	margin: 0px 0px 0px -360px;
	width: 720px;
	top: 30%;
	left: 50%;
	text-align: center;
	color: rgb(0, 0, 0);
	border: 3px solid rgb(170, 170, 170);
	background-color: rgb(255, 255, 255);
	cursor: auto;
	height: 180px
}

.search-box_top {
	padding: 26px 24px 5px 24px;
	font-size: 18px;
	font-weight: 500;
	line-height: 24px;
	text-align: left;

}

.search-box_input {
	height: 80px;
	box-sizing: border-box;
	padding: 0 24px;
	overflow-y: auto;
	font-size: 15px;
	line-height: 1.5;
	color: rgba(0, 0, 0, .7);
}

.search-box_input input {
	border-width: 1px;
	border-style: solid;
	padding: 15px;
	background: #f2f2f2;
	width: 100%;
	text-indent: 6px;
	box-sizing: border-box;
	margin-top: 5px;
	border-radius: 0;
	outline: 0;
	border-color: #ececec;
}

.search-box_btn {
	padding: 0 20px;
	text-align: right;
	box-sizing: border-box;
}

.search-box_btn button {
	min-width: 64px;
	display: inline-block;
	height: 36px;
	padding: 0 16px;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	border-radius: 2px;
	background: transparent;
	border: 0;
	font-size: 14px;
}

.UserInfo {
	margin-left: 3;
	float: right;
	right: 20px;
	height: auto;
}

.UserInfo .Menu {
	width: 60px;
	height: auto;
	float: left;
}

.UserInfo img {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	cursor: pointer;
}

.UserInfo p {
	float: left;
	line-height: 54px;
	font-size: 15px;
	font-family: fantasy;
}



.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

.dropdown-content a {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}

.dropdown-content a:hover {
	background-color: #ddd;
}

.show {
	display: block;
}
.Gold{
	margin-left: 15px;
	margin-top: 14px;
	width: 70px;
    float: left;
}
.Ponits{
	
	margin-top: 13px;
	width: 65px;
    float: left;
}
.Gold img {
	width: 24px;
    height: 24px;
	float: left;
}
.Ponits img{
	width: 26px;
    height: 25px;
	float: left;
}
.Ponits p{
	line-height: 0;
	margin-left: 7px;
	margin-top: 12px;
}
.Gold p {
	line-height: 0;
	margin-left: 7px;
	margin-top: 10px;
}
.f-no-b-center{
	justify-content: space-around;
}
.ReCharge {
	margin-left: 15px;
	margin-top: 14px;

    float: left;
}
.ReCharge img{
	width: 24px;
    height: 24px;
	float: left;
	cursor: pointer;
}
/* 基本样式 */
.UserInfo_Menu {
	/* display: none; */
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid #ccc;
    border-radius: 4px;
    z-index: 10;
}

/* 单个菜单项 */
.UserInfo_Menu li {
    display: block;
    padding: 10px;
}

/* 链接样式 */
.UserInfo_Menu a {
    text-decoration: none;
    color: #333;
    display: block;
   
    transition: background-color 0.3s;
}

.UserInfo_Menu :hover {
    background-color: #f2f2f2;
}

/* 分割线样式 */
.UserInfo_Menu li.LgOut {
    border-top: 1px solid #ccc;
}

/* 注销按钮样式 */
.UserInfo_Menu li.LgOut span {
    display: block;
   
    cursor: pointer;
}

.UserInfo_Menu li.LgOut:hover {
     background-color: #f2f2f2;
}
.UsersInfo{
	    margin-top: 15px;
	    font-size: 14px;
	    transition: all 0.4s;
	    color: #333;
}