* {
	margin: 0;
	padding: 0;
	font-family: Proxima Nova, helvetica neue, helvetica, arial, sans-serif;
}

html,
body {
	width: 100%;
	font-size: 14.5px;
}

.pubw {
	min-width: 55rem;
	max-width: 55rem;
	margin: auto;
}

.line_border_bottom {
	height: 1px;
	margin-bottom: 0.75rem;
	background: url(./borderb.png) repeat-x;
}

.nativea {
	text-decoration: underline;
	color: #989898;
}

.colorW_textC {
	color: #FFF;
	text-align: center;
}

.loading {
	position: fixed;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.6);
	width: 100%;
	height: 100%;
	z-index: 99999;
}

.navbar-toggle {
	position: relative;
	float: right;
	padding: 0.5rem 0.5rem;
	margin-top: 0.4rem;
	margin-right: 0.75rem;
	margin-bottom: 0.4rem;
	background-color: transparent;
	background-image: none;
	border: 1px solid transparent;
	border-radius: 0.4rem;
	/* background: #11257b;*/
	display: none;
}

.navbar-toggle:focus {
	outline: 0;
}

.navbar-toggle .icon-bar {
	display: block;
	width: 1.8rem;
	height: 0.2rem;
	border-radius: 10px;
	background-color: #fff;
	margin-top: 0.3rem;
	margin-bottom: 0.3rem;
}

.dn {
	display: none;
}

ul>li {
	list-style-type: none;
}

a {
	color: #FFF;
	text-decoration: none;
}

.navs {
	width: 55rem;
	margin: auto;
	height: 3.75rem;
	position: absolute;
	left: 0;
	right: 0;
	top: 2.5rem;
	z-index: 9999;
	font-size: 1rem;
}

.navs .icon {
	width: 30rem;
	height: 100%;
	float: left;
}

.navs .icon img {
	height: 100%;
	float: left;
}

.navs .icon .line {
	float: left;
	width: 1px;
	height: 90%;
	background-color: white;
	margin: 3px 15px;
}

.navs .icon .text {
	float: left;
	padding: 20px 0px;
	font-family: Arial;
	font-size: 18px;
	color: #eee;
}

.navs .right {
	float: right;
	display: block;
}

.navs .right li {
	padding: 0 1rem;
	text-align: center;
	float: left;
	line-height: 5.2rem;
	color: #FFF;
	list-style-type: none;
	cursor: pointer;
	margin-right: 0.5rem;
	font-size: 1.2rem;
}

.navs .right a {
	display: block;
	width: 100%;
	height: 100%;
}

.navs .right li:hover {
	border-bottom: 0.6rem solid #7ad2ff;
}

.navactive {
	border-bottom: 0.6rem solid #7ad2ff;
}



/* ------------------------------------- */
.med {
	min-width: 55rem;
	background: url(./BJ.png);
	overflow: hidden;
	position: relative;
}

.headBg {
	background: url(./bg.png) no-repeat;
	background-size: 100% 8.9rem;
}

.index {
	height: 70rem;
}

.medBox {
	position: relative;
}

.pokerbg {
	width: rem;
	height: 66rem;
	background-size: 100% 100%;
	position: absolute;
	left: 27rem;
	top: 14rem;
	opacity: 0;
	-webkit-animation: friendimg 2s 1 forwards;
	/*Safari and Chrome*/
	-ms-animation: friendimg 2s 1 forwards;
	/*ie*/
	animation: friendimg 2s 1 forwards;

}

.med .anileft {
	height: 60rem;
	width: 24rem;
	position: absolute;
	top: 18rem;
	left: 2.8rem;
}

.anileft .friend {
	width: 100%;
	position: relative;
	left: -15rem;
	opacity: 0;
	-webkit-animation: friendpc 0.8s 1 forwards;
	/*Safari and Chrome*/
	-ms-animation: friendpc 0.8s 1 forwards;
	/*ie*/
	animation: friendpc 0.8s 1 forwards;
}

.friend img {
	width: 100%;
	opacity: 0;
	-webkit-animation: friendimg 1.3s 1 forwards;
	/*Safari and Chrome*/
	-ms-animation: friendimg 1.3s 1 forwards;
	/*ie*/
	animation: friendimg 1.3s 1 forwards;
}

.anileft .play {
	width: 80%;
	height: 3.75rem;
	background: url(./playpoker.png) no-repeat;
	background-size: 100% auto;
	position: relative;
	left: -15rem;
	opacity: 0;
	-webkit-animation: friendpc 1s 1 forwards;
	/*Safari and Chrome*/
	-ms-animation: friendpc 1s 1 forwards;
	/*ie*/
	animation: friendpc 1s 1 forwards;
}

