body {
    overflow-x: hidden;
    background: #93e0ff;
    font-family: Arial, Helvetica;
}
input[type="button"], input[type="submit"], input[type="reset"] {
    -webkit-appearance: none;
}
.footer {
    position: absolute;
    bottom: -310px;
    left: 50%;
    z-index: -1;
    width: 1500px;
    height: 542px;
    margin-left: -750px;
    background: url(../images/mypage/footer.png) center 0 no-repeat;
}
.sky {
    position: absolute;
    left: 50%;
    z-index: -1;
    width: 1500px;
    height: 245px;
    margin-left: -750px;
    background: url(../images/mypage/sky.png) center 0 no-repeat;
}
/*用户按钮区域*/

.mypage-user {
    position: relative;
    float: right;
    width: 300px;
    margin-top: 28px;
	font-size: 13px;	
    font-family: Arial, Helvetica;
}
#mypageuserBtn {
    display: block;
    float: left;
    overflow: hidden;
    width: 120px;
    height: 25px;
    margin: 0 20px 0 0;
    padding-right: 15px;
    line-height: 25px;
    text-align: right;
    background: url(../images/mypage/mypage-arrow-blue.png) right 68% no-repeat;
    font-weight: bold;
    cursor: pointer;
    text-overflow: ellipsis;
}
#mypageReturnBtn {
    display: block;
    float: left;
    width: 140px;
    height: 25px;
    line-height: 25px;
    background: #ff5000;
    border: 1px solid #d24200;
    color: white;
    text-align: center;
    cursor: pointer;
}
#mypageSelect {
    position: absolute;
    top: 30px;
    left: 25px;
    z-index: 999;
    overflow: hidden;
    clear: both;
    height: 0;
    padding-top: 2px;
    background: url(../images/mypage/mypage-select.png) 0 0 no-repeat;
    color: white;
}
#mypageA, #mypageSettingA, #mypageExitA {
    display: block;
    width: 130px;
    text-align: center;
    line-height: 30px;
    font-weight: bold;
}
/*内容*/

.content {
    position: absolute;
    top: 130px;
    left: 50%;
    width: 1040px;
    height: 947px;
    margin-left: -520px;
    background: url(../images/mypage/mypage-book.png) 0 0 no-repeat;
}
/*左边*/

.left {
    float: left;
    width: 350px;
}
.face {
    margin: 72px 0 0 142px;
    width: 131px;
    height: 131px;
    background: #FFF;
    border: 1px solid #d2a724;
}
.face img {
    width: 125px;
    height: 125px;
    margin: 3px;
}
.data {
    overflow: hidden;
    width: 145px;
    margin: 15px 0 0 135px;
    line-height: 20px;
}
.data div {
    padding-top: 15px;
}
.data_gold {
    text-align: center;
}
.data div p {
    display: inline-block;
    padding: 0 10px 2px;
    background: url(../images/mypage/line.png) no-repeat 0 bottom;
}
.data_bottom {
    padding: 0 0 2px;
    background: url(../images/mypage/line.png) no-repeat center bottom;
}
.data span {
    display: inline-block;
}
.data .li1 {
    background: url(../images/mypage/gold-l.png) no-repeat 0 center;
    text-indent: 20px;
}
.data .li2 {
    width: 65px;
    margin-left: 10px;
    background: url(../images/mypage/cert-l.jpg) no-repeat 0 center;
    text-indent: 20px;
}
.data .li3 {
    background: url(../images/mypage/gift.png) no-repeat 0 center;
    text-indent: 20px;
}
.info {
    margin: 140px 0 0 110px;
}
.info li {
    width: 190px;
    height: 40px;
}
/*右边*/

