/*去除默认样式*/

img {
	border: none;
	background: rgba(255, 255, 255, 0);
	box-shadow: none;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	display: inline-block;
}

a,
button,
input,
label {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	outline: none;
}

ul {
	list-style: none;
}

a {
	text-decoration: none;
	outline: none
}
input[type=button],
input[type=submit],
input[type=file],
button {
	cursor: pointer;
	-webkit-appearance: none;
}

input,
label {
	border: none;
	border-radius: 0;
	background-color: rgba(0, 0, 0, 0);
	-webkit-border-radius: 0;
	-webkit-border: none;
	outline: none;
}

textarea {
	outline: none;
	resize: none;
	appearance: none;
	border: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	-webkit-border: none;
	-webkit-appearance: none;
	text-align: center;
}

input::placeholder,
textarea::placeholder {
	color: #999999;
}

select {
	height: 50px;
	font-size: 14px;
	border: none;
	outline: none;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	padding-right: 26px;
	background-color: rgba(0, 0, 0, 0);
	background-image: url(../img/down.png);
	background-repeat: no-repeat;
	background-size: 16px 16px;
	background-position: right center;
}
	/*如果要加入自定义图片， 就增加这个属性 background: url或者在html中直接加入图标也行*/
option{
	 /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
	border: none;
	outline: none;
	/*很关键：将默认的select选择框样式清除*/
	appearance:none;
	-moz-appearance:none;
	-webkit-appearance:none;
	/*将背景改为红色*/
	background:#fff;
	/*加padding防止文字覆盖*/
	padding-right: .14rem;
}

.cl_w {
	color: #FFFFFF;
}

.cl_gr {
	color: #7FA256;
}

.cl_g1 {
	color: #999999;
}

.cl_g2 {
	color: #666666;
}

.cl_g3 {
	color: #B9C6B9;
}

.cl_b {
	color: #353535;
}

.bg_bl {
	background-color: #333333;
}

.bg_wt {
	background-color: #FFFFFF;
}

.bg_gr {
	background-color: #7FA256;
}

.bj-yj {
	margin: 0px 20px;
	border-radius: 16px;
	box-shadow: 0px 0px 10px rgba(85, 85, 85, 0.07);
}
.bj-yj02 {
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgba(85, 85, 85, 0.07);
}

.box {
	overflow: auto;
	margin-top: -10px;
}
.mg-top{margin-top: 10px;}
.mg-bottom {
	margin-bottom: 10px;
}
.mg-btm{
	margin-bottom: 13px;
}

.ViewBtn {
	padding:0px 8px;
	min-width: 75px;
	height:1.375rem;
	line-height: 1.375rem;
	border-radius: 24px;
	font-size: 0.75rem;
	font-weight: 500;
	background-color: #C7D4B8;
	display: flex;
	flex-wrap:nowrap;
	justify-content:center;
	align-items:center;
	display: -webkit-flex;  /* 新版本语法: Chrome 21+ */
	display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
	display: -moz-box; /* Firefox 17- */
	display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
	display: -moz-flex; /* Firefox 18+ */
	display: -ms-flexbox; /* IE 10 */
	align-items: center;
	-webkit-align-items:center;
	-moz-align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	justify-content:center;
	-webkit-justify-content:center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;
}

input.no {
	padding: 0px 5px;
	min-width: 75px;
	height: 24px;
	border-radius: 24px;
	font-size: 13px;
	font-weight: 500;
	background-color: #DDDDDD;
}


/*------sign-in------*/

.nav-top {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 50px;
	text-align: center;
	padding: 0px 20px;
	box-sizing: border-box;
	overflow: hidden;
	z-index: 8;
}
.nav-top .left{
	position: absolute;
	top: 0px;
	left:0px;
	width: 50px;
	text-align:center;
	height: 50px;
	line-height: 50px;
	text-align: left;
}
.nav-top .left img{
	width:10px;
	margin-top:17px;
	position:relative;
	left:20px;
}
.nav-top .ct {
	font-size: 19px;
	font-weight: 500;
}

.nav-top .right {
	position: absolute;
	top: 0px;
	right: 20px;
	width: 50px;
	height: 50px;
	text-align: right;
}
.nav-top .right2 {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	text-align: right;
}