.anileft .download {
	/* padding-top: 5rem; */
	width: 100%;
	/* height: 3.25rem; */
	position: relative;
	left: -15rem;
	opacity: 0;
	text-align: center;
	-webkit-animation: downloadpc 1.2s 1 forwards;
	/*Safari and Chrome*/
	-ms-animation: downloadpc 1.2s 1 forwards;
	/*ie*/
	animation: downloadpc 1.2s 1 forwards;
}

.anileft .download li {
	padding-top: 15px;
	clear: both;
	width: 20rem;
	height: 3.7rem;
	margin-right: 0.6rem;
	margin-bottom: 0.6rem;
	display: inline-block;
	position: relative;
}

.anileft .download a {
	display: block;
	width: 9.5rem;
	height: 100%;
}

.pc {
	background: url(./pcdownload.png) no-repeat;
	background-size: 100% 100%;
}

.ios {
	background: url(./ios.png) no-repeat;
	background-size: 100% 100%;
}

.android {
	background: url(./android.png) no-repeat;
	background-size: 100% 100%;
}

.google {
	background: url(./google.png) no-repeat;
	background-size: 100% 100%;
}

.med .aniright {
	width: 40rem;
	height: 60rem;
	background: url(./mobile.png) no-repeat;
	background-size: 100% auto;
	position: absolute;
	top: 15rem;
	right: -20rem;
	-webkit-animation: phonepc 1s 1 forwards;
	/*Safari and Chrome*/
	-ms-animation: phonepc 1s 1 forwards;
	/*Safari and Chrome*/
	animation: phonepc 1s 1 forwards;
	/*Safari and Chrome*/
}

.orderMed {
	position: relative;
	background: #f7f7f7;
	margin-top: 8.9rem;

}

.user123 {
	width: 20rem;
	height: 3.3rem;
	line-height: 2.2rem;
	background: #ffffff;
	padding: 0 1rem;
	border: 0.1rem solid #0fd2fe;
	border-radius: 3.2rem;
	outline: none;
	font-size: 1.4rem;
}

:-moz-placeholder {
	/* Mozilla Firefox 4 to 18 */
	color: #9dbbcf;
	opacity: 1;
}

::-moz-placeholder {
	/* Mozilla Firefox 19+ */
	color: #9dbbcf;
	opacity: 1;
}

input:-ms-input-placeholder {
	color: #9dbbcf;
	opacity: 1;
	text-align: center;
}

input::-webkit-input-placeholder {
	color: #9dbbcf;
	opacity: 1;
	text-align: center;
}

.checkUserinfo {
	position: absolute;
	width: 11.45rem;
	height: 5.45rem;
	line-height: 4.8rem;
	background: url(./btnBg.png) no-repeat;
	background-size: 100% 100%;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	cursor: pointer;
	font-size: 1.2rem;
	top: -0.65rem;
	left: 22.15rem;
}

.userinfo {
	position: absolute;
	width: 20.05rem;
	height: 4.25rem;
	background: url(./userBg.png) no-repeat;
	background-size: 100% 100%;
	top: -0.45rem;
	right: 0;
}

.userinfo img {
	width: 3.3rem;
	height: 3.3rem;
	border-radius: 3rem;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	left: 2rem;
}

.userinfo p {
	margin-left: 6.05rem;
	line-height: 4.25rem;
	color: #FFF;
	word-break: keep-all;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: 1.4rem;
}

.shopBox {
	overflow: hidden;
}

.shoplist li {
	cursor: pointer;
	background: url(./shopbg1.png) no-repeat;
	background-size: 100% 100%;
	width: 12.85rem;
	height: 7.1rem;
	float: left;
	margin-right: 0.3rem;
	border-radius: 0.15rem;
	text-align: center;
	margin-bottom: 0.5rem;
}

.userOrder_userinfo {
	position: relative;
}

.shoplist p {
	text-align: center;
	line-height: 3rem;
	font-size: 1.5rem;

}

.shoplist .diamonds {
	border-bottom: 0.1rem solid #e4ecf2;
	color: #5d8ea5;
	margin: 0 1.25rem;
}

.shoplist .diamonds img {
	position: relative;
	top: 0.7rem;
	width: 3.1rem;
	height: 2.6rem;
}

.shoplist .amound {
	color: #ed9e24;
	font-size: 1.5rem;
	font-weight: 400;
}

.shoplist .active {
	background: url(./shopbg.png) no-repeat;
	background-size: 100% 100%;
}

.confirmbtn {
	width: 14.65rem;
	height: 5.45rem;
	line-height: 4.7rem;
	background: url(./btnBg.png) no-repeat;
	background-size: 100% 100%;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	margin-left: -1rem;
	cursor: pointer;
	font-size: 1.2rem;
	margin-bottom: 10rem;
}