.right {
    float: left;
    width: 650px;
}
.right h2 {
    float: left;
    margin-left: 70px;
    color: #dd3e00;
}
.right .more {
    display: block;
    float: right;
    margin-top: 10px;
    color: #dd3e00;
}
.right ul {
    clear: both;
    height: 190px;
}
.right_title {
    overflow: hidden;
    height: 30px;
}
.progress-abstract {
    margin-top: 80px;
}
.progress-abstract ul {
    padding: 10px 0 12px 50px;
}
.progress-abstract li {
    height: 33px;
    background: url(../images/mypage/my-underline.png) 0 bottom no-repeat;
}
.progress-abstract li:last-child {
    background: none;
}
.progress-abstract li div {
    display: none;
    padding-right: 30px;
    line-height: 33px;
    text-indent: 25px;
}
.progress-abstract .div-class {
    background: url(../images/mypage/gold-l.png) 0 center no-repeat;
}
.progress-abstract .div-cert {
    background: url(../images/mypage/cert-l.jpg) 0 center no-repeat;
}
.progress-abstract .div-gift {
    background: url(../images/mypage/gift.png) 0 center no-repeat;
}
.progress-abstract .div-maga {
    background: url(../images/mypage/gold-l.png) 0 center no-repeat;
}
.progress-abstract .name, .progress-abstract .grade, .progress-abstract .class, .progress-abstract .NO {
    color: #0a7d01;
}
.progress-abstract .con, .progress-abstract .num {
    color: #e93100;
}
.progress-abstract .time {
    float: right;
    width: 80px;
    text-align: right;
    text-indent: 0;
}
.cert-abstract ul {
    height: 200px;
    padding: 20px 0 0 50px;
}
.cert-abstract li {
    display: none;
    float: left;
    width: 120px;
    text-align: center;
}
.cert-abstract li img {
    width: 92px;
    height: 130px;
    cursor: pointer;
}
.cert-abstract li em {
    display: block;
    text-align: center;
    font-style: normal;
}
.cert-abstract li span {
    display: block;
    text-align: center;
    color: #e84802;
}
.gift-abstract {
    position: relative;
}
.gift-abstract ul {
    padding: 30px 0 0 45px;
}
.gift-abstract li {
    display: none;
    float: left;
    margin-right: 18px;
    padding: 6px 6px 0;
}
.gift-abstract li:nth-child(1) {
    background: url(../images/mypage/one.png) 0 0 no-repeat;
}
.gift-abstract li:nth-child(2) {
    background: url(../images/mypage/two.png) 0 0 no-repeat;
}
.gift-abstract li:nth-child(3) {
    background: url(../images/mypage/three.png) 0 0 no-repeat;
}
.gift-abstract li:nth-child(4) {
    background: url(../images/mypage/four.png) 0 0 no-repeat;
}
.gift-abstract li:nth-child(5) {
    margin-right: 0;
    background: url(../images/mypage/five.png) 0 0 no-repeat;
}
.gift-abstract li img {
    width: 92px;
    height: 92px;
    margin-bottom: 5px;
}
.gift-abstract li span {
    display: block;
    line-height: 20px;
    text-align: center;
    color: #e84802;
}
.gift-abstract li em {
    display: block;
    line-height: 20px;
    text-align: center;
    font-style: normal;
}
.recording-abstract ul {
    padding: 20px 0 0 60px;
}
.recording-abstract li {
    display: none;
    float: left;
    width: 230px;
    height: 130px;
    padding-left: 30px;
    background: url(../images/mypage/record-yun.png) 0 0 no-repeat;
}
.recording-abstract li:nth-child(1) {
    margin-right: 40px;
}
.recording-abstract .name, .recording-abstract .play, .recording-abstract .plan, .recording-abstract .time, .recording-abstract .download {
    display: block;
}
.recording-abstract .play, .recording-abstract .plan, .recording-abstract .time, .recording-abstract .download {
    float: left;
}
.recording-abstract .name {
    margin-top: 30px;
    margin-bottom: 12px;
}
.recording-abstract .play {
    width: 19px;
    height: 19px;
    background: url(../images/mypage/mypage-playbtn.png) 0 0 no-repeat;
}
.recording-abstract .plan {
    width: 110px;
    height: 10px;
    margin-top: 3px;
    background: blue;
}
.recording-abstract .time {
    width: 40px;
}
.recording-abstract .download {
    width: 24px;
    height: 18px;
    background: url(../images/mypage/mypage-down.png) 0 0 no-repeat;
}
/*progress页面*/

