@media (min-width:320px) {
    html { font-size: 42.6667px; }
}
@media (min-width:360px) {
    html { font-size: 48px; }
}
@media (min-width:375px) {
    html { font-size: 50px; }
}
@media (min-width:414px) {
    html { font-size: 55.2px; }
}
* { -webkit-box-sizing: border-box; box-sizing: border-box; }
body, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ul, li, table{ margin: 0; padding: 0; font-weight: normal; }
body { font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", STHeiti, "Microsoft Yahei", Tahoma, Simsun, sans-serif; font-size: .24rem; -webkit-text-size-adjust: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-font-smoothing: antialiased; -webkit-touch-callout: none; touch-callout: none;
max-width:750px; margin:0 auto; background:#e8f4d0; color: #023470; font-size: .28rem;}
html,body,.page{width: 100%; height: 100%;}
a { text-decoration: none; color: #11a6c2;}
img {max-width: 100%; vertical-align: top;}
ul, ol, li {list-style: none;}
em,b,i,strong {font-style: normal; font-weight: 400;}
input, button, select, textarea { outline: none; -webkit-appearance: none; }
textarea { resize: none; }
input, select { vertical-align: middle; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #999; }
input::-webkit-search-decoration, input::-webkit-search-cancel-button { display: none; }
.tc {text-align:center;}
.cl {clear: both;}
.fl {float: left;}
.fr {float: right;}
.hide {display: none;}
.btn:active {opacity: .8;}

.page {position: relative; max-width: 750px; min-height: 22.4rem; margin:0 auto; padding-top: 3.78rem; background: url(../../images/hglgy/bg.jpg) no-repeat; background-size: 100% auto;}

.box1 {width: 5.29rem; height: 1.49rem; margin:0 auto .24rem; background: url(../../images/hglgy/box1.png) no-repeat; background-size: 100%; text-align: center;}
.box1 h3 {line-height: .6rem; font-size: .36rem; text-align: center;}
.box1 p {padding:.14rem 0 .2rem; color: #fff; font-size: .3rem;}
.box1 p span {margin-right:.6rem;}

.flow,.voice,.zhe {width:6.94rem; margin:0 auto; text-align: center; overflow:hidden;}
.flow h2,.voice h2,.zhe h2 {width: 4.48rem; height: .87rem; line-height: .8rem; margin:0 auto; padding-left: .7rem; background: url(../../images/hglgy/title.png); background-size: 100%; color: #fff; font-size:.38rem; font-weight: 600; font-style: italic; text-align:left;}
.flow h3,.voice h3,.zhe h3,.box2 h3 {font-size: .32rem; font-weight: 600;}
.flow .items {width: 6.96rem; height: 1.52rem; background: url(../../images/hglgy/flow.png) no-repeat; background-size: 100%;}
.flow dl,.voice p,.zhe dl {float: left; width: 3.32rem; margin: .2rem .05rem 0;}
.flow dt {line-height: .54rem; color: #2686fd; font-size: .22rem;}
.flow dt b {font-size: .32rem; font-weight: 600;}
.flow dd {padding-top: .1rem; font-size: .18rem; line-height: 1.2;}
.flow dd b {display: block; font-size: .22rem;}

.box2 {width: 5.39rem; height: 2.3rem; margin:.1rem auto .2rem; padding-top: .3rem; background: url(../../images/hglgy/box2.png) no-repeat; background-size: 100%; color: #50a237; font-size: .22rem; text-align: center;}

.voice p {padding-top:.65rem; color: #2dca73; font-size: .28rem;}
.voice .items {width: 6.86rem; height: 1.56rem; background: url(../../images/hglgy/voice.png) no-repeat; background-size: 100%;}

.zhe {width:100%; margin:.15rem auto 0;}
.zhe .items {width: 7.5rem; height: 2.18rem; margin:0 auto; background: url(../../images/hglgy/zhe1203.png) no-repeat; background-size: 100%;}
.zhe dl {width: 2.32rem; margin:1.05rem 0 0 .13rem; text-align: left; padding-left: .1rem;}
.zhe dt {font-size: .24rem; line-height: 1.2; height: .55rem;}
.zhe dd {font-size: .2rem; color: #f95a52;}
.zhe dd del {font-size: .18rem; color: #9fa9bd;}
.zhe dd b {font-size: .24rem; font-weight: 600; margin:0 .1rem 0 .1rem;}

.quan {display: block; width: 3.33rem; height: .35rem; margin:.2rem auto; background: url(../../images/hglgy/more.png) no-repeat; background-size: 100%; text-indent:-999em;}

.rule {width: 7rem; padding: 0 .26rem; margin:.4rem auto 1.5rem; font-size: .22rem; color: #000;}
.rule h2 {width: 2.87rem; height: .3rem; margin: 0 auto .2rem; background: url(../../images/hglgy/rule.png); background-size: 100%; text-indent: -999em;}

.btn-bot {position: fixed; bottom: 0; left: 0; width: 100%; height: .9rem; line-height: .9rem; color: #fff; background-color: rgb(56, 156, 249); box-shadow: 0.052px -3px 10px 0px rgba(0, 101, 170, 0.51); font-size: .36rem; text-align: center;}


.pop-wrap {display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6);}
.pop {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 8.2rem; background: url(../../images/hglgy/pop.png) no-repeat; background-size: 100%; }
.pop-hd {padding:1rem 0 .2rem ; font-size: .4rem; font-weight: 600; text-align:center;}
.pop-bd {width: 6.32rem; margin:0 auto; padding: .3rem .24rem; border-radius: .15rem; background:#fff; color: #090909; font-size: .3rem;}
.pop p {font-size: .26rem; text-align:center;}
.pop p b {font-size: .32rem; font-weight: 600;}
.pop p.border {border-bottom: #090909 1px dashed; margin:.3rem 0 .2rem; padding: .1rem 0; line-height: 1.8; text-align: left;}
.pop .btn, .confirm .btn {display:inline-block; width: 2.4rem; height: .83rem; line-height: .83rem; margin:.3rem .2rem .4rem; border-radius: .83rem; color: #fff; background:#389cf9; text-align: center; font-size: .34rem;}
.confirm {width: 5.7rem; margin:0 auto; color: #090909;}
.confirm li {line-height: 2;}
.confirm p.agree {text-align:center;}
.confirm p.agree label {display: inline-block; width: .32rem; height: .32rem; border:#6d6d6e 1px solid; border-radius: 50%; background: #fff; margin-right: .1rem; vertical-align: middle;}
.confirm p.agreed label:before {content: '✓'; color: #db692a; font-weight: 600;}
.confirm .btn {background: #f76353;}
.confirm .btn.disabled {-webkit-filter: grayscale(100%); }
.confirm .btn.cancel {background:#fff; border:#6d6d6e 1px solid; color: #6d6d6e;}
.confirm .btns {text-align:center; margin-top: .6rem; padding-top: .2rem; border-top: #000 1px dotted;}
.confirm b {font-weight: 600;}
.confirm .tips {text-align:left; padding: .2rem 0 .5rem;}

.page2 {background-image: url(../../images/hglgy/bg2.jpg); padding-top: 33vw; min-height: 13.34rem;}
.page2 .rule {width:88vw; padding: 0 4vw; color: #013277; font-size: 3vw;}
.page2 .rule h3 {font-size: 4vw; text-align:center; margin-bottom:.3rem;}

.get {width: 81vw; height: 93vw; margin:0 auto;}
.get h3 {height:8.1vw; font-size: 4vw; font-weight: 600;}
.get dl {height:23.2vw; margin-bottom: 4.4vw; text-align:center;}
.get dt {float: left; width: 52.2vw; padding-top: 3.8vw; color: #fff; font-size: 4.2vw;}
.get dt b {font-size: 6vw; font-weight: 600; display: block;}
.get dd {width: 28.8vw; float: left;}
.get dd a {display: block; line-height: 23.5vw; color: #fdf98c; font-size: 5vw; font-weight: 600;}
.get dd a.geted {background: url(../../images/hglgy/geted.png) no-repeat; background-size: 100%; color: #e5e5e5;}

.pop1 {background-image: url(../../images/hglgy/pop1.png);}
.pop1 .pop-hd {padding-top: .9rem;}
.pop1 .pop-bd,.pop2 .pop-bd,.pop3 .pop-bd,.pop4 .pop-bd {background: none;}
.pop h4 {font-size: .34rem; font-weight: 600; padding: .1rem 0 1rem .2rem;}
.pop2 {background-image: url(../../images/hglgy/pop2.png);}
.pop2 h5,.pop3 h5,.pop4 h5 {margin:3.2rem auto .3rem; color: #023778; font-size: .4rem; text-align:center;}
.pop2 .btn,.pop3 .btn,.pop4 .btn {width: 5.1rem;}
.pop3 {background-image: url(../../images/hglgy/pop3.png);}
.pop3 h5 {margin-top: 1.4rem;}
.pop4,.pop6 {background-image: url(../../images/hglgy/pop4.png);}
.pop4 h5 {margin:4.3rem auto .9rem;}

.pop6 .pop-bd {width:6.2rem; margin:1.8rem auto 0;}
.pop6 h5 {margin:.8rem 0 .5rem; color: #023778; font-size: .4rem; font-weight: 600; text-align:center;}
.pop6 p {word-break: break-all; font-size: .3rem; text-align:center;}

.form {width: 5.8rem; margin:.42rem auto;}
.form li {margin-bottom: .25rem; font-size: 0;}
.form li p {color: #fe3601; font-size: .22rem; margin-top:.05rem;}
.form input {height: .86rem; line-height: .86rem; width: 5.78rem; padding: 0 .25rem; border: none; background: #eee; font-size: .3rem; vertical-align: top;}
.form .code {display: inline-block; width: 2.06rem; height: .86rem; line-height: .86rem; color: #fff; background: #38bbf8; text-align: center; font-size: .33rem;}
.form .btn {display:block; width: 3.14rem; height: .86rem; line-height: .86rem; border-radius: .86rem; margin:.5rem auto; background: #f76353; color: #fff; font-size: .4rem; text-align:center;}