.errtips {
	color: red;
}

.tips {
	color: #FFF;
}

/* 订单页 */
.step2 {
	padding: 0.5rem 1rem;
	box-sizing: border-box;
}

.step2 .headimg {
	width: 4.4rem;
	height: 4.4rem;
	border-radius: 2.5rem;
	float: right;
	margin-right: 7.5rem;
}

.step2 .userOrder_userinfo p span {
	color: #FFF;
}

.titleBox {
	color: #2a588d;
	font-size: 1.1rem;
	font-weight: bold;
	line-height: 2.75rem;
	margin-top: 1.7rem;
	-webkit-border-image: url(./borderb.png) 30 30 round;
	/* Safari 5 */
	-ms-border-image: url(./borderb.png) 30 30 round;
	/* ie */
	-o-border-image: url(./borderb.png) 30 30 round;
	/* Opera */
	border-image: url(./borderb.png) 30 30 round;
}

.noboder {
	border: 0;
}

.payment_list {
	margin-bottom: 2.1rem;
	overflow: hidden;
}

.payment_list li {
	float: left;
	margin-right: 0.5rem;
	background: url(./shopbg1.png) no-repeat;
	background-size: 100% 100%;
	padding: 0.25rem 0.5rem;
	border-radius: 0.15rem;
	cursor: pointer;
	width: 9.1rem;
	height: 3.3rem;
	position: relative;
}

.payment_list img {
	width: 90%;
	height: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.payment_list .active {
	background: url(./shopBg.png) no-repeat;
	background-size: 100% 100%;
}

.footer {
	min-width: 55rem;
	/* padding-top: 1rem; */
	font-size: 1rem;
	/* min-height: 6.7rem; */
	background: #003c67;
	text-align: center;
	color: #8fbcdb;
	/* padding-bottom: 3rem; */
}

.footer a {
	color: #8fbcdb;
}

.footer li {
	padding-top: 0.5rem;
}

.med2 {
	background: #0779c8;
	display: inline-block;
	vertical-align: middle;
	width: 100%;
}

.med2 img {
	width: 50%;
}

#img1 {
	margin-top: 3rem;
}

@media (max-width: 767px) {

	html,
	body {
		width: 100%;
		font-size: 20px;
	}

	body {
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
		/*这一句是用来解决在安卓上的点击出现篮框问题*/
		-webkit-text-size-adjust: 100% !important;
		/**禁止ios字体放大*/
	}

	.navs .icon {
		margin-left: 1rem;
		width: 80%;
	}

	.payment_list li {
		width: 12.2rem;
		height: 4.4rem;
	}

	.pubw {
		width: 100%;
		margin: auto;
		min-width: 0;
	}

	.navbar-toggle {
		display: block;
	}

	.navs {
		width: auto;
		top: 1.3rem;
	}

	.navactive {
		border-bottom: 0.25rem solid #8891ff;
	}

	.navs .right li:hover {
		/*border-bottom: 0.25rem solid #8891ff;*/
	}

	.navs .right {
		position: absolute;
		width: 100%;
		top: 4.5rem;
		left: 0;
		background: url(./bigBg.jpg);
		float: none;
		display: none;
	}

	.navs .right li {
		float: none;
		margin-right: 0;
	}

	.mobile_li {
		display: block;
	}

	.orderMed {
		margin-top: 6.05rem;
	}

	.mobile {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
	}

	.navs .mobile li {
		display: block;
		float: none;
		margin-right: 0;
	}

	.med {
		width: 100%;
		/* min-width:640px; */
		min-width: 100%;
	}

	.headBg {
		background-size: auto 121px;
	}

	.med .anileft {
		height: 60rem;
		width: 28rem;
		position: absolute;
		top: 6rem;
		left: 0;
		right: 0;
		margin: auto;
	}

	.pokerbg {
		top: 18rem;
		-webkit-animation: friendimg 2s 1 forwards;
		/*Safari and Chrome*/
		-ms-animation: friendimg 2s 1 forwards;
		/*ie*/
		animation: friendimg 2s 1 forwards;
		left: 5rem;
		width: 40rem;
		height: 66rem;
	}

	.anileft .friend {
		width: 50%;
		background-size: 100% 100%;
		left: 0;
		right: 0;
		margin: auto;
		-webkit-animation: downloadpc 0.8s 1 forwards;
		/*Safari and Chrome*/
		-ms-animation: downloadpc 0.8s 1 forwards;
		/*ie*/
		animation: downloadpc 0.8s 1 forwards;
	}

	.friend img {
		width: 100%;
		height: 100%;
		opacity: 0;
		-webkit-animation: friendimg 1.3s 1 forwards;
		/*Safari and Chrome*/
		-ms-animation: friendimg 1.3s 1 forwards;
		/*ie*/
		animation: friendimg 1.3s 1 forwards;
	}

	.anileft .play {
		width: 60%;
		height: 2.8rem;
		background-size: 100% 100%;
		left: 0;
		right: 0;
		margin: auto;
	}

	.anileft .download {
		/* width: 70%; */
		/* height: 4.3rem; */
		opacity: 1;
		position: absolute;
		top: 7rem;
		left: 0;
		right: 0;
		margin: auto;
	}

	.anileft .download li {
		width: 30%;
		padding: 0 10px;
		height: 4.3rem;
	}

	.pubw {
		width: 100%;
	}

	.med .aniright {
		width: 35rem;
		height: 60rem;
		background: url(./mobile.png) no-repeat;
		background-size: 100% auto;
		position: absolute;
		top: 16rem;
		left: 50%;
		transform: translate(-50%, 0);
		margin: auto;
		animation: phone 1s 1 forwards;
		-webkit-animation: phone 1s 1 forwards;
		/*Safari and Chrome*/
		-ms-animation: phone 1s 1 forwards;
		/*ie*/
	}

	.shopbox {
		left: 0;
		right: 0;
		margin: auto;
		width: 90%;
	}

	.shoplist li {
		width: 14rem;
		margin-bottom: 0.5rem;
	}

	.user123 {
		width: 93%;
	}

	.userinfo {
		width: 19rem;
		left: 10.9rem;
		top: 3.75rem;
	}

	.checkUserinfo {
		position: relative;
		top: 0;
		left: 0;
	}

	.userinfo {
		margin-left: 0;
	}

	.confirmbtn {
		width: 22rem;
		margin: auto;
		height: 8rem;
		line-height: 7rem;
	}

	.footer {
		/* min-width: 640px; */
		min-width: 100%;
	}

	.anileft .download .ios_phone {
		display: block;
		margin: auto;
	}

	.index {
		/* height: 75rem; */
	}

	#img1 {
		margin-top: 2rem;
	}


	.med img {
		width: 100%;
	}

	.med2 img {
		width: 100%;
	}

}