.msg{
	position: absolute;
	right: -10px;
	top: 5px;
	width:0px;
	height:0px;
	padding:10px;
	font-size:12px;
	text-align:center;
	align-self:center;
	border-radius:50%;
	display: flex;
	display: -webkit-flex;  /* 新版本语法: Chrome 21+ */
	display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
	display: -moz-box; /* Firefox 17- */
	display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
	display: -moz-flex; /* Firefox 18+ */
	display: -ms-flexbox; /* IE 10 */
	align-items: center;
	-webkit-align-items:center;
	-moz-align-items: center;
	-ms-align-items: center;
	-o-align-items: center;
	justify-content:center;
	-webkit-justify-content:center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	-o-justify-content: center;

}

.nav-top .right img {
	height: 16px;
	width: 16px;
	margin-top: 17px;
}
.nav-top .right2 img {
	height: 16px;
	width: 16px;
	margin-top: 17px;
}

.banner {
	position: relative;
	padding-bottom: 30px;
}

.swiper-slide>a>img {
	width: 100%;
}

.banner .swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
	bottom: 45px;
}

.sg-top {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	position: absolute;
	bottom: 5px;
	left: 0px;
	height: 20px;
	line-height: 20px;
	width: calc(100% - 40px);
	text-align: center;
	padding: 15px 0px;
	overflow: hidden;
	z-index: 2;
}

.sg-top>.left,
.sg-top>.right {
	align-self: center;
}

.sg-top>.left {
	flex-grow: 1;
	flex-shrink: 1;
	padding: 0px 20px;
	font-size: 20px;
	font-weight: 400;
	border-right: dotted 2px rgba(0, 0, 0, 0.4);
}

.sg-top>.right {
	flex-grow: 2;
	flex-shrink: 2;
	padding-left: 20px;
	padding-right: 30px;
	margin-right: 20px;
	font-size: 14px;
	font-weight: 400;
	background-image: url(../img/left.png);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: 14px 7px;
}

.My-box {
	text-align: center;
	padding-bottom: 13px;
	overflow: hidden;
}

.matop13{
	margin-top: 13px;
}
.matop5{
	margin-top: 5px;
}
.My-box .top>img {
	width: 26%;
}

.My-box .ct {
	position: relative;
	overflow: hidden;
}

.maBox{
	width:50%;display:inline-block;padding-bottom:50%;height:0;position: relative;
	text-align: center;
}
.My-box .ct .maimg {
	width: 100%;
}
.loading {
	width: 2rem;
	height: 2rem;
	position: absolute;
	top:8.59rem;
	left:calc(50% - 1rem);
}
.loading2{
	width: 2rem;
	height: 2rem;
	position: absolute;
	top:calc(50% - 1rem);
	left:calc(50% - 1rem);
}
.My-box .ct>.right {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -25px;
	margin-left: 25px;
	width: 50%;
	height: 50px;
	line-height: 50px;
	font-size: 13px;
	transform: rotate(90deg);
}

.My-box .dow {
	font-size: 20px;
	font-weight: 500;
}

.hx-box {
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	height: 53px;
	overflow: hidden;
}

.hx-box::before {
	content: "";
	position: absolute;
	top: -26px;
	left: -60px;
	width: 100px;
	height: 106px;
	background: #C7D4B8;
	opacity: 0.2;
	border-radius: 80px;
}

.hx-box>div {
	align-self: center;
	overflow: hidden;
}

.hx-box>.left>img {
	margin-left: 20px;
	width: 35px;
}
.hx-box>.ct {
	flex-grow: 2;
	padding-left: 13px;
}
.hx-box>.ct>.top {
	font-size: 16px;
	font-weight: 500;
}
.hx-box>.ct>.bow {
	font-size: 11px;
}

.hx-box>.right {
	align-self: flex-end;
}

.hx-box>.right>a {
	display: block;
	width: 33px;
	height: 53px;
	line-height: 53px;
	padding-right: 20px;
	text-align: right;
}

.hx-box>.right>a>img {
	width: 14px;
	height: 7px;
}


/*-------Rewards------*/

.Rwd-text {
	text-align: center;
}

.Rwd-text>.top {
	margin-top: 72px;
	font-size: 21px;
	font-weight: 500;
}

.Rwd-text>.bow {
	margin-top: 16px;
	font-size: 15px;
}