.progress {
    top: 140px;
    height: 827px;
    background: url(../images/mypage/book.png) 0 0 no-repeat;
}
.content .h {
    height: 34px;
    margin: 55px 0 0 100px;
    text-indent: 45px;
    line-height: 34px;
    color: #dd3e00;
}
.content .progress-header {
    color: black;
    background: url(../images/mypage/progress.png) 0 0 no-repeat;
}
.progress-nav {
    float: left;
    width: 320px;
    height: 612px;
    margin: 14px 0 0 0px;
    padding-top: 20px;
    background: url(../images/mypage/dashed.png) right 0 no-repeat;
}
.progress-nav li {
    height: 25px;
    padding-bottom: 2px;
    margin-left: 120px;
    padding-top: 15px;
}
.select {
    background: url(../images/mypage/mypage-pro-ov.png) 0 bottom no-repeat;
}
.progress-nav a {
    display: block;
    width: 100%;
    height: 100%;
    margin-left: 10px;
    line-height: 25px;
    font-size: 16px;
    text-decoration: none;
    color: #000000;
    text-indent: 35px;
}
.select a {
    color: #de4600;
}
.progress-nav #a1 {
    text-indent: 5px;
}
.progress-nav #a2 {
    background: url(../images/mypage/gold.png) 0 0 no-repeat;
}
.progress-nav #a3 {
    background: url(../images/mypage/nav-gift.jpg) 0 0 no-repeat;
}
.progress-nav #a4 {
    background: url(../images/mypage/cert.png) 0 0 no-repeat;
}
.list-info {
    float: left;
    width: 610px;
    margin: 35px 0 0 30px;
}
.list-info li {
    text-indent: 25px;
    height: 35px;
}
.list-info:nth-child(3) {
    display: none;
}
.gold-info, .maga-info {
    background: url(../images/mypage/underline-gold.jpg) 0 0 no-repeat;
}
.gift-info {
    background: url(../images/mypage/underline-gift.jpg) 0 0 no-repeat;
}
.cert-info {
    background: url(../images/mypage/underline-cert.jpg) 0 0 no-repeat;
}
.list-info li .name {
    color: #0a7d01;
}
.list-info li .con {
    color: #0a7d01;
}
.list-info li .grade {
    color: #e93100;
}
.list-info li .class {
    color: #e93100;
}
.list-info li .time {
    float: right;
    width: 130px;
    text-indent: 0;
    text-align: right;
}
/*礼物页*/

.cert {
    top: 140px;
    height: 827px;
    background: url(../images/mypage/book.png) 0 0 no-repeat;
}
.cert .cert-header {
    background: url(../images/mypage/cert.jpg) 0 center no-repeat;
    color: black;
    text-indent: 45px;
    font-size: 24px;
}
.cert-list-wrap {
    overflow: hidden;
    width: 900px;
    height: 565px;
    margin: 20px 0 0 150px;
}
.cert-list {
    display: none;
    float: left;
    width: 420px;
    height: 150px;
    margin-top: 40px;
}
.cert-list img {
    float: left;
    width: 100px;
    height: 125px;
    margin-right: 15px;
    cursor: pointer;
}
.cert-list ul {
    float: left;
    width: 240px;
    height: 100px;
}
.cert-list li {
    margin-bottom: 15px;
    line-height: 20px;
}
.cert-list em {
    display: block;
}
.cert-list span {
    display: block;
}
.cert-list a {
    display: block;
    float: left;
    width: 120px;
    height: 25px;
    line-height: 25px;
    background: #ff7c05;
    border-radius: 3px;
    text-align: center;
    color: white;
}
.cert-nav {
    position: absolute;
    bottom: 128px;
    right: 0;
    float: right;
    padding-right: 45px;
}
.cert-nav ul {
    float: left;
}
.cert-nav li, .cert-next, .cert-prev {
    display: none;
    float: left;
    width: 25px;
    height: 25px;
    margin-right: 3px;
    line-height: 25px;
    border: 1px solid #ff5000;
    text-align: center;
    color: #ff9b6e;
    cursor: pointer;
}
.cert-next, .cert-prev {
    width: 40px;
}
li.cert-check {
    background: #ffe7ae;
    color: black;
}
.cert-print {
    width: 675px;
    height: 30px;
    margin: 70px 0 0 320px;
}
.cert-print-left {
    position: relative;
    float: left;
    width: 405px;
}
.cert-print-left img {
    width: 400px;
    height: 500px;
}
.cert-print-right {
    float: left;
    width: 270px;
}
.cert-print-right .up {
    height: 470px;
}
.cert-print-right .btns a {
    display: block;
    float: left;
    width: 120px;
    height: 30px;
    background: #ff7c05;
    border-radius: 3px;
    color: white;
    text-align: center;
    line-height: 30px;
}
.cert-print-right .btns .print {
    margin-right: 20px;
}
/*礼物页*/