/**
 * 移动端动画
 */
@-webkit-keyframes phone {
	from {
		right: -23rem;
		opacity: 0;
	}

	to {
		right: 0;
		opacity: 1;
	}
}

@keyframes phone {
	from {
		right: -23rem;
		opacity: 0;
	}

	to {
		right: 0;
		opacity: 1;
	}
}

@-webkit-keyframes friend {
	from {
		left: -10rem;
		opacity: 0;
	}

	to {
		left: 2.5rem;
		opacity: 1;
	}
}

@keyframes friend {
	from {
		left: -10rem;
		opacity: 0;
	}

	to {
		left: 2.5rem;
		opacity: 1;
	}
}

/* pc版动画 */
@-webkit-keyframes phonepc {
	from {
		right: -23rem;
		opacity: 0;
	}

	to {
		right: -3rem;
		opacity: 1;
	}
}

@keyframes phonepc {
	from {
		right: -23rem;
		opacity: 0;
	}

	to {
		right: -3rem;
		opacity: 1;
	}
}

@-webkit-keyframes friendpc {
	from {
		left: -10rem;
		opacity: 0;
	}

	to {
		left: -5rem;
		opacity: 1;
	}
}

@keyframes friendpc {
	from {
		left: -10rem;
		opacity: 0;
	}

	to {
		left: -5rem;
		opacity: 1;
	}
}

@keyframes downloadpc {
	from {
		left: -10rem;
		opacity: 0;
	}

	to {
		left: 0rem;
		opacity: 1;
	}
}

@-webkit-keyframes downloadpc {
	from {
		left: -10rem;
		opacity: 0;
	}

	to {
		left: 0rem;
		opacity: 1;
	}
}

@-webkit-keyframes friendimg {
	from {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

@keyframes friendimg {
	from {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

.loading div {
	height: 1rem;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	font-size: 1.5rem;
}

dot {
	display: inline-block;
	height: 1em;
	line-height: 1;
	text-align: left;
	vertical-align: -.25em;
	overflow: hidden;
}

dot::before {
	display: block;
	content: '...\A..\A.';
	white-space: pre-wrap;
	/* 也可以是white-space: pre */
	animation: dot 1s infinite step-start both;
	-webkit-animation: dot 1s infinite step-start both;
	-ms-animation: dot 1s infinite step-start both;
}

@keyframes dot {
	33% {
		transform: translateY(-2em);
	}

	66% {
		transform: translateY(-1em);
	}
}