.bei {
	position: relative;
	margin-top: 25px;
	margin-left: auto;
	margin-right: auto;
	width: 250px;
	height: 348px;
	text-align: center;
	background-image: url(../img/bei-wt.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	overflow: hidden;
}

.bei>.top {
	margin-top: 124px;
}

.bei>.top>img {
	height: 55px;
}

.bei>.ct {
	margin-top: 10px;
}

.bei>.ct>ul {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	margin-bottom: 8px;
	margin-left: 45px;
	margin-right: 45px;
}

.bei>.ct>ul:nth-of-type(2) {
	margin-left: 55px;
	margin-right: 55px;
}

.bei>.ct>ul:last-of-type {
	margin-left: 65px;
	margin-right: 65px;
}

.bei>.ct>ul>li>svg {
	width: 31px;
	height: 26px;
}

.bei>.ct>ul>li>svg>image {
	width: 31px;
	height: 26px;
}

.bei>.ct>ul>li>.off {
	display: none;
}

.bei>.ct>ul>li.act>.no {
	display: none;
}

.bei>.ct>ul>li.act>.off {
	display: block;
}

.bei>.bow {
	margin-top: 16px;
}

.bei>.bow>img {
	height: 11px;
}

.hx-box-02 {
	margin-top: 10px;
}

.hx-box-02>a {
	display: block;
	width: 100%;
	height: 53px;
}

.hx-box-02>a>div {
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	height: 100%;
	overflow: hidden;
}

.hx-box-02>a>div>div {
	align-self: center;
	overflow: hidden;
}

.hx-box-02>a>div>.left {
	height: 34px;
	line-height: 34px;
	font-size: 15px;
	font-weight: 500;
	margin-right: 13px;
}

.hx-box-02>a>div>.right {
	width: 24px;
	height: 34px;
	line-height: 40px;
	text-align: center;
	font-size: 15px;
	font-weight: 500;
	background-image: url(../img/bei-b.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100%;
}

/*-------rewads-list--------*/

.Rwd-list {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	height: 76px;
	border-radius:16px;
	background: #FFFFFF;
}

.Rwd-list>div {
	align-self: center;
}

.Rwd-list>.left {
	margin-left: 10px;
	height: 60px;
	width: 60px;
	text-align: center;
	border-radius: 60px;
	background-color: #C7D4B8;
}

.Rwd-list>.left>img {
	height: 100%;
}

.Rwd-list>.ct {
	flex-grow: 2;
	position: relative;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	height: 100%;
	margin-left: 10px;
}

/* .Rwd-list>.ct::before,
.Rwd-list>.ct::after {
	content: "";
	position: absolute;
	right: -8px;
	width: 16px;
	height: 16px;
	background: #F2F2F2;
	border-radius: 80px;
	z-index: 3;
}

.Rwd-list>.ct::before {
	top: -8px;
}

.Rwd-list>.ct::after {
	bottom: -8px;
} */

.PseudoClass1::before{
	content: "";
	position: absolute;
	right: -8px;
	width: 16px;
	height: 16px;
	background: #F2F2F2;
	border-radius: 80px;
	z-index: 3;
}
.PseudoClass2::after {
	content: "";
	position: absolute;
	right: -8px;
	width: 16px;
	height: 16px;
	background: #F2F2F2;
	border-radius: 80px;
	z-index: 3;
}

.PseudoClass1::before {
	top: -8px;
}

.PseudoClass2::after {
	bottom: -8px;
}


/*.Rwd-list>.ct>.top {*/
/*	font-size: 17px;*/
/*	font-weight: 500;*/
/*}*/

.Rwd-list>.ct>.bow {
	margin-top: 3px;
	font-size: 11px;
}

.Rwd-list>.right {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	padding-left: 10px;
	margin-right: 10px;
	height: 100%;
	border-left: dotted 1px #DDDDDD;
	overflow: hidden;
}

.Rwd-list>.right {
	padding-left:10px;
	margin-right:10px;
	height:100%;
}

.Rwd-list>.right>.time {
	margin-top: 5px;
	font-size: 11px;
	text-align: center;
}

.altbox {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	overflow: hidden;
	z-index: 9;
}

.alt {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -174px;
	margin-left: -146px;
	width: 292px;
	text-align: center;
	background-image: url(../img/alt-bj.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	overflow: hidden;
}

.alt>.top {
	margin-top: 18px;
	font-size: 17px;
	font-weight: 500;
}

.alt>.ewm {
	margin-top: 18px;
}

.alt>.ewm>img {
	width: 145px;
	height: 145px;
}

.alt>.time {
	margin-top: 13px;
	font-size: 13px;
}



.alt>.btn-box>a {
	display: inline-block;
	padding: 0px 5px;
	min-width: 92px;
	height: 28px;
	line-height: 28px;
	font-size: 15px;
	font-weight: 500;
	border-radius: 29px;
}

.alt>.btn-box>a.off {
	background-color: #C7D4B8;
}

.alt>.btn-box>a.no {
	background-color: #DDDDDD;
}

.alt>.btn-box>.time {
	margin-top: 5px;
	font-size: 11px;
}

.alt>.dlt {
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -11px;
	width: 22px;
	height: 22px;
}

.alt>.dlt>.alt-dlt {
	width: 100%;
	height: 100%;
	background-image: url(../img/dlt.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 11px 11px;
}


/*------Social-------*/

.tab-nav {
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	padding: 0px 20px;
	height: 60px;
}

.tab-nav>div {
	align-self: center;
	margin-right: 40px;
}

.tab-nav>.name {
	font-size: 15px;
	font-weight: 500;
}

.tab-btn>input {
	width: 24px;
	height: 24px;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 100% auto;
}

.tab-btn>input.act {
	background-position: bottom center;
}

.tab-btn>.icon01 {
	background-image: url(../img/instagram-fill.png);
}

.tab-btn>.icon02 {
	background-image: url(../img/twitter.png);
}

.tab-btn>.icon03 {
	background-image: url(../img/facebook.png);
}


/*------Stores-------*/



.st-tabNav>li {
	display: inline-block;
	padding: 0px 20px;
	color: #999999;
}

.st-tabNav>li.act {
	color: #FFFFFF;
	background-image: url(../img/tab-act.png);
	background-position: center 86%;
	background-repeat: no-repeat;
	background-size: auto 2px;
}

.st-tab>div {
	display: none;
}

.st-tab>div.act {
	display: block;
}

.st-h>ul {
	padding: 0px 13px;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	overflow: hidden;
}

.st-h>ul>.name {
	width:90%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.locationName{
	width:90%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.st-h>.top {
	padding:0.81rem 0.81rem 0.5rem 0.81rem;
}

.st-h>.top>li:first-of-type {
	font-size: 15px;
}

.st-h>.top>li:last-of-type {
	font-size: 12px;
}

.st-h>.ct>li,
.st-h>.bow>li:first-of-type {
	font-size:0.75rem;
}

.st-h>.ct>li>span,
.st-h>.bow>li>span {
	color: #999999;
}

.st-h>.ct>li>img,
.st-h>.bow>li>img {
	margin-bottom: -2px;
	width: 12px;
	margin-right: 5px;
}

.st-h>.bow {
	padding-bottom: 13px;
}

.st-h>.bow>li:last-of-type {
	padding-left: 10px;
}

/*------store-details-------*/

.picture{
	overflow: hidden;
}
.picture>img{
	width: 100%;
	overflow: hidden;
}
.dtl-box{
	position: relative;
	margin-top: -24px;
	width: 100%;
	text-align: center;
	overflow: hidden;
	z-index: 2;
}
.dtl-box>.top{
	margin-top: 37px;
	font-size: 19px;
	font-weight: 500;
}
.dtl-box>.ct{
	margin-top: 20px;
	font-size: 11px;
	line-height: 14px;
}
.dtl-box>.bow{
	margin-top: 20px;
	font-size: 11px;
}
.btn-box{
	padding-top: 20px;
	padding-bottom: 10px;
	text-align: center;
	overflow: hidden;
}
.btn-box>li{
	display: inline-block;
	margin: 0px 20px;
	overflow: hidden;
}
.btn-box>li>a>img{
	width: 80px;
}
.btn-box>li>div{
	font-size: 14px;
}
.dtl-box02{
	width: 100%;
	margin-top: 13px;
	overflow: hidden;
}
.dtl-box02>.top{
	text-align: center;
	font-size: 17px;
	margin-top: 27px;
}
.dtl-box02>.dtl-list{
	margin-top: 27px;
	margin-bottom: 27px;
}
.dtl-box02>.dtl-list>ul{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	padding: 0px 20px;
	line-height: 30px;
	font-size: 13px;
	box-sizing: border-box;
}