.content .gift-h {
    background: url(../images/mypage/gift.jpg) 0 0 no-repeat;
}
.gift-shop {
    background: url(../images/mypage/shop.jpg) 0 0 no-repeat;
}
.my-gift {
    background: url(../images/mypage/nav-gift.jpg) 0 0 no-repeat;
}
.gift-list-wrap {
    float: left;
    width: 650px;
    margin: 60px 0 0 35px;
}
.my-wrap {
    display: none;
}
.gift-list {
    display: none;
    float: left;
    width: 100px;
    height: 245px;
    margin-right: 30px;
}
.gift-list .img-wrap {
    display: block;
    width: 100px;
    height: 100px;
    margin: 0 auto;
    border: 2px solid #ecd021;
    text-align: center;
}
.gift-list span {
    display: block;
    margin: 0 auto;
    text-align: center;
}
.gift-list img {
    width: 100px;
    height: 100px;
}
.gift-list .name {
    margin-top: 10px;
}
.gift-list .price {
    width: 50px;
    height: 24px;
    line-height: 24px;
    margin-top: 5px;
    background: url(../images/mypage/gold.png) 0 0 no-repeat;
    color: #ff4527;
    text-indent: 30px;
}
.gift-list .buy-btn {
    width: 70px;
    height: 30px;
    margin: 10px auto 0;
    border-radius: 3px;
    background: #ff7c05;
    line-height: 30px;
    color: white;
    font-size: 15px;
    text-align: center;
    display: block;
}
.gift-nav {
    clear: none;
}
.gift-detail-info {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 777;
    width: 450px;
    height: 330px;
    margin-left: -225px;
    margin-top: -170px;
    background: white;
    border: 6px solid #99d900;
    border-radius: 15px;
}
.gift-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 26px;
    height: 26px;
    background: url(../images/mypage/gift-close.jpg) 0 0 no-repeat;
}
.gift-close:hover {
    background: url(../images/mypage/gift-close-hover.jpg) 0 0 no-repeat;
}
.gift-detail-info .title {
    display: block;
    text-align: center;
    font-size: 18px;
    width: 300px;
    height: 50px;
    margin: 0 auto;
    line-height: 50px;
    border-bottom: 1px solid #98d700;
}
.gift-detail-info img {
    width: 167px;
    height: 177px;
    display: block;
    margin: 10px auto 0;
}
.gift-detail-info .name {
    display: block;
    margin-top: 5px;
    font-size: 18px;
    text-align: center;
}
.gift-detail-info .btn {
    display: block;
    width: 165px;
    height: 30px;
    line-height: 30px;
    margin: 15px auto 0px;
    background: #6ec200;
    text-align: center;
    color: white;
    border-radius: 3px;
    font-size: 14px;
}
.gift-my-info {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 777;
    width: 450px;
    height: 340px;
    margin-left: -225px;
    margin-top: -170px;
    background: white;
    border: 6px solid #99d900;
    border-radius: 10px;
}
.my-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 26px;
    height: 26px;
    background: url(../images/mypage/gift-close.jpg) 0 0 no-repeat;
}
.my-close:hover {
    background: url(../images/mypage/gift-close-hover.jpg) 0 0 no-repeat;
}
.gift-my-info .title {
    display: block;
    text-align: center;
    font-size: 18px;
    width: 300px;
    height: 50px;
    margin: 0 auto;
    line-height: 50px;
    border-bottom: 1px solid #98d700;
}
.gift-my-info img {
    width: 167px;
    height: 177px;
    display: block;
    margin: 10px auto 0;
}
.gift-my-info .name {
    display: block;
    margin-top: 10px;
    font-size: 18px;
    text-align: center;
}
.gift-my-info .price {
    display: block;
    width: 50px;
    height: 24px;
    margin: 20px auto 0px;
    background: url(../images/mypage/gold.png) 0 0 no-repeat;
    text-indent: 30px;
    line-height: 24px;
    color: #ff4527;
}
.gift-my-info .btn {
    display: block;
    width: 165px;
    height: 30px;
    line-height: 30px;
    margin: 10px auto 0;
    background: #6ec200;
    text-align: center;
    color: white;
    border-radius: 3px;
}
.my-list .time {
    display: block;
    margin-top: 5px;
    color: #ff4527;
    text-align: center;
}
/*录音*/

