@charset "utf-8";
html,body,h1,h2,h3,h4,h5,h6,hr,p,iframe,dl,dt,dd,ul,ol,li,pre,form,fieldset,button,input,textarea,th,td{margin:0;padding:0}
html,body{margin:0 auto;max-width: 750px;width: 100%;height: 100%;position: relative;overflow: hidden;}
ul,ol{list-style:none}
fieldset,img{border:0 none}
a{text-decoration:none}
.fl{float: left;}
.fr{float: right;}
.clearfix:after {content: "\0020";display: block;height: 0;clear: both;}
/* 重置结束 */
.page{width: 100%;height: 100%;position: absolute;top:0;left:0;background:#e3e3e2;display: none;}
.page>div{width: 100%;height: 100%;position: relative;}
.page.active{z-index: 13;display: block;}
/* page1 */
.page1{background: url(../images/load-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;position: fixed;z-index: 100;top: 0;left: 0;width: 100%;height: 100%;}
.load-img1{position: absolute;bottom: 0;left: 50%;width: 8.7rem;margin:0 0 0 -4.35rem;}
.load-img2{position: absolute;top: 50%;left: 50%;width: 8.7rem;margin:-2.05rem 0 0 -4.35rem;}
/* page2 */
.page2{background: url(../images/page2-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page2 img{display: block;position: absolute;top:50%;left:50%;}
.page2-img1{width: 2rem;margin:-1.85rem 0 0 -1rem;}
.page2-img2{width: 2rem;margin:-.04rem 0 0 -1rem;}
.page2-img3{width: 2rem;margin:1.31rem 0 0 -1rem;}
.page2-img4{width: 2.68rem;margin:4.45rem 0 0 -1.34rem;}
.page2-img5{width: 8.7rem;margin:-1.23rem 0 0 -4.35rem;}
.page2-img6{width: 8.7rem;margin:.58rem 0 0 -4.35rem;}
.page2-img7{width: 8.7rem;margin:1.95rem 0 0 -4.35rem;}
.page2-img8{width: 8.7rem;margin:3.11rem 0 0 -4.35rem;}
.page2 span{display:block;width:0;height:0;border-width:6px 4px 4px 4px;border-style:solid;border-color:#093c71 transparent transparent;position:absolute;top:50%;left:50%;margin:4.1rem 0 0 -4px;}
/* page3 */
.page3{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page3 img.page3-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page3 .page3-img2{width: 8.7rem;margin:.35rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page3 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.13rem 0 0 -3.57rem;width: 7.14rem;}
.page3 .g-ul1 li{float: left;width: 3.07rem;height: .75rem;margin:0 .25rem .49rem .25rem;}
.page3 .g-ul1 li img{display: block;width: 100%;height: 100%;}
.page3 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.54rem 0 0 -4.35rem;height: 1px}
/* page4 */
.page4{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page4 img.page4-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page4 .page4-img2{width: 8.7rem;margin:.13rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page4 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.68rem 0 0 -4.35rem;height: 1px}
.page4 .g-ul2{width: 5.2rem;position: absolute;top:50%;left:50%;margin:1.95rem 0 0 -2.6rem;}
.page4 .g-ul2 li{width: 100%;margin-bottom: .15rem;}
.page4 .g-ul2 li img{width: 5.2rem;height: .75rem;display: block;}
.page4 .g-ul2 li.clearfix img{width:2.44rem ;}
/* page5 */
.page5{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page5 img.page5-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page5 .page5-img2{width: 8.7rem;margin:.13rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page5 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.68rem 0 0 -4.35rem;height: 1px}
.page5 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.13rem 0 0 -3.44rem;width: 6.88rem;}
.page5 .g-ul1 li{float: left;width: 2.66rem;height: .75rem;margin:0 .39rem .49rem .39rem;}
.page5 .g-ul1 li img{display: block;width: 100%;height: 100%;}
/* page6 */
.page6{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page6 img.page6-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page6 .page6-img2{width: 8.7rem;margin:.33rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page6 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.54rem 0 0 -4.35rem;height: 1px}
.page6 .g-ul2{width: 5.2rem;position: absolute;top:50%;left:50%;margin:1.85rem 0 0 -2.6rem;}
.page6 .g-ul2 li{width: 100%;margin-bottom: .15rem;}
.page6 .g-ul2 li img{width: 5.2rem;height: .75rem;display: block;}
/* page7 */
.page7{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page7 img.page7-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page7 .page7-img2{width: 8.7rem;margin:.13rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page7 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.68rem 0 0 -4.35rem;height: 1px}
.page7 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.13rem 0 0 -3.44rem;width: 6.88rem;}
.page7 .g-ul1 li{float: left;width: 2.66rem;height: .75rem;margin:0 .39rem .49rem .39rem;}
.page7 .g-ul1 li img{display: block;width: 100%;height: 100%;}
/* page8 da*/
.page8{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page8 img.page8-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page8 .page8-img2{width: 8.7rem;margin:.35rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page8 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.13rem 0 0 -3.57rem;width: 7.14rem;}
.page8 .g-ul1 li{float: left;width: 3.07rem;height: .75rem;margin:0 .25rem .49rem .25rem;}
.page8 .g-ul1 li img{display: block;width: 100%;height: 100%;}
.page8 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.54rem 0 0 -4.35rem;height: 1px}
/* page9 xiao*/
.page9{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page9 img.page9-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page9 .page9-img2{width: 8.7rem;margin:.13rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page9 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.68rem 0 0 -4.35rem;height: 1px}
.page9 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.13rem 0 0 -3.44rem;width: 6.88rem;}
.page9 .g-ul1 li{float: left;width: 2.66rem;height: .75rem;margin:0 .39rem .49rem .39rem;}
.page9 .g-ul1 li img{display: block;width: 100%;height: 100%;}
/* page10 xiao*/
.page10{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page10 img.page10-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page10 .page10-img2{width: 8.7rem;margin:.13rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page10 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.68rem 0 0 -4.35rem;height: 1px}
.page10 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.82rem 0 0 -3.44rem;width: 6.88rem;}
.page10 .g-ul1 li{float: left;width: 2.66rem;height: .75rem;margin:0 .39rem .49rem .39rem;}
.page10 .g-ul1 li img{display: block;width: 100%;height: 100%;}
/* page11 xiao*/
.page11{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page11 img.page11-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page11 .page11-img2{width: 8.7rem;margin:.13rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page11 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.68rem 0 0 -4.35rem;height: 1px}
.page11 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.13rem 0 0 -3.44rem;width: 6.88rem;}
.page11 .g-ul1 li{float: left;width: 2.66rem;height: .75rem;margin:0 .39rem .49rem .39rem;}
.page11 .g-ul1 li img{display: block;width: 100%;height: 100%;}
/* page12 xiao*/
.page12{background: url(../images/question-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page12 img.page12-img1{display: block;position: absolute;top:-.8rem;left:50%;width: 8.7rem;margin-left: -4.35rem;}
.page12 .page12-img2{width: 8.7rem;margin:.13rem 0 0 -4.35rem;display: block;position: absolute;top:50%;left:50%;}
.page12 .hr{display: block;width: 8.7rem;position: absolute;top:50%;left:50%;margin:1.68rem 0 0 -4.35rem;height: 1px}
.page12 .g-ul1 {position: absolute;top:50%;left: 50%;margin:2.13rem 0 0 -3.44rem;width: 6.88rem;}
.page12 .g-ul1 li{float: left;width: 2.66rem;height: .75rem;margin:0 .39rem .49rem .39rem;}
.page12 .g-ul1 li img{display: block;width: 100%;height: 100%;}
/* page-g1 new*/
.page-g1{background:#efeef5;}
.page-g1 img{display: block;position: absolute;left:50%;top:50%;}
.page-g1 .page-g1-img1{width: 8.7rem;margin:-5.15rem 0 0 -4.35rem;}
.page-g1 .page-g1-img2{width: 8.7rem;margin:-4.06rem 0 0 -4.35rem;}
.page-g1 .page-g1-img3{width: 8.7rem;margin:-2.85rem 0 0 -4.35rem;}
.page-g1 .page-g1-img4{width: 8.7rem;margin:1.56rem 0 0 -4.35rem;}
.page-g1 .page-say{width: 3.66em;margin:4.3rem 0 0 -1.84rem;}
/* page-g2 new*/
.page-g2{background:#efeef5;}
.page-g2 img{display: block;position: absolute;left:50%;top:50%;}
.page-g2 .page-g2-img{width: 8.7rem;margin:-5.4rem 0 0 -4.35rem;}
.page-g2 .page-keep{width: 3.38em;margin:4.44rem 0 0 -3.59rem;z-index: 3;}
.page-g2 .page-change{width: 3.38em;margin:4.44rem 0 0 .22rem;z-index: 5;}
.page-g2 .ewm{display: none;width: 1.86rem;height: 1.86rem;position: absolute;top:50%;left:50%;margin:1.67rem 0 0 -.93rem;}
/* page31 */
.page31{background: url(../images/page31-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page31-img1{width: 8.7rem;position: absolute;top:50%;left:50%;margin:-6.01rem 0 0 -4.35rem;}
/* music */
.music{position: absolute;top:50%;left:50%;width: 8.7rem;height: .43rem;z-index: 10;margin:-1.06rem 0 0 -4.35rem;}
.music>div{position: relative;width: 100%;height: 100%}
.pro{width: 3.26rem;height: .1rem;border-radius: .1rem;border:none;position: absolute;top:50%;left:50%;margin:-.05rem 0 0 -1.63rem;background: #fff;}
.por_b{display: block;position: absolute;height: .1rem;background: #093c70;border-radius: .1rem 0 0 .1rem; }
.playball{width: .29rem;height: .3rem;border:solid #093c70 .03rem;position: relative;border-radius: 50%;background: #f1f1f2;top:-.14rem;}
.pp{background: #000;display: none}
.page31-img2{width: .59rem;height: .46rem;position: absolute;top:0;left:50%;margin-left: -2.75rem;}
.page31-img3{width: .64rem;height: .45rem;position: absolute;top:0;left:50%;margin-left: 2.11rem;}
.time{position: absolute;width: 3.26rem;left: 50%;top:50%;margin:-.65rem 0 0 -1.63rem;}
.time span{font:.21rem/.22rem '';color: #093c70;}
.page31-img4{position: absolute;top:50%;left:50%;width: 2.1rem;height: 2.6rem;z-index: 10;margin:.42rem 0 0 -1.05rem;}
.page31-img5{position: absolute;top:50%;left:50%;width: 2.66rem;height: .66rem;z-index: 10;margin:3.8rem 0 0 -1.33rem;}
.mainImgPanel{width: 8.7rem;height: 12.8rem;position: absolute;top:50%;left:50%;margin:-6.4rem 0 0 -4.35rem;z-index: 1;}
.mainImgPanel img{position: absolute;top:0;left:0;width: 8.7rem;}
.mainImgPanel+.mainImgPanel{z-index: 4;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0}
.hide{width: 100%;height: 100%;position: fixed;top:0;left:0;background:#fff;z-index: 1000;}
.say-button{width: 3.66em;position: absolute;left: 50%;top: 50%;height:.99rem ;z-index: 2;margin: 4.3rem 0 0 -1.84rem;}

.dotting{
    min-width: 2px; min-height: 2px;
    box-shadow: 2px 0 currentColor, 6px 0 currentColor, 10px 0 currentColor; 
    -webkit-animation: dot 1.5s infinite step-start both;
    animation: dot 1.5s infinite step-start both;
    *zoom: expression(this.innerHTML = '...'); /* IE7 */
    position: absolute;top:50%;left:50%;margin:-1.8rem 0 0 .45rem;color: #093c71;
}
.dotting:before { content: '......';color: #093c71; } /* IE8 */
.dotting::before { content: '';color: #093c71; }
:root .dotting { margin-right: 8px; } /* IE9+,FF,CH,OP,SF */

@-webkit-keyframes dot {
    25% { box-shadow: none;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity: 0 
    }
    50% { box-shadow: 2px 0 currentColor; }
    75% { box-shadow: 2px 0 currentColor, 6px 0 currentColor;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);opacity: 1  }
}
@keyframes dot {
    25% { box-shadow: none; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity: 0 }
    50% { box-shadow: 2px 0 currentColor; }
    75% { box-shadow: 2px 0 currentColor, 6px 0 currentColor;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);opacity: 1  }
}
.recording-now{width: 3.8rem;height: 3.8rem;position: absolute;top:50%;left:50%;margin:-1.9rem 0 0 -1.9rem; display: none}
.recording-now img{display: block;width: 100%;height: 100%;top:0;left:0;}
.recording-now div{width: .3rem;height: .3rem;overflow: hidden;position: absolute;left:2.17rem;bottom:1.31rem;-webkit-animation: spanDh 1.5s infinite step-start both;animation: spanDh 1.5s infinite step-start both;}
.recording-now span{height: .06rem;background: #ffffff;width: .3rem;position: absolute;left:0;bottom:.24rem;}
.recording-now span+span{width: .28rem;bottom:.12rem;}
.recording-now span+span+span{width: .26rem;bottom:0;}
@-webkit-keyframes spanDh{
    25% { height: .06rem}
    50% { height: .18rem}
    75% { height: .3rem}
}
@keyframes spanDh{
    25% { height: .06rem}
    50% { height: .18rem}
    75% { height: .3rem}
}
.recording-play{width: 7.48em;height: 1.44rem;background:rgba(0,0,0,.5);position: absolute;top:50%;left:50%;margin:-.57rem 0 0 -3.74rem;border-radius: .12rem;display: none}
.recording-play .music{width: 7.48rem;margin:-.29rem 0 0 -3.74rem;}
.recording-play .page31-img2,.recording-play .page31-img3{margin-top: -.23rem}
.recording-play .time{margin: .2rem 0 0 -1.63rem;}
.recording-play .time span{color: #fff;}
.recording-button{width: 7.46rem;height: .99rem;position: absolute;left:50%;top:50%;margin:4.29rem 0 0 -3.73rem;display: none;}
.recording-button div{float: left;margin:0 .11rem;}
.recording-button1{width: 3.5rem;height: .9rem;background: url(../images/recording-button1.png?dt=1) no-repeat center top;background-size: 100% 100%;}
.recording-button2{width: 3.5rem;height: .9rem;background: url(../images/recording-button2.png?dt=23) no-repeat center top;background-size: 100% 100%;}
.logo{width: 1.44rem;position: absolute;top:50%;left:50%;margin:-4.38rem 0 0 -.72rem;}
.logo2{width: 1.44rem;position: absolute;top:50%;left:50%;margin:-5.4rem 0 0 -.72rem;}
.page-jc{background: url(../images/pagejc-bg.jpg?dt=1) no-repeat center top;background-size: 8.7rem 100%;}
.page-jc img{display: block;position: absolute;top:50%;left:50%;}
.jc-img1{width: 8.7rem;margin:-1.66rem 0 0 -4.35rem;}
.jc-img2{width: .15rem;margin:-1.33rem 0 0 -1.1rem;}
.jc-img3{width: .15rem;margin:-1.83rem 0 0 -1.03rem;}
.jc-img4{width: .23rem;margin:-2.1rem 0 0 -.72rem;}
.jc-img5{width: .15rem;margin:-1.96rem 0 0 -.15rem;}
.jc-img6{width: .23rem;margin:-2.32rem 0 0 .32rem;}
.jc-img7{width: .2rem;margin:-1.98rem 0 0 .8rem;}
.jc-img8{width: .13rem;margin:-1.59rem 0 0 .99rem;}
.page-jc .dotting{margin: .37rem 0 0 .82rem;}
@media screen and (max-width: 374px) {
   .page2-img4{margin: 4.45rem 0 0 -1.34rem;}
   .page3 img.page3-img1,.page4 img.page4-img1,.page5 img.page5-img1,.page6 img.page6-img1,.page7 img.page7-img1,.page8 img.page8-img1,.page9 img.page9-img1,.page10 img.page10-img1,.page11 img.page11-img1,.page12 img.page12-img1{top:-.8rem;}
   .page-g2 .page-change{margin: 4.44rem 0 0 .22rem;}
   .page-g2 .page-keep{margin: 4.44rem 0 0 -3.59rem;}
   .page6 .g-ul2{margin:1.75rem 0 0 -2.6rem;}
   .page6 .g-ul2 li{margin-bottom: .16rem;}
   .page4 .g-ul2{margin:1.8rem 0 0 -2.6rem;}
   .page4 .g-ul2 li{margin-bottom: .16rem;}
   .page31-img5{    margin: 3.6rem 0 0 -1.33rem;}
   .logo2{margin:-5rem 0 0 -.72rem;}
}