@charset "utf-8";

body{ background: #fff; font-size:.25rem; padding-bottom:1rem;}

/* --------------index-start-------------- */
.banner { background:url(../images/banner.jpg) center no-repeat; height:3.41rem; background-size:auto 100%; position:relative;}
.azDown { position:absolute; top:1.8rem; left:3.45rem; display:block; background:url(../images/azdown.png) center no-repeat; width:1.57rem; height:.57rem; background-size:100% 100%;}
.iosDown { position:absolute; top:1.8rem; left:5.45rem; display:block; background:url(../images/iosdown.png) center no-repeat; width:1.57rem; height:.57rem; background-size:100% 100%;}
.inroduce { overflow:hidden; width:7rem; margin:.3rem auto;}
.gameIcon { float:left; width:1.48rem;}
.gameText { float:left; width:5.05rem; margin-left:.25rem;}
.gameText h2 { font-size:.42rem; color:#000000;}
.gameText p { font-size:.2rem; color:#535353;}
.gameText span { background:url(../images/fire.png) left center no-repeat; background-size:.16rem auto; padding-left:.26rem; font-size:.2rem; color:#636363;}
.gameCode { width:7rem; box-sizing:border-box; padding-top:.34rem; padding-left:5.5rem; margin:0 auto; background:url(../images/code.png) center no-repeat; height:1.2rem; background-size:100% auto;}
.gameCode a { display:block; width:1.16rem; height:.5rem; text-align:center; border-radius:.5rem; border:1px solid #ff6f3b; font-size:.24rem; color:#ff6f3b; line-height:.5rem;}
.menuList ul { margin:.4rem auto .2rem; overflow:hidden;}
.menuList li { width:25%; float:left; text-align:center;}
.menuList img { height:.36rem; width:auto; margin:0 auto;}
.menuList a { font-size:.2rem; color:#636363; line-height:.44rem;}
.downBtn { width:6.29rem; margin:0 auto;}

/**/
.textTit { line-height:.8rem; overflow:hidden;}
.textTit p{ float:left; font-size:.3rem;}
.textTit span { float:right; font-size:.2rem; color:#676767;}
.grayBox { float:left; background:#e8e8e8; width:5.4rem; height:.6rem; line-height:.6rem; overflow:hidden; border-radius:4px; overflow:hidden;}
.grayBox>span{ float:left; width:1.28rem; display:block; text-align:center; background:#fcdfb4; color:#644700; font-size:.26rem; border-radius:4px;}
.grayBox p { font-weight:bold; width:3.97rem; float:left; font-size:.26rem; color:#4f4f4f; text-align:center;}
.grayBox p>a { color:#4f4f4f; font-size:.3rem; font-weight:bold;}
.footer { text-align:center; background:#a78b4d; padding:.25rem 0 .2rem; color:#feebc2; position: absolute;bottom: 0;width: 100%;left: 0;}
.footer img { width:1.75rem; margin:0 auto .1rem;}
.text li> a {  border-radius: 4px; display: block; float: right; color: #483300; text-align: center; line-height: .6rem; height: .6rem;
 width: 1.6rem; font-size: .24rem;  background: #ebba73;}
.text li> a:hover { border-radius: 4px; display: block; float: right; color: #f00; text-align: center; line-height: .6rem;  height: .6rem; width: 1.6rem; font-size: .24rem; background: #ffdb86;}
.text li { overflow:hidden; margin-bottom:.2rem;}
.text { padding:0 .2rem .2rem; margin-top:-.4rem; }
.textTit .online {background:url(../images/kf.png) left center no-repeat; background-size:.25rem auto; float:right; color:#333333; font-size:.26rem; padding-left:.34rem; display:block; width:1.2rem; height:.8rem;}
.grayBox a span { font-weight:bold; color:#fa0000;}
.gameRep { padding:0 .2rem .2rem;}
.textTit a { float:right; color:#4c4c4c;}
.gameRep ul { overflow:hidden;}
.gameRep li { margin-bottom:.2rem; margin-right:.15rem; float:left; width:2.265rem;}
.gameRep li img { height:2.75rem;}
.gameRep li:nth-child(3n){ margin-right:0;}
.gameRep li h2 { color:#0a0a0a; font-size:.26rem; line-height:.32rem; margin-top:.05rem;}
.gameRep li p { font-size:.2rem; color:#acacac;}
.gameHot h2 { color:#0a0a0a; font-size:.26rem; line-height:.32rem; margin-top:.05rem;}
.gameHot .swiper-slide p { font-size:.2rem; color:#acacac;}
.gameHot .swiper-container {
  width: 100%;
  height: 100%;
}
.gameHot .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  text-align:left;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.gameHot { padding:0 .2rem;}
.gameTj { padding:.45rem .2rem;}
.hotTalkTit { margin-bottom:.5rem; overflow:hidden;}
.hotTalkTit p { float:left; font-size:.3rem; color:#0a0a0a;}
.hotTalkTit span { display:block; text-align:center; font-size:.24rem; color:#fff; background:#d4d4d4; float:left; line-height:.33rem; border-radius:3px; margin-left:.1rem; margin-top:.05rem; padding:0 .13rem;}
.hotTalk { padding: 0 .2rem;}
.talkBar { margin-bottom:.5rem; overflow:hidden;}
.talkIcon { float:left; width:.66rem; height:.66rem;}
.talkTxt { width:6.2rem; float:right;}
.userCz { overflow:hidden; margin-top:.07rem;}
.userCz .name { float:left; color:#ecbc76; font-size:.26rem;}
.userCz span { float:left; margin-left:.21rem;}
.userCz span img { display:inline-block; width:.34rem;}
.userCz a { float:right; color:#ababab; font-size:.22rem; margin-left:.33rem;}
.userCz a.zan { background:url(../images/a_62.png) left center no-repeat; background-size:.31rem auto; padding-left:.4rem;}
.userCz a.answer { background:url(../images/a_67.png) left center no-repeat; background-size:.29rem auto; padding-left:.39rem;}
.date { font-size:.2rem; color:#ababab; line-height:.32rem;}
.taleInfor { margin:.25rem 0 .15rem; color:#333333; font-size:.26rem; line-height:.4rem;}
.taleInfor span { display:inline-block; background:url(../images/a_74.png) .06rem center no-repeat; padding-left:.25rem; padding-right:.04rem; border:1px solid #f82817; color:#f82817; line-height:.3rem; background-size:.15rem auto; margin-right:.1rem;}
.answ { padding:.15rem .25rem; color:#333333; border-radius:4px; background:#f7f7f7;}
.answ span { color:#666666;}
.shareBar { z-index:5; border-top:1px solid #969696; width:100%; background:#efeeec; position:fixed; left:0; bottom:-100%;}
.shareBar ul { overflow:hidden; padding:0 .25rem;}
.shareBar li { padding-top:.4rem; line-height:.6rem; text-align:center; font-size:.2rem; width:25%; float:left;}
.shareBar li img { width:.99rem; margin:0 auto; border-radius:50%; height:.99rem; background:#fff;}
.shareBar li a { color:#5c5b59;}
.shareBar .close { text-align:center; display:block; font-size:.3rem; line-height:1rem; border-top:.04rem solid #d2d0d0;}
#screen { position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); display:none; z-index:2;}
.resignBox { display:none; z-index:3; position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:6rem; background:#fff; border-radius:6px;}
.resignBox h2 { line-height:1.2rem; text-align:center; font-size:.34rem; color:#333333;}
.resignBar { position:relative; padding:0 .4rem;}
.resignBar li { margin-bottom:.3rem; overflow:hidden; line-height:.66rem;}
.resignBar li span { text-align:right; float:left; width:1.22rem;}
.resignBar li a { float:right; color:#c29561;}
.resignBar li .inpBar { width:3.95rem; float:left; overflow:hidden; border-bottom:1px solid #efefef;}
.resignBar input { border:none; outline:none;}
.resignBar input.checkIn { width:2.2rem;}
.resignBar .closeBtn { display:block; background:url(../images/close.jpg) center no-repeat; width:.28rem; height:.28rem; background-size:100% 100%; position:absolute; top:.49rem; right:.35rem;}
.resignBar .loginBtn { position:absolute; left:.43rem; top:.55rem; color:#a0a0a0; font-size:.23rem;}
.resignBar .resignBnt { text-align:center; display:block; background:#ebba73; color:#fff; width:4rem; height:.9rem; line-height:.9rem; border-radius:6px; margin:.25rem auto .6rem;}
.onlineBtn { display:block; width:1.56rem; right:.2rem; top: 3.1rem; position:fixed; z-index:1;}
.talkBox { z-index:1; position:fixed; left:0; background:#fff; bottom:0; width:100%; border-top:1px solid #dbdbdb;}
.sendBar { position:relative; box-sizing:border-box; padding-top:.08rem; margin:.12rem auto; width:7rem; height:.65rem; border-radius:.65rem; background:#f5f5f5;}
.sendBar .subBtn { top:0; right:.2rem; color:#333; line-height:.6rem; position:absolute;}
.userIcon { display:block; background:url(../images/a_80.png) center no-repeat; width:.49rem; height:.49rem; border-radius:50%; background-size:100% auto; margin-left:.11rem; float:left;}
.sendBar input { float:left; border:none; background:none; line-height:.49rem; font-size:.24rem; margin-left:.15rem; width:5rem;}
.resignBar input::-webkit-input-placeholder{
	color:#c9c9c9;
}
.downBtn .arr { width:.55rem; margin:.2rem auto;}

/**/
.header2 { background:url(../images/tpbg.png) center top no-repeat; background-size:100% auto;}
.noticeBox { box-shadow:0 0 10px #c3915f; background:#5c0907; box-sizing:border-box; width:7.1rem; padding:.2rem .45rem .42rem; border-radius:20px; margin:0 auto; border-bottom:1px solid #f5c99d;}
.noticeBox p { color:#fff; font-size:.26rem; line-height:.36rem;}
.noticeBox img { width:2.95rem; margin:0 auto;}
.flag { box-sizing:border-box; padding:.25rem .35rem 0 .25rem; background:url(../images/tbg.png) center no-repeat; width:5.91rem; height:3.43rem; background-size:100% auto; margin:-.12rem auto;}
.flag p{ font-size:.32rem; background: url(../images/fk.png) left .1rem no-repeat; padding-left:.45rem; line-height:.52rem; background-size:.28rem auto; color:#482706; font-weight:bold;}
.flag p span { color:#482706; font-weight:bold;}
.choseTit { width:5rem;  margin:0 auto; overflow:hidden; margin:.5rem auto;}
.choseTit a { color:#333333; font-size:.28rem; display:block; width:50%; text-align:center; line-height:.8rem; box-sizing:border-box; float:left; border:2px solid #c6c6c6;}
.choseTit a:first-child { border-radius:.8rem 0 0 .8rem; border-right:none;}
.choseTit a:last-child { border-left:none; border-radius:0 .8rem .8rem 0;}
.choseTit a.on { color:#fff; background:#b98450; border:2px solid #b98450;}
.choseBoxa p { color:#666666; font-size:.26rem; line-height:.3rem; padding:.3rem .5rem; text-align:center;}
.choseBoxa img { width:4rem; margin:0 auto .2rem;}
.headerBack { position:relative; text-align:center; font-size:.4rem; color:#fff; line-height:.62rem; margin-bottom:.3rem;}
.headerBack .back { display:block; background:url(../images/back.png) center no-repeat; width:.28rem; height:.47rem; background-size:100% auto; position:absolute; left:.25rem; top:.12rem;}
.dn { display:none;}

.banner .swiper-container {
      width: 100%;
      height: 100%;
    }
.banner .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;

  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
/**/
#screen { position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:999; display:none;}
.altBox { position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); z-index:1000; display:none;}
.altBar { background:url(../images/q_05.png) center no-repeat; position:relative; width:6.25rem; background-size:100% auto; height:8.63rem;}
.altBar .downImg { width:1.75rem; height:1.75rem; position:absolute; left:50%; top:-.66rem; transform:translateX(-50%);}
.downInfor { padding-top:2.85rem;}
.downInfor h2 { line-height:.9rem; font-size:.48rem; color:#ae7e1a; text-align:center;}
.downInfor .loadImg { width:1.85rem; margin:0 auto;}
.downInfor .backBtn { display:block; margin:.23rem auto; width:4.57rem; height:.98rem; border-radius:6px; line-height:.98rem; background:#e8d9ba; text-align:center; color:#8c712f; font-size:.48rem;}
.downInfor p { text-align:center; font-size:.36rem; color:#805e19;}
.downInfor span { color:#fb0a37;}
.downInfor .how { display:block; background:url(../images/3.gif) center no-repeat; width:5.9rem; height:1.75rem; margin:0 auto; background-size:100%;}
.downInfor .arr { display:block; background:url(../images/arrow.png) center no-repeat; width:.34rem; height:.28rem; background-size:100% auto; margin:.2rem auto;}
.altBox .closeBtn { cursor:pointer; background: url(../images/closebtn.png) center no-repeat; width:.61rem; height:.61rem; background-size:100% auto; margin:.27rem auto; display:block;position: absolute;top: -4px;right:12px}
.teachTop { background:url(../images/e_02.png) center top no-repeat; background-size:100% auto;}
.topbox { position:relative; padding:.23rem;}
.topbox .back { background: url(../images/closebtn.png) center no-repeat;
    width: 0.6rem;
    height: 1.25rem;
    left: 6.5rem;
    top: -0.01rem;
    background-size: 100% auto;
    position: absolute;
    display: block;}
.topbox .logot { width:4.4rem; margin:0 auto; display:block;}
.teachNotice { padding:0 .3rem; color:#fff; line-height:.32rem; font-size:.26rem;}
.notBar h2 { text-align:center; font-size:.32rem; color:#fff; background:url(../images/line.png) center no-repeat; background-size:3.18rem auto;}
.notBar ul { padding-left:.7rem; margin-top:.25rem;}
.notBar li { margin-bottom:.35rem; overflow:hidden;}
.notBar span { display:block; margin-right:.2rem; border-radius:50%; background:#fedc4e; color:#d30000; width:.5rem; height:.5rem; line-height:.5rem; text-align:center; float:left;}
.notBar p { float:left; line-height:.5rem; color:#fff;}
.notBar p a { background:#ff0024; color:#fff; padding:0 .1rem;}
.teachTop .yz { display:block; width:5.04rem; height:0.4rem; background-size:100% auto; margin:.2rem auto 0;}
.techTit { background:url(../images/q_08.png) center no-repeat; background-size:100%; text-align:center; color:#fff; font-size:.58rem; line-height:.88rem;}
.teachList { width:7.1rem; padding-bottom:.5rem; border-radius:6px; padding-top:.35rem; margin:.4rem auto; background:#b59d68;}
.teachList li { margin-bottom:.2rem; color:#fff; font-size:.34rem; line-height:.51rem; overflow:hidden;}
.teachList span { float:left; font-size:.34rem; margin-left:.5rem;}
.teachList p { float:left; width:5.9rem; margin-bottom:.3rem;}
.teachList h4 { text-align:center;}
.teachList h5 { text-align:center;}
.yzBox { background: url(../images/5.jpg) center no-repeat; width:100%; height:3.62rem; background-size:100%;}
.yztop { font-size:.16rem; line-height:.19rem; color:#77777c; padding:.4rem 1.15rem 0;}
.xrtxt { text-align:center; font-size:.21rem; line-height:.56rem; color:#0074ff; margin-top:.4rem; }
.xrbar { box-sizing:border-box; padding:.5rem 2.1rem 0; background: url(../images/6.jpg) center no-repeat; height:3.38rem; background-size:100%;}
.xrbar h2 { font-size:.18rem; margin-bottom:.05rem; font-weight:bold; line-height:.3rem; color:#080808; text-align:center;}
.xrbar h3 { font-size:.16rem; text-align:center; line-height:.24rem; color:#080808}
.downPag { background:url(../images/1.jpg) center no-repeat; height:3.01rem; background-size:100% auto; text-align:center; color:#171717; font-size:.32rem; line-height:.42rem; box-sizing:border-box; padding-top:.37rem;}
.downPag h2 {font-size:.32rem; line-height:.42rem;}
/**/
.content {
    background-color: #b59d68;
    border-radius: 10px;
    width: 7.1rem;
    margin-left: 5%;
    color: #fff;
    font-size: .36rem;
    text-align: center;
    padding: 24px 0;
	margin: .4rem auto;
}
.step-one-wrap {
    position: relative;
    margin-top: 20px;
}
.step-one-wrap .installation {
    width: 80%;
    margin-left: 10%;
}
.step-one-wrap .desc {
    position: absolute;
    font-size: .36rem;
    top: 12%;
    left: 50%;
    transform: translateX(-50%);
    line-height: 1.2;
    color: rgb(22,22,22);
}
.step-one-wrap .message {
    position: absolute;
    bottom: -4px;
    width: 100%;
}
.step-two {
    margin-top: -20px;
}
.step-two p{
    margin: 20px;
}
.device-wrap p{
    margin: 0px;
}
.step-two .setting {
    height: 70px;
    width: 70px;
    margin: 10px auto 2px;
}
.step-two .generic {
    width: 80%;
    margin-left: 10%;
    margin: 14px auto 6px;
}
.device-wrap {
    position: relative;
    margin-top: 14px;
}
.device-wrap .device {
    width: 80%;
    margin-left: 10%;
}
.device-wrap .message {
    position: absolute;
    bottom: -4px;
    width: 100%;
}
.step-three {
    margin-top: 14px;
}
.trust-certificate {
    background-color: rgb(239, 239, 244);
    color: #999;
    width: 80%;
    margin-left: 10%;
    font-size: .24rem;
    padding: 10px 0 4px;
    margin-bottom: 4px;
    position: relative;
}
.section-one,
.section-three,
.section-four {
    padding: 0 10px;
}
.section-one .message {
    transform: scale(.9);
    text-align: left;
    line-height: 1.4;
    margin-left: -4%;
    margin-bottom: .4rem;
    word-break: break-all;
}
.section-two {
    background-color: rgb(229, 238, 255);
    color: rgb(35, 136, 255);
    padding: 2px 10px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.section-three .message {
    transform: scale(.9);
    text-align: left;
    line-height: 1.4;
    margin-left: -4%;
    margin-top: .4rem;
    margin-bottom: 4px;
}
.section-four {
    background-color: #fff;
    text-align: left;
    color: #333;
    display: table;
    width: 100%;
    box-sizing: border-box;
    padding: 4px 10px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.section-four img {
    height: 24px;
    width: auto;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.section-four .right {
    display: table-cell;
    text-align: right;
    color: rgb(167, 167, 170);
}
.trust-certificate .hand {
    position: absolute;
    height: 50px;
    width: auto;
    right: -8%;
    top: 40%;
}
.trust-wrap {
    width: 80%;
    margin-left: 10%;
    margin: 14px 10%;
    position: relative;
}
.trust-wrap .message {
    background-color: #fff;
    color: rgb(35, 136, 255);
    font-size: .24rem;
    padding: 2px;
}
.trust-wrap .logo {
    position: absolute;
    height: 22px;
    width: auto;
    top: 37%;
    left: 10px;
}
.trust-wrap .masking {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, .4);
}
.trust-wrap .img-wrap {
    position: relative;
    width: 80%;
    margin-left: 10%;
    margin-top: 16%;
}
.trust-wrap .masking .desc {
    font-size: .24rem;
    position: absolute;
    color: #333;
    top: 10px;
    transform: scale(.9);
}
.trust-wrap .img-wrap .hand {
    position: absolute;
    height: 50px;
    width: auto;
    right: -12%;
    bottom: -18%;
}
#loadImg { display:none; position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:10%; z-index:1001; height:auto;}