.content .recording-h {
    background: url(../images/mypage/record-sign.jpg) 0 0 no-repeat;
}
a.all-btn {
    text-indent: 5px;
}
.progress-nav .pinyin {
    background: url(../images/mypage/record-p.jpg) 0 0 no-repeat;
}
.progress-nav .kindergarten {
    background: url(../images/mypage/record-k.jpg) 0 0 no-repeat;
}
.progress-nav .grade1 {
    background: url(../images/mypage/record-g1.jpg) 0 0 no-repeat;
}
.progress-nav .grade2 {
    background: url(../images/mypage/record-g2.jpg) 0 0 no-repeat;
}
.progress-nav .grade3 {
    background: url(../images/mypage/record-g3.jpg) 0 0 no-repeat;
}
.progress-nav .grade4 {
    background: url(../images/mypage/record-g4.jpg) 0 0 no-repeat;
}
.progress-nav .grade5 {
    background: url(../images/mypage/record-g5.jpg) 0 0 no-repeat;
}
.progress-nav .grade6 {
    background: url(../images/mypage/record-g6.jpg) 0 0 no-repeat;
}
.recording-list-wrap {
    overflow: hidden;
    float: left;
    width: 630px;
    height: 520px;
    margin: 40px 0 25px 50px;
}
.recording-list {
    display: none;
    float: left;
    width: 260px;
    height: 130px;
    background: url(../images/mypage/record-yun.png) 0 0 no-repeat;
}
.recording-list .name {
    margin: 30px 0 12px 30px;
}
.recording-list .name span {
    display: inline;
}
.recording-list .play {
    width: 19px;
    height: 19px;
    margin-left: 30px;
    background: url(../images/mypage/mypage-playbtn.png) 0 0 no-repeat;
}
.recording-list .plan {
    width: 110px;
    height: 10px;
    margin-top: 3px;
    background: blue;
}
.recording-list .time {
    width: 40px;
}
.recording-list .download {
    width: 24px;
    height: 18px;
    background: url(../images/mypage/mypage-down.png) 0 0 no-repeat;
}
.recording-list a, .recording-list span {
    display: block;
}
.recording-list .play, .recording-list .plan, .recording-list .time, .recording-list .download {
    float: left;
}
/*设置*/

