html { font-size:1em;-webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight:rgba(0,0,0,0);-webkit-text-size-adjust:none;overflow:-moz-scrollbars-vertical;/*强制firefox出现滑动条*/}
body { font-size:0.75em;-webkit-user-select: none;}
label { cursor:pointer;}
a:link, a:visited { text-decoration:none;}
input:focus { outline: none; }
input,button,select,textarea{outline:none;/*-webkit-appearance:none;*//*强制去除表单自带的样式*/ }
textarea{resize:none;/*-webkit-appearance:none;*//*强制去除textarea自带的样式*/ }

input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; } /*利用阴影来填充掉input自动填充色*/

textarea,input,select { background: none; border:none; margin: 0; padding: 0; }

a, abbr, acronym, address, applet, article, aside, audio, b, blockquote, big, body, center, canvas, caption, cite, code, command, datalist, dd, del, details, dfn, dl, div, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, keygen, label, legend, li, meter, nav, menu, object, ol, output, p, pre, progress, q, s, samp, section, small, span, source, strike, strong, sub, sup, table, tbody, tfoot, thead, th, tr, tdvideo, tt,
u, ul, var { margin:0; padding:0;}

article, aside, footer, header, hgroup, nav, section, figure, figcaption { display: block;} /*html5设置*/

h1, h2, h3, h4, h5, h6, th, td, table, input, button, select, textarea, sub{ font-size:1em;}
body, input, button, select, textarea, sub{ font-family:Arial, sans-serif;}
em, cite, address, optgroup { font-style:normal;}
kbd, samp, code { font-family:monospace;}

img, input, button, select, textarea { vertical-align:middle;outline:none;}
ul, ol { list-style:none;}
img, fieldset { border:0;}
abbr, acronym { cursor:help; border-bottom:1px dotted black;}
table {	width:100%; border-spacing:0; border:0;}
table th, table td { border:0;}
legend, hr { overflow:hidden; position:absolute; top:0; left:0;}
legend, hr, caption { visibility:hidden; font-size:0; width:0; height:0; line-height:0;}

/**
 * = global 统一样式
 *******************************************************************************************************/
/* 改变动画的效果方式*/
* {
  -webkit-transition-timing-function: ease-in-out;
     -moz-transition-timing-function: ease-in-out;
      -ms-transition-timing-function: ease-in-out;
       -o-transition-timing-function: ease-in-out;
          transition-timing-function: ease-in-out;
}
html {height: 100%;}
body { position: relative; font-family:"微软雅黑"; width: 640px; max-width: 640px; min-width: 640px; height: 100%; margin: 0 auto; }
body h1,body h2,body h3,body h4,body h5,body h6,body strong,body em {font-weight:normal; } /*微软雅体 将原有的bold属性去掉*/

