@charset "utf-8";

@media screen and (max-width:768px){
	:root{
		--width:6rem;
		--fontSize:.26rem;
		--picWidth:2.2rem;
		--picTxtW:3.1rem;
		--fontSize2:.3rem;
		--fontSize3:.22rem;
		--fontSize4:.26rem;
		--twidth: 2.43rem;
		--khei:6rem;
	}
	.tipSure a {
		transform: scale(1.2);
	}
}
@media screen and (min-width:768px){
	:root{
		--width:4.03rem;
		--fontSize:.22rem;
		--picWidth:1.1rem;
		--picTxtW:2.4rem;
		--fontSize2:.26rem;
		--fontSize3:.18rem;
		--fontSize4:.2rem;
		--twidth: 3.24rem;
		--khei:4rem;
	}
}
.mask{width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 99; background: rgba(0,0,0,.8); display: none;}
.fix-bg{width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9; background: rgba(0,0,0,0); display: none;}
.tcbox{ width: var(--width); height: auto; display: block;  position: absolute; background: #fff;
    top: 50%;
    left: 50%;
    -webkit-transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    -webkit-border-radius: .3em;
    -moz-border-radius: .3rem;
    border-radius: .3rem;
}
.tcbox h3{
	font-size: .34rem; line-height: .84rem; font-weight: bold;color: #fff;
	width: 100%; clear: both; float: left; text-align: center; height: .84rem; position: relative;
	background: url('../images/tc-title01.png') no-repeat center top;
	background-size: 100%;
	border-radius: .3rem .3rem 0 0;
}
.tcbox h2{
	font-size: .34rem; line-height: .84rem; font-weight: bold;color: #fff;
	width: 100%; clear: both; float: left; text-align: center; height: .84rem; position: relative;
	background: #f8451c;
	background: linear-gradient(90deg,  #e12e05, #ff6f4e);
	background-size: 100%;
	border-radius: .3rem .3rem 0 0;
}


.tipSure{width: 100%; clear: both; float: left; text-align: center; margin: 0 auto .4rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
.tipSure a{
	width: 2.14rem; height: .6rem; display: block; margin: auto;
	font-size: .26rem; line-height: .6rem; color: #fff; font-weight: bold;

	/* background: #ff7508; */
	/* background: -webkit-linear-gradient(-90deg, #ff570d , #ffa800); !* Safari 5.1 - 6.0 *! */
	/* background: -o-linear-gradient(-90deg, #ff570d , #ffa800); !* Opera 11.1 - 12.0 *! */
	/* background: -moz-linear-gradient(-90deg, #ff570d , #ffa800); !* Firefox 3.6 - 15 *! */
	/* background: linear-gradient(-90deg, #ff570d , #ffa800); !* 标准的语法 *! */
	border-radius: .8rem;
	box-shadow: 0 .05rem .03rem rgba(255,163,185,.5);
	box-sizing: border-box;
}
.tipSure a.btn01{
	background: url("../images/tc-btn01.png") no-repeat center / 100%;
}
.tipSure a.btn02{
	width: 2.68rem; height: .59rem;
	background: url("../images/tc-btn02.png") no-repeat center / 100%;
}
.tipSure a.btn03{
	width: 1.92rem; height: .56rem;
	background: #f8451c;
	background: linear-gradient(90deg,#ff6f4e,#e12e05);
	font-size: .24rem; line-height: .56rem;
}
.tipSure a.btn04{
	width: 1.66rem; height: .56rem;
	background: #d7d7d7;
	font-size: .24rem; line-height: .56rem; color: #8e8e8e;
}
.tipSure a.btn05{
	width: 2.34rem; height: .56rem;
	background: #f8451c;
	background: linear-gradient(90deg,#ff6f4e,#e12e05);
	font-size: .24rem; line-height: .56rem;
}
.close{position: absolute; top: -.75rem; right:0; display: block; width: .56rem; height: .5rem;}
.close a{width: 100%; display: block;}
.close a img{width: 100%; display: block;}



/*温馨提示*/
/* #notePage{display: block} */
.noteTxt{
	width: 100%; clear: both; float: left;margin: .3rem auto .15rem;
	text-align: center;
}
.noteTxt img{width: 2.49rem; display: inline-block}
.noteTxt img.act{
	margin-bottom: .3rem;
}
.noteTxt p{
	font-size: var(--fontSize); line-height: 1.3;
	clear: both; float: left; width: 100%; margin-top: -.2rem;
	margin-bottom: .25rem;
}
.noteTxt p span{color: #ff4b00;}

/* 查看课程 */
/* #chosePage{display: block;} */
.choseTxt{
	width: 100%; clear: both; margin: .3rem auto .15rem;
}
.choseTxt ul{
	width: 100%; clear: both;margin-top: .3rem; float: left;
	text-align: center;
	display: flex;
	justify-content: center;
	align-content: flex-start;
	flex-wrap: wrap;
}
.choseTxt ul li{
	font-size: var(--fontSize3); line-height: .56rem;
	width: 2.43rem;
	background: #fff4d9;
	border-radius: .12rem;
	margin:0 .1rem .15rem;
	color: #333;
	cursor: pointer;
}
.choseTxt ul li.on,.choseTxt ul li:hover{
	width: var(--twidth);
	color: #fff;
	background: #eb6226;
	background: linear-gradient(90deg,#d91203,#ffc04e);
}

/* 恭喜中奖 */
/* #giftPage{display: block;} */
.giftbox{
	width: 100%; clear:both; float: left; margin: .3rem auto .15rem;
	text-align: center;
}
.giftbox img{
	width: 3rem; display: block; margin: auto;
}
.giftbox span{
	width: 100%; display: block;
	font-size: var(--fontSize); line-height: 1;
	font-weight: bold; color: #ff3132;
	padding: .16rem 0;
}

/* 恭喜抽中 */
/* #drawPage{display: block;} */
.drawTxt{
	width: 100%; clear:both; float: left; margin: .3rem auto .15rem;
	text-align: center;
}
.drawTxt img.sw{width: 2.49rem; display: block; margin: auto; margin-bottom: .3rem;}
.drawTxt img.yhq{width: 3.32rem; display: block; margin: auto; margin-bottom: .3rem;}
.drawTxt img.card{width: 3.32rem; display: block; margin: auto; margin-bottom: .3rem;}
.drawTxt p{
	font-size: var(--fontSize4); line-height: 1.3; margin-top: -.2rem;
	width: 90%;
	margin: -.2rem 5% .15rem;
}

@media screen and (min-width: 768px) {
	.drawTxt img.sw{margin-left: .5rem;}
}
/* 我的学习卡 */
/* #camiloPage{display: block;} */
.cardbox{
	width: 100%; clear: both; float: left; margin: .3rem auto .15rem;
	background: url("../images/tc-bg01.png") no-repeat center /2.49rem;
}
.cardbox ul{
	width: 100%; clear: both;margin-bottom: .5rem;
}
.cardbox ul li{
	width: 100%; clear: both;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: var(--fontSize4); line-height: 1.3;margin-bottom: .2rem;
}
.cardbox ul li input{
	border: none;
	border-bottom: solid .01rem #aaa;
	font-size: var(--fontSize4);
	width: 40%;
}
.cardbox ul li a{color:#333;}
.cardbox p{
	font-size: var(--fontSize4); line-height: 1.3;
	width: 100%; text-align: center;
	margin-bottom: .2rem;
}

/* 我的奖励 */
/* #myGiftPage{display: block;} */
.giftlist{
	width: 100%; clear: both; float: left; margin: .1rem auto .15rem;
}
.giftlist ul {
	width: 100%;clear: both;
}
.giftlist ul li{
	width: 90%; clear: both;
	padding: .25rem 0;
	margin: 0 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: dashed .02rem #ebe0dd;
}
.giftlist ul li:last-child{
	border-bottom: none;
	margin-bottom: .1rem;
}

.giftlist ul li span{
	font-size: var(--fontSize); line-height: 1.5; text-align: left;
	width: 60%;
}
.giftlist ul li a{
	width: 1.34rem;
	height: .44rem; display: block;
	background: #eb6226;
	background: linear-gradient(90deg,#ffc04e,#d91203);
	font-size: var(--fontSize); line-height: .44rem; text-align: center; color: #fff;
	border-radius: .5rem;
}

/* 活动规则 */
/* #rulePage{display: block;} */
.ruleBox{
	width: 100%; clear: both; float: left; margin: .25rem auto .15rem;
	max-height: var(--khei);
	overflow-y: scroll;
}
.ruleBox ul{
	width: 90%; margin: 0 5%;
}
.ruleBox ul li{
	font-size: var(--fontSize); line-height: 1.5;
	letter-spacing: -1px;
}
.ruleBox ul li span{
	font-weight: bold; color: #ff0f00;
}
.ruleBox ul li b{font-weight: bold;}

/* 填写收货地址 */
/* #addressPage{display: block;} */
.addressbox{
	width: 100%; clear: both; float: left; margin: .2rem auto;
}
.addressbox .tip{
	width: 100%; clear: both; float: left;
}
.addressbox .tip font{
	width: 100%; font-size: var(--fontSize); line-height: .32rem; color: #e94a55; font-weight: bold; text-align: center; float: left;
}
.addressbox .tip p{font-size: var(--fontSize3); line-height:.26rem; clear: both; margin: .1rem 5% 0; width: 90%; float: left;}

.addressbox ul{width: 3.6rem; margin: .1rem .2rem 0; float: left;}
.addressbox ul li{width: 100%; clear: both; float: left; margin-bottom: .15rem;}
.addressbox ul li.user,.addressbox ul li.phone{
	background: #ffefea;
	height: .45rem;
	line-height: .45rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius:.1rem;
}
.addressbox ul li.region{margin-bottom: .1rem;}
.addressbox ul li.address{margin-bottom: 0;}
.addressbox ul label{
	font-size: .16rem;color: #333;float: left; text-align: left; font-weight: bold;
	margin-left: .1rem; margin-right: .1rem;
	white-space: nowrap;
}
.addressbox ul em{color: #ff3f3f;}
.addressbox ul li input{
	width: 100%; height: .45rem; float: left;
	background: rgba(255,255,255,.15); font-size: .16rem; line-height: .45rem;
	border: none;
	color: #333;
}
.addressbox ul li.address input{
	width: 90%;padding: 0 5%;
	border: solid .01rem #ffcbb9;
	border-radius: .5rem;
	line-height: .47rem; height: .47rem;
	margin-top: .05rem;
}
.addressbox ul li input#userNames{width: 3.4rem;}
.addressbox ul li input#userPhones{width: 3.4rem;}

.addressbox ul li .form-group{width: 32%; float: left; margin-right: 1%;}
.addressbox ul li .form-group:last-child{width: 34%; margin-right: 0;}
.addressbox ul li .form-group span{
	float: left;color: #444;font-size: .16rem;font-weight: bold;
}
.addressbox ul li select{
	width: 100%; height: .46rem;clear: both;float: left;
	background: rgba(255,255,255,.15);
	font-size: .24rem; line-height: .46rem;color: #444;
	border: solid .01rem #ffcbb9;
	border-radius:.1rem;
}

/* 确认地址 */
/* #surePage{display: block;} */
#surePage .sureTxt{
	width: 80%; clear: both; margin: .25rem 10%;
	float: left;
}
#surePage .sureTxt ul{
	width: 100%; clear: both;
}
.sureTxt ul li{
	width: 100%; clear: both; float: left; margin-bottom: .1rem;
	font-size: .18rem; line-height: 1.5; color: #333;
}
.sureTxt ul li span{float: left; color: #555}
.sureTxt ul li p{
	font-weight: bold; color: #222;
}

@media screen and (max-width: 768px){
	.addressbox .tip p{line-height: 1.3;}
	.addressbox ul{
		width: 5rem; margin: .1rem .5rem 0;
	}
	.addressbox ul li{margin-bottom: .25rem;}
	.addressbox ul li.user,.addressbox ul li.phone{
		height: .7rem;
		line-height: .7rem;
		border-radius:.1rem;
	}
	.addressbox ul label{
		font-size: .24rem;
		margin-left: .2rem; margin-right: .1rem;
	}
	.addressbox ul li input{
		height: .7rem;font-size: .28rem; line-height: .36rem;
	}
	.addressbox ul li.address input{
		line-height: .77rem; height: .77rem;
	}
	.addressbox ul li input#userNames{width: 3.8rem;}
	.addressbox ul li input#userPhones{width: 3.8rem;}
	.addressbox ul li select{
		height: .6rem;clear: both;float: left;
		font-size: .24rem; line-height: .6rem;color: #444;
		border: solid .01rem #ffcbb9;
		border-radius:.1rem;
	}
	.addressbox ul li .form-group span{
		font-size: .28rem;
	}
	.sureTxt ul li{
		font-size: .28rem; line-height: .36rem; margin-bottom: .15rem;
	}
}