.content .setting-h {
    margin-bottom: 14px;
}
.setting-nav {
    margin-top: 0;
}
.setting-nav .picture {
    background: url(../images/mypage/head.jpg) 0 0 no-repeat;
}
.setting-nav .setting-info {
    background: url(../images/mypage/info.png) 0 0 no-repeat;
}
.setting-nav .passwrod {
    background: url(../images/mypage/clock.png) 0 0 no-repeat;
}
.pic-wrap, .set-wrap, .pas-wrap {
    float: left;
}
.pic-wrap {
    padding: 75px 0 0 70px;
}
.set-wrap, .pas-wrap {
    display: none;
}
.pic-con {
    overflow: hidden;
    float: left;
    width: 167px;
    height: 167px;
    background: white;
    border: 1px solid #dfe0c3;
}
.pic-con img {
    display: block;
    width: 163px;
    height: 163px;
    margin: 2px auto;
}
.pic-change {
    float: left;
    margin-left: 60px;
    font-size: 16px;
    font-weight: normal;
}
.pic-change h3 {
    font-weight: normal;
}
.pic-change .path {
    margin-top: 15px;
}
.pic-change .path input:nth-child(1) {
    display: none;
}
.pic-change .path input:nth-child(2) {
    vertical-align: top;
    width: 220px;
    height: 20px;
    border: 1px solid #b4b4b4;
}
.pic-change .path a {
    display: inline-block;
    vertical-align: top;
    width: 72px;
    height: 22px;
    background: #6ec200;
    border: 5px;
    color: white;
    text-align: center;
    line-height: 22px;
    border-radius: 3px;
    margin-left: 5px;
    font-size: 15px;
}
.pic-change .tag {
    margin-top: 10px;
    color: #989898;
}
.pic-change .btn {
    margin-top: 40px;
}
.pic-change .btn a, .pic-change .btn input {
    display: inline-block;
    width: 120px;
    height: 30px;
    background: #ff7c05;
    border-radius: 5px;
    color: white;
    text-align: center;
    line-height: 30px;
    cursor: pointer;
    border: none;
    font-size: 15px;
    margin-right: 20px;
}
.pic-change .btn a:nth-child(2) {
    margin-left: 20px;
}
.set-wrap ul {
    margin-top: 70px;
    font-size: 15px;
}
.set-wrap li {
    height: 40px;
}
.set-wrap li input:nth-child(4) {
    margin-left: 10px;
}
.set-wrap li span {
    display: inline-block;
    width: 170px;
    margin-right: 20px;
    text-align: right;
}
.set-wrap li em {
    font-style: normal;
}
.set-wrap li select:nth-child(2) {
    width: 110px;
    height: 25px;
    border: 1px solid #b4b4b4;
}
.set-wrap li input[type=text] {
    width: 170px;
    height: 25px;
    border: 1px solid #b4b4b4;
}
.set-wrap .btn {
    margin-top: 40px;
}
.set-wrap .btn a, .set-wrap .btn input {
    display: inline-block;
    width: 140px;
    height: 30px;
    background: #ff7c05;
    text-align: center;
    line-height: 30px;
    color: white;
    border-radius: 3px;
    font-size: 15px;
}
.set-wrap .btn a {
    margin-left: 190px;
}
.set-wrap .btn input {
    margin-left: 25px;
    border: none;
}
.pas-wrap ul {
    margin-top: 60px;
}
.pas-wrap li {
    height: 50px;
}
.pas-wrap span {
    display: inline-block;
    width: 185px;
    margin-right: 10px;
    font-size: 15px;
    text-align: right;
}
.pas-wrap input {
    width: 220px;
    height: 25px;
    border: 1px solid #b1b1b1;
}
.pas-wrap a:nth-child(3), .pas-wrap em {
    margin-left: 10px;
    color: #999999;
    font-style: normal;
}
.pas-wrap a:nth-child(3) {
    text-decoration: underline;
}
.pas-wrap .btn {
    margin-top: 40px;
    font-size: 15px;
}
.pas-wrap .btn a {
    display: inline-block;
    width: 140px;
    height: 30px;
    background: #ff7c05;
    text-align: center;
    line-height: 30px;
    color: white;
    border-radius: 3px;
}
.pas-wrap .btn a:nth-child(1) {
    margin-left: 200px;
}
.pas-wrap .btn a:nth-child(2) {
    margin-left: 25px;
}
.tap {
    position: absolute;
    top: 30px;
    z-index: 2;
    height: 80%;
    background: url(../images/mypage/tap.png) 50px 10px no-repeat;
}
#studentName {
    position: absolute;
    left: 0px;
    width: 400px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 25px;
}