textarea:focus,input:focus { border: 1px solid #71b643; }
.pagebg{ 
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
}

.page1{
    background-image: url(https://objs.auto-learning.com/h5/1.gif);
}
.word1{background-image: url(https://objs.auto-learning.com/h5/1@2x.png);
     background-position: top center; 
     background-repeat: no-repeat; 
     background-size: contain; 
     z-index: 10; 
     position: absolute; 
     top: 110px; 
     left: 20px; 
     right: 20px; 
     height: 160px; }


.page2{
    background-image: url(https://objs.auto-learning.com/h5/2.gif)
}
.word2a{background-image: url(https://objs.auto-learning.com/h5/2.3@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 200px; 
    left: 130px; 
    right: 35px; 
    height: 100px; }
.word2b{background-image: url(https://objs.auto-learning.com/h5/2.1@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 270px; 
    left: 250px; 
    right: 35px; 
    height: 100px; }
.word2c{background-image: url(https://objs.auto-learning.com/h5/2.2@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 340px; 
    left: 135px; 
    right: 35px; 
    height: 300px; }
.page3{
    background-image: url(https://objs.auto-learning.com/h5/3.gif)
}
.word3a{background-image: url(https://objs.auto-learning.com/h5/3.1@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 320px; 
    left: 60px; 
    right: 160px; 
    height: 100px; }
.word3b{background-image: url(https://objs.auto-learning.com/h5/3.2@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 380px; 
    left: 120px; 
    right: 120px; 
    height: 100px; }

.page4{
    background-image: url(https://objs.auto-learning.com/h5/4.gif)
}
.word4a{background-image: url(https://objs.auto-learning.com/h5/4.1@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 700px; 
    left: 50px; 
    right: 160px; 
    height: 100px; }
.word4b{background-image: url(https://objs.auto-learning.com/h5/4.2@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 760px; 
    left: 110px; 
    right: 130px; 
    height: 100px; }

.word5a{background-image: url(https://objs.auto-learning.com/h5/5.1@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 440px; 
    left: 160px; 
    right: 160px; 
    height: 100px; }
.word6a{background-image: url(https://objs.auto-learning.com/h5/6.1@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 440px; 
    left: 120px; 
    right: 120px; 
    height: 100px; }

.word7a{background-image: url(https://objs.auto-learning.com/h5/7.1@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 440px; 
    left: 120px; 
    right: 120px; 
    height: 100px; }

.word8a{background-image: url(https://objs.auto-learning.com/h5/8.1@2x.png);
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: contain; 
    z-index: 10; 
    position: absolute; 
    top: 430px; 
    left: 120px; 
    right: 120px; 
    height: 100px; }

 .blur0{ 
    filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */
    -webkit-filter: blur(3px); /* Chrome, Opera */
       -moz-filter: blur(3px);
        -ms-filter: blur(3px);   
            filter: blur(3px);
 }
 .blur1{ 
    filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */
    -webkit-filter: blur(10px); /* Chrome, Opera */
       -moz-filter: blur(10px);
        -ms-filter: blur(10px);   
            filter: blur(10px);
 }
 .blur2{ 
    filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */
    -webkit-filter: blur(20px); /* Chrome, Opera */
       -moz-filter: blur(20px);
        -ms-filter: blur(20px);   
            filter: blur(20px);
 }
 .blur3{ 
    filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */
    -webkit-filter: blur(30px); /* Chrome, Opera */
       -moz-filter: blur(30px);
        -ms-filter: blur(30px);   
            filter: blur(30px);
 }
 .blur4{ 
    filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */
    -webkit-filter: blur(40px); /* Chrome, Opera */
       -moz-filter: blur(40px);
        -ms-filter: blur(40px);   
            filter: blur(40px);
 }

 .page10{
    background-image: url(https://objs.auto-learning.com/h5/102x.png);
    background-size: 640px;
}
.shuruK{
    position: absolute;
    z-index: 20;
    top: 350px;
    left: 0px;
    right: 0px;
    height: 400px;
    background-image: url(https://objs.auto-learning.com/h5/9.1@2x.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
    text-align: center;
    display: none;
}
.shuruK .title{font-size: 42px; text-align: center; padding-top: 90px;margin-bottom: 20px;}
.shuruK input{
    background: #f3f0eb;
    border: 1px solid #594739;
    border-radius: 1px;
    width: 380px;
    padding-left: 20px;
    height: 55px;
    line-height: 55px;
    color: #594739;
    margin: 0 auto;
    clear: both;
    font-size: 26px;
}
.shuruK button{
    clear: both;
    width: 180px;
    height: 60px;
    margin-top: 20px;
    font-size: 26px;
}
.xuanzeti{
    position: absolute;
    top: 320px;
    text-align: center;
    left: 100px;
    right: 0;    
    font-size: 32px;
    display: none;
    z-index: 12;
}
#q6{line-height:120% !important; }
.wenti{
    position: absolute; 
    top: 380px;
    left: 160px;
    right: 110px;
    height: 420px;
    z-index: 11;
    font-size: 26px;
    line-height: 160%;
    font-family: '宋体',Arial, Helvetica, sans-serif;
    color: #313131;
    display: none;

}
.wenti h2{font-size: 28px; margin-bottom: 10px;}
.wenti h3{font-size: 28px; margin-bottom: 10px; font-weight: 600;}
.wenti p{padding:20px; padding-bottom: 20px;}
.wenti p span{width: 30px; height: 30px; float: right; border:1px solid #594739;}
.gou{background-image: url(https://objs.auto-learning.com/h5/10.6@2x.png); background-size: 30px 24px; background-repeat: no-repeat;background-position: center center;}
.wancheng{ 
    height: 30px;
    position: absolute;
    z-index: 40;
    top: 250px;
    left: 235px;
    right: 50px;
    display: none;
}
.ok{width: 54px; height: 28px; background-image: url(https://objs.auto-learning.com/h5/10.3@2x.png); background-position: center center; background-size:28px 28px; background-repeat: no-repeat;float: left;}

.pagebgc{ background-size: 640px 872px; width:640px; height: 1028px; position: relative;}
.page11{
    background-image: url(../images/17.32x.jpg);
    background-size: 640px 872px;
    background-position: top center;

}
.schoolshow{
    
    text-align: center;
    transform: rotate(-8deg); 
-o-transform: rotate(-8deg); 
-webkit-transform: rotate(-8deg); 
-moz-transform: rotate(-8deg); 
    position: absolute;
    left: 50px;
    right: 0px;
    width: 560px;
    top: 80px;
    z-index: 51;
    font-size: 45px;
    line-height: 150%;
    font-weight: 600;
    color: #7f5942;
}
.userName{font-size: 26px; font-weight: 600;padding-bottom: 20px;}
.result{
    position: absolute;
    left: 160px;
    top:350px;
    right: 60px;
    line-height: 180%;
    font-size: 26px;
    z-index: 50;
    color: #553928;
}
#school{color: #e96733; font-size: 60px; letter-spacing: 10px; }
#topic{display: none; width: 640px; height: 1028px; position: relative;}
.resultpic{position: absolute; top: 0;left: 0;right: 0;bottom: 0; z-index: 200; display: none}
.resultpic div img{width: 100%;}
.jiexiao{position:absolute; top: 780px; left: 500px; height: 50px; z-index: 80;}
.gk_qrcode{position: absolute;top: 860px; left: 0;right: 0; height: 170px;z-index: 70; background-image: url(../images/gk_qrcodes.jpg); background-size:contain; background-repeat: no-repeat;}

.xingming{position: absolute; top: 700px; left: 12px; height:48px; width: 140px; overflow: hidden; transform: rotate(-90deg); 
    -o-transform: rotate(-90deg); 
    -webkit-transform: rotate(-90deg); 
    -moz-transform: rotate(-90deg); 
    color: #594739;
font-size: 20px;
z-index: 300;} 
.savepicword{position: absolute; top: 780px; left: 165px; font-size:28px; color: #553928; z-index: 1000;}
.writepic{background-image: url(https://objs.auto-learning.com/h5/shou@2x.png); background-size: 210px 307px; background-repeat: no-repeat; width: 210px; height: 307px; position: absolute; right: -210px; top:730px; z-index: 5; display: none}
.xiangpica{background-image: url(https://objs.auto-learning.com/h5/xpc@2x.png); background-size: 120px 113px; background-repeat: no-repeat; width: 120px; height: 113px; position: absolute; right: 640px; top:340px; z-index: 5; display: none}
.loading{position: absolute; top: 0;left: 0;right: 0;bottom: 0; z-index: 2000; display: none;};
.loading img{width: 100%; height: 100%;}
.blackbg{background: #000000; opacity: 0.8; width: 100%; height: 100%;}
.music{position: absolute;top: 10px; right: 10px; width: 60px; height: 60px; z-index: 2000}