/*去除点击半透明色块*/
*{ margin:0; padding:0; -webkit-tap-highlight-color: rgba(0,0,0,0);/*让容器在计算宽度的时候，从边框位置开始计算*/
    box-sizing: border-box;}
/*禁止横竖屏切换时字体大小缩放*/
html{-webkit-text-size-adjust: 100%;height:100%; width: 100%;}
body { font-size:20px; color:#3C3C3C; font-family:Microsoft YaHei,Verdana,Simsun; background:#fff;  height:100%;width: 100%;}
/*html5标签转为块级元素*/
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary,img {display: block;}
fieldset, img { border:0; display:block;}
ol, ul { list-style:none; }
h1, h2, h3, h4, h5, h6{ font-size:100%; }
em { font-style:normal; }
input, button, select, textarea { outline:none; }
textarea { resize:none; }
a { color: #666; text-decoration:none; }
a:hover { color:#f40; text-decoration:none;}
/*去除IOS下输入框内阴影*/
input,textarea{ border:none; -webkit-appearance: none; }
.clearfix:before,.clearfix:after{
    content:"";
    display:table;
}
.clearfix:after{
    clear:both;
}
.clearfix{
    zoom:1;
}

@media only screen and (max-width: 1080px), only screen and (max-device-width:1080px) {
    html,body {
        font-size:33.75px;
    }
}
@media only screen and (max-width: 960px), only screen and (max-device-width:960px) {
    html,body {
        font-size:30px;
    }
}
@media only screen and (max-width: 800px), only screen and (max-device-width:800px) {
    html,body {
        font-size:25px;
    }
}
@media only screen and (max-width: 720px), only screen and (max-device-width:720px) {
    html,body {
        font-size:22.5px;
    }
}
@media only screen and (max-width: 640px), only screen and (max-device-width:640px) {
    html,body {
        font-size:20px;
    }
}
@media only screen and (max-width: 600px), only screen and (max-device-width:600px) {
    html,body {
        font-size:18.75px;
    }
}
@media only screen and (max-width: 540px), only screen and (max-device-width:540px) {
    html,body {
        font-size:16.875px;
    }
}
@media only screen and (max-width: 480px), only screen and (max-device-width:480px) {
    html,body {
        font-size:15px;
    }
}
@media only screen and (max-width: 414px), only screen and (max-device-width:414px) {
    html,body {
        font-size:12.9375px;
    }
}
@media only screen and (max-width: 400px), only screen and (max-device-width:400px) {
    html,body {
        font-size:12.5px;
    }
}
@media only screen and (max-width: 375px), only screen and (max-device-width:375px) {
    html,body {
        font-size:11.71875px;
    }
}
@media only screen and (max-width: 360px), only screen and (max-device-width:360px) {
    html,body {
        font-size:11.25px;
    }
}
@media only screen and (max-width: 320px), only screen and (max-device-width:320px) {
    html,body {
        font-size:10px;
    }
}
@media only screen and (max-width: 240px), only screen and (max-device-width:240px) {
    html,body {
        font-size:7.5px;
    }
}


/*主要视图区域*/
.main{
    width: 100%;
    max-width:640px;
    min-width:320px;
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
    position:absolute;
}

/*首页*/
.poR{
    position: relative;
}
.indexmain{
    width: 100%;
    height: 100%;
    background:url("../images/indexbg.jpg") no-repeat top center;
    background-size:cover;
}
.button{
    position: absolute;
    bottom:10px;
    left:50%;
    margin-left:-2.8rem;
    width:5.6rem;
    z-index: 56;
}
.buttonsmall{
    position: absolute;
    bottom:5px;
       right: 50%;
    margin-right: -11rem;
    width:4rem;
     z-index: 56;
}
.indexWordsC{
    position:absolute;
    bottom:11rem;
    width:100%;
    height:100px;
    overflow: hidden;
}
.indexWords{
    text-align: center;
    font-size:16px;
    line-height:26px;
}


/*图片上传*/
/*.imgUp{*/
    /*background:url("")*/
/*}*/


/*选择衣服*/
.pick{
    background:url("../images/pickbg.jpg") no-repeat top center;
    background-size:cover;
}
.pickTit{
    width: 100%;
    margin-top:3rem;
}



/*祝福文字页面*/
.words{
  background:url("../images/wordsbg.jpg") no-repeat top center;
  background-size:cover;
}
.writewords{
    margin-top:6rem;
}
.toWords{
    width:15.85rem;
    height:25.35rem;
    background:url("../images/paper.png") no-repeat top center;
    background-size:cover;
    position:absolute;
    right:0.5rem;
    top:11rem;
}
.wordsContent{
    width: 100%;
    height: 14rem;
    background-color: rgba(225,225,225,0);
    color: #5e4537;
    font-size: 15px;
    line-height: 24px;
    overflow-y: scroll;
    padding: 10px 10px 45px 10px;
    text-indent: 30px;
}
.wwordsleft{
    float:left;
    width:6rem;
    margin-left:1rem;
}
.wwordsright{
    float:right;
    width:6rem;
    margin-right:1rem;
}
.sharepage{
    position:fixed;
    top:0;
    left:0;
    z-index:780;
    width: 100%;
    height: 100%;
    background-color:rgba(0,0,0,0.8);
    display: none;
}
.sharepage img{
    margin-top:20px;
    margin-left:15%;
}
.happyfater{
    position:absolute;
    left:50%;
    margin-left:-5rem;
    width:16rem;
}
.lineemaill{
    width: 10px;
    float:left;
}
.lineemailr{
    width: 10px;
    float:right;
}

.openmail{
    background:url("../images/openmailbg.png") no-repeat top center;
    background-size:100% 100%;
}
.openmail ol{
    width:200px;
    overflow: hidden;
    margin-top: 5.5rem;
    margin-left: 2.8rem;
}
.openmail ol li{
    width: 20px;
    height: 20px;
    border:2px solid #333;
    text-align: center;
    line-height:15px;
    color:#333;
    font-size:16px;
    float: left;
    margin-left:3px;
}
.openmailbg{
    bottom:4rem;
}
.pickMain{
    position:relative;
    top:-3rem;
    width:320px;
    height: 350px;
    margin:0 auto;
    /*background-color: #999;*/
}
.pickBody{
    position: absolute;
    top:0;
    left:0;
    width: 128px;
    height: 442px;
    z-index: 666;
}
.yuan{
      width: 32px;
    height: 44px;
    border-radius: 50%;
    position: absolute;
    top: 18px;
    left: 42px;
    overflow: hidden;
    z-index: 665;
}
.pickThing{
    position:absolute;
    right:0;
    width:130px;
}
.pickThingBig{
    width: 100%;
}
.sTing{
    top:90px;
}
.tTing{
    top:180px;
}
.fTing{
    top:270px;
}
.pickThingSmall{
    position: absolute;
    z-index:30;
    left:0;
    top:0;
    width:60px;
}
.scotto{
    width:70px;
}
.imgUp{
    background:url("../images/imageUpbg.jpg") no-repeat top center;
    background-size:cover;
}
.imgupMain{
    position:absolute;
    bottom:0;
    left:50%;
    margin-left:-120px;
    width:240px;
    height:486px;
}
.imgupBody{
    position: absolute;
    z-index:50;
}
.imgupBody{
    width:100%;
}
.imguploadtips{
    position:fixed;
    z-index:50;
    width:100%;
    height:100%;
    left:0;
    top:0;
    background-color: rgba(0,0,0,0.8);
    display: none;
    z-index: 57;
}
.imguploadtips img{
    width:290px;
    position:absolute;
    bottom:0;
    right:0;
}
.faceArea{
    position:absolute;
    top: 74px;
    left:50%;
    margin-left: -45px;
    width: 66px;
    height: 82px;
    background:yellow;
    /*border-radius:50%;*/
    overflow: hidden;
    box-shadow:0 0 30px 10px rgba(255,255,255,0.3) inset;
    /*position: absolute;*/
    /*top: 33px;*/
    /*left: 50%;*/
    /*margin-left: -39px;*/
    /*width: 54px;*/
    /*height: 73px;*/
    /*background: yellow;*/
    /*border-radius: 53%;*/
    /*overflow: hidden;*/
    /*box-shadow: 0 0 30px 10px rgba(255,255,255,0.3) inset;*/
}

.faceArea img{
    width: 46px;
    height: 68px;
}
.longClothesLeft{
    width:96px;
    left: 2px;
    top: 44px;
    /*display: none;*/
}
.shortClothesLeft{
    width:96px;
    left: 5px;
    top: 46px;
    /*display: none;*/
}
.kuzi2{
    top:160px;
}
.kuzi3{
    top:320px;
}
.bighat{
    top: 5px;
    width: 44px;
}
.kuzismall{
    width: 47px;
    left: 11px;
}
.shortkuziLeft{
    width: 72px;
    left: 17px;
    top: 129px;
}
.shorthatLeft{
    width: 31px;
    left: 0px;
    top: 184px;
}
.rman{
    top:0rem;
}
.wrman{
    top:10rem;
}
.am-dimmer {
    display: none !important;
}