html {
    font-size: calc(100vw/7.5);
}
body{
    width: 100%;
    height: 100%;
    font:.22rem / .36rem -apple-system, "Microsoft YaHei","Helvetica Neue",Arial,HelveticaNeue,Helvetica,"BBAlpha Sans",sans-serif;
}
img{
    display: block;
    width: 100%;
}
.wrap{
    width: 7.5rem; 
    margin: 0 auto; 
    text-align: center; 
    position: relative;
    background:#d1e7c6 url('../imgs/bg2.jpg') no-repeat center top / 7.5rem auto;
}
.side{
    display: none;
}
.link{
	position: absolute;
    top: .2rem;
    right: .2rem;
    background: #295234;
    line-height: .6rem;
    border-radius: .3rem;
    color: #e7e696;
    padding: 0 .2rem;
}
.link a{
	display:inline-block;
	margin:0 .1rem;
	color: #e7e696;
}
.logo{
    display: block; 
    position: absolute; 
    width: 2.38rem;
    top:.22rem; 
    left:.3rem; 
    z-index: 1;
}
.txt{
    padding: .8rem .4rem 0;
    font-size: .2rem;
    line-height: .3rem;
}
.txt span,.txt a{
    display: inline-block;
    color: #ff7e00;
}
.head{
    height: 6.74rem;
}
.btn,
.notice::after{
    display: inline-block;
    background: url('../imgs/btn.png') no-repeat -9999px / 5.57rem auto;
    overflow: hidden;
    font-size: 0;
    width: 1.79rem;
    height: .65rem;
}
.part1{
    height: 5.62rem;
}
.receive{
    margin-top: 2.95rem;
    background-position: 0 0;
}
.receive.end{
    background-position:-3.78rem 0;
}
.part2{
    height: 6.26rem;
}
.area{
    display: flex;
    display:-webkit-box;
    display:-webkit-flex;    
    justify-content: center;
    margin-top: .8rem;
}
.area .item{
    width: 3.36rem;
    padding-top: 2.24rem;
    position: relative;
    margin: 0 .1rem;
}
.area .item i{
    position: absolute;
    top: 0;
    right: .4rem;
    display: none;
    width: .97rem;
    height: .97rem;
    background-position: -3.78rem -.75rem;
}
.area .cur i{
    display: block;
}
.wearing{
    width: 1.64rem;
    height: .66rem;
    background-position: 0 -1.5rem;
}
.part3{
    min-height: 11rem;
}
.notice{
    height: .36rem;
    line-height: .36rem;
    width:3.2rem;
    margin: .1rem auto 0;
    background: #436e50;
    border-radius: .2rem;
    padding: 0 .25rem 0 .6rem;
    text-align: left;
    color: #e7e696;
    position: relative;
}
.notice::after{
    content: '';
    width: .16rem;
    height: .14rem;
    position: absolute;
    left: .3rem;
    top: 50%;
    margin-top: -.06rem;
    background-position: -5.41rem -.75rem;
}
.scroll{
    height: .36rem;
    position: relative;
    overflow: hidden;
}
.notice ul{
    position: absolute;
    left: 0;
    top: 0;
    height: .36rem;
    overflow: hidden;    
}
.notice ul li{
    float: left;
    margin-right: .2rem;
}
.eat{
    margin-top: 2.75rem;
    background-position: 0 -.75rem;
}
.last{
    color: #3e5c27;
    margin: .24rem 0;
}
.award,.edit{
    display: inline-block;
    color: #3e5c27;
    border: 1px solid #3e5c27;
    padding: 0 .3rem;
    line-height: .56rem;
    border-radius: .3rem;
    margin: 0 .1rem;
}
.award:hover,.edit:hover{
    background: #3e5c27;
    color: #fff;
}
.cyou-top,
.cyou_bottom{
    display: none!important;
}