@charset "utf-8";
/* 
    @名称: base
    @功能: 重设浏览器默认样式
*/
/* 防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */
html{
    color:#000;background:#fff;
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:62.5%;
}
/* 内外边距通常让各个浏览器样式的表现位置不同 */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    margin:0;padding:0;
}
/* 重设 HTML5 标签, IE 需要在 js 中 createElement(TAG) */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { 
    display:block;
}
/* HTML5 媒体文件跟 img 保持一致 */
audio,canvas,video {
    display:inline-block;*display:inline;*zoom:1;
}
/* 要注意表单元素并不继承父级 font 的问题 */
body,button,input,select,textarea{
    font-size: 12px;
    line-height: 1.5em;
}
/* iphone手机表单默认 */
input.no {-webkit-appearance:none;}

input,select,textarea{
    font-size:100%;
}
/* 去掉各Table  cell 的边距并让其边重合 */
table{
    border-collapse:collapse;border-spacing:0;
}
/* IE bug fixed: th 不继承 text-align*/
th{
    text-align:inherit;
}
/* 去除默认边框 */
fieldset,img{
    border:0;
    width: 100%;
}
/* ie6 7 8(q) bug 显示为行内表现 */
iframe{
    display:block;
}
/* 去掉 firefox 下此元素的边框 */
abbr,acronym{
    border:0;font-variant:normal;
}
/* 一致的 del 样式 */
del {
    text-decoration:line-through;
}
address,caption,cite,code,dfn,em,th,var {
    font-style:normal;
    font-weight:500;
}
/* 去掉列表前的标识, li 会继承 */
ol,ul {
    list-style:none;
}
/* 对齐是排版最重要的因素, 别让什么都居中 */
caption,th {
    text-align:left;
}
/* 来自yahoo, 让标题都自定义, 适应多个系统应用 */
h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:500;
}
q:before,q:after {
    content:'';
}
/* 默认不显示下划线，保持页面简洁 */
a {
    text-decoration: none;
    outline: none;
    color: inherit;
}
a:hover {
    text-decoration:none;
}
/* 清理内浮动 */
.fl-c:after {
    visibility:hidden;
    display:block;
    font-size:0;
    content:" ";
    clear:both;
    height:0;
}
.fl-c {
    *zoom:1; /* for IE6 IE7 */
}
.flex{
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}
.flex1{
  -prefix-box-flex: 1;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.flex-c{
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -moz-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.flex-a-c{
  -webkit-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-content: flex-start;
  -ms-flex-line-pack: start;
  align-content: center;
}
.flex-j-c{
  -webkit-box-pack: center;
  -moz-justify-content: center;
  -webkit-justify-content: center;
  justify-content: center;
}
.flex-a-i{
  -webkit-box-align: center;
  -moz-align-items: center;
  -webkit-align-items: center;
  align-items: center;
}
span,strong{display:inline-block;}
i{font-style:normal;display:inline-block;}
.fl{float:left;}
.fr{float:right}
.no-bt {
    border-top: none !important;
}
.no-br {
    border-right: none !important;
}
.no-bb {
    border-bottom: none !important;
}
.no-bl {
    border-left: none !important;
}
.no-mb{
    margin-bottom: 0!important;
}
.no-mr{
    margin-right: 0!important;
}


/* 最大宽度应对手机自定义 */
header,nav,section,footer {margin:0 auto; max-width:640px;}
.main {
    max-width: 640px;
    margin: 0 auto;
}
/* header*/
header{
    width: 6.4rem;
}
header a,header a img{
    display: block;
    width: 6.4rem;
}
.banner{
    width: 6.4rem;
}
.banner a,.banner a img{
    display: block;
    width: 6.4rem;
}
.m1{
    width: 6.4rem;
    background-color: #ff7d8c;
}
.m1-cont1{
    width: 6rem;
    margin: 0 auto;
    background-color: #fff;
    border-radius: .2rem;
    box-shadow: .16rem 0 .4rem rgba(255,125,140,.76);
    padding: 0 0 .48rem 0;
    position: relative;
    margin-top: -1.4rem;
}
.m1-cont1 h2 img{
    display: block;
    width: 6rem;
}
.m1-cont1 .m1-list{
    width:5.6rem;
    margin: .2rem auto .35rem; 
}
.m1-cont1 .m1-list li{
    width: 1.8rem;
    float: left;
    margin-right: .1rem;
    background-color: #ffffff;
    border-radius: .25rem;
    padding: .24rem 0;
    box-shadow: .08rem 0 .15rem rgba(255, 161, 173, .7);
}
.m1-cont1 .m1-list li img{
    display: block;
    width: 1.8rem;
}
.m1-cont1 .m1-list li p{
    font-size: .24rem;
    line-height: .36rem;
    text-align: center;
    color: #563a32;
    margin: .1rem 0;
}
.m1-cont1 .m1-list li i{
    display: block;
    font-size: .18rem;
    color: #666666;
    line-height: .32rem;
    text-align: center;
    text-decoration: line-through;
}
.m1-cont1 .m1-list li em{
    display: block;
    font-size: .18rem;
    color: #666666;
    line-height: .32rem;
    text-align: center;
}
.m1-btn{
    width: 4.95rem;
    height: .8rem;
    line-height: .8rem;
    border-radius: .4rem;
    background: linear-gradient(to right, #f2a71f , #ee8927);
    background: -webkit-linear-gradient(to right, #f2a71f , #ee8927);
    margin: 0 auto;
    box-shadow: .08rem 0 .15rem rgba(238, 137,39, .7);
}
.m1-btn a{
    display: block;
    font-size: .3rem;
    color: #fff;
    text-align: center;
    box-sizing:border-box;
}
.m1-tit{
    width: 6.4rem;
    margin-top: .6rem;
    margin-bottom: .15rem;
}
.m1-tit img{
    display: block;
    width: 6.4rem;
}
.m1-cont2 p{
    width: 5.8rem;
    margin: 0 auto .1rem;
    font-size: .24rem;
    line-height: .34rem;
    color: #333;
    text-indent: 2em;
}
.m1-cont2{
    padding-bottom: 1.4rem;
    background-color: #fff3f4;
    position: relative;
}
.m1-cont2 .m1-right{
    width: 1.34rem;
    height: 1.3rem;
    background: url(../images/bg-right.jpg) no-repeat;
    background-size: 100%;
    position: absolute;
    right: .48rem;
    bottom: .15rem;
}
.cont{
    width: 6.2rem;
    margin: 0 auto;
}
.tit{
    width: 6.4rem;
}
.tit img{
    display: block;
    width: 6.4rem;
}
.p2{
    background: #ff6879;
    padding-bottom: .6rem;
}
.p2 .tit img{
    display: block;
    width: 100%;
}
.p2 .cont{
    position: relative;
    padding-bottom: .57rem;
    border-radius:0 0 .3rem .3rem;
    width: 6.2rem;
    background:#ffffff;
    background-size: 6rem;
    box-shadow: 0 .18rem 0 #f06272;
}
.p2 .cont .p2-c-img{
    position: absolute;
    top: .38rem;
    right: .3rem;
    width: 2.31rem;
    z-index: 2;
}
.p2 .cont .txt{    
    margin-left: .3rem;
    padding-top: .43rem;
}
.p2 .cont .txt p strong{
    display: inline-block;
    margin-bottom: .05rem;
    font-size: .24rem;
    color: #e95e5c;
    font-weight: bold;
}
.p2 .cont .txt p{
    width: 3.1rem;
    font-size: .22rem;
    line-height: .38rem;
    color: #000;
}
.p2 .cont .p2-list{
    width: 5.54rem;
    height: 1.92rem;
    background: #ff7984;
    border-radius: .3rem;
    margin:.2rem auto .4rem auto;
    padding:.15rem 0 0 .15rem;
    box-sizing:border-box;
}
.p2 .cont .p2-list ul{
    display: inline-block;
    padding-right: .1rem;
}
.p2 .cont .p2-list li{
    padding-left: .27rem;
    font-size: .2rem;
    line-height: .36rem;
    color: #fff;
    background: url(../images/icon.png) -.05rem -3.16rem no-repeat;
    background-size: .32rem;
}
.p2 .cont .p2-list img{
    width: 5.53rem;
}
.p2 .cont .p2-img{
    margin-bottom: .38rem;
    text-align: center;
}
.p2 .cont .p2-img img{
    display: inline-block;
    width: 2.99rem;
}
.p2 .cont .p2-btn a{
    display: inline-block;
    line-height: .75rem;
    width: 2.62rem;
    height: .75rem;
    border-radius: .37rem;
    font-size:.24rem; 
    text-align: center;
    color: #fff;
}
.p2 .cont .p2-btn a.a1{
    float: left;
    margin-left: .25rem;
    background: -webkit-linear-gradient(70deg,#f3a91f,#ee8927);
    background: liearn-gradient(70deg,#f3a91f,#ee8927); 
    box-shadow: 0 .14rem 0 #f5ebdd;
}
.p2 .cont .p2-btn a.a2{
    float: right;
    margin-right: .25rem;
    background: -webkit-linear-gradient(70deg,#ff7e94,#ff5d72);
    background: liearn-gradient(70deg,#ff7e94,#ff5d72); 
    box-shadow: 0 .14rem 0 #ffe3e8;
}
.p3{
    padding-bottom: .35rem;
    background: #ffe9ec;
}
.p3 .cont{
    width: 6.2rem;
    background-color: #fffbfc;
    margin:0 auto;
    border-radius: .3rem;
    padding-bottom: .4rem;
    box-shadow: 0 .18rem 0 #f1cccd;
    padding-top: .5rem;
}
.p3 .cont h2{
    font-size: .36rem;
    text-align: center;
    line-height: 1.05rem;
    color: #e9444f;
    font-weight: bold;
}
.p3 .cont h4{
    font-size: .28rem;
    color: #e9444f;
    line-height: .4rem;
    text-align: center;
    margin-top: .65rem;
}
.p3 .p3-cont{
    width: 5.78rem;
    margin: 0 auto;
}
.p3 .p3-cont li{
    position: relative;
    padding-top: .15rem;
    width: 1.85rem;
    height: 3.2rem;  
    float: left;
    margin-right: .115rem;
    background: #fffefe;
    text-align: center;
    border-radius: .2rem;
    box-sizing:border-box;
    box-shadow: .1rem .3rem .49rem rgba(237,70,101,.2);
}
.p3 .p3-cont li:last-child{
    margin-right: 0;
}
.p3 .p3-cont li img{
    width: 1.55rem;
}
.p3 .p3-cont li h3{
    margin:.2rem 0 .08rem;  
    font-size: .26rem;
    line-height: 1em;
    font-weight: normal;
    color: #000;
    text-align: center;
}
.p3 .p3-cont li .price img{
    width: 100%;
}

.p3 .p3-cont li a{
    position: absolute;
    bottom: -.34rem;
    left: 50%;
    margin-left: -.67rem;
    display: inline-block;
    width: 1.34rem;
    height: .58rem;
    line-height: .58rem;
    border-radius: .29rem;
    font-size:.32rem;
    color: #fff;
    text-align: center;
    box-shadow: 0 .05rem .1rem rgba(255,131,7,.4 );
    background: -webkit-linear-gradient(70deg,#ff9c0e,#f17f38);
    background: liearn-gradient(70deg,#ff9c0e,#f17f38); 
}
.p3 .p3-btn{
    padding-top: .7rem;
    text-align: center;
}
.p3 .p3-btn h2{
    line-height: .36rem;
    font-size: .28rem;
    font-weight: bold;
    color: #62352d;
    text-align: center;
}
.p3 .p3-btn span{
    display: inline-block;
    width: .4rem;
    height: .4rem;
    line-height: .4rem;
    border-radius: 50%;
    background: #ff5c71;
    font-size: .28rem;
    color: #fff;
    text-align: center;
}
.p4 {
    padding-bottom: .75rem;
    background: #ff6879;
}
.p4 .cont{
    position: relative;
}
.p4 .cont a{
    position: absolute;
    bottom: -.18rem;
    left: .45rem;
    display: inline-block;
    line-height: .76rem;  
    width: 2.66rem;
    height: .76rem;
    border-radius: .38rem;
    font-size: .36rem;
    color: #fff;
    text-align: center;
    box-shadow: 0 .05rem .1rem rgba(73,10,0,.2);
    background: -webkit-linear-gradient(70deg,#f3aa4e,#ee8a28);
    background: liearn-gradient(70deg,#f3aa4e,#ee8a28); 
}
.p6 {
    padding-bottom: .6rem;
    background: #ffe5e9;
}

.p6 .cont .p6-info{
    position: relative;
    border-radius: .2rem;
}
.p6 .cont img{
    width: 6.2rem;
    border-radius: .2rem;
    overflow: hidden;
}
.p6 .cont a{
    position: absolute;
    bottom: -.18rem;
    right: .43rem;
    display: inline-block;
    line-height: .76rem;  
    width: 2.66rem;
    height: .76rem;
    border-radius: .38rem;
    background: #ffea00;
    font-size: .36rem;
    color: #fff;
    text-align: center;
    box-shadow: 0 .05rem .1rem rgba(246,107,47,.5);
    background: -webkit-linear-gradient(70deg,#f3ad5c,#ed8c33);
    background: liearn-gradient(70deg,#f3ad5c,#ed8c33); 
}
.p6 .p6-cont{
    margin-top: .3rem;
}
.p6 .p6-cont .p-style{
    margin: .15rem 0 .2rem 0;
    padding:0 .2rem;
    font-size: .24rem;
    line-height: .36rem;
    color: #333;
}
.p6 .p6-cont .p6-list{
    margin-bottom: .3rem;
    text-align: center;
}
.p6 .p6-cont .p6-list ul{
    overflow: hidden;
    display: inline-block;
}
.p6 .p6-cont .p6-list li{
    margin-right: .2rem;
    float: left;
    width: 1.3rem;
    height: 1.3rem;
    border-radius: 50%;
    text-align: center;
    background: #ffcbd2;
    border:.07rem solid #ffeaee;
    font-size: .22rem;
    line-height: .26rem;
    color: #f1566a;
    box-sizing:border-box;
}
.p6 .p6-cont .p6-list li:last-child{
    margin-right: 0;
}
.p6 .p6-cont .p6-item{
    padding-top: .28rem;
    position: relative;  
    height: 4.34rem;
    float: left;
    background: #fffefe;
    border-radius: .2rem;
    text-align: center;
    box-shadow: .1rem .3rem .49rem rgba(227,121,111,.1);
    box-sizing:border-box;
}
.p6 .p6-cont .p6-item:nth-of-type(1){
    margin-right: .12rem;
    width: 2.92rem;
}
.p6 .p6-cont .p6-item:nth-of-type(2){
    width: 2.82rem;
}
.p6 .p6-cont .p6-item .pic{
    width: 2.2rem;
    border-radius: 50%;
}
.p6 .p6-cont .p6-item .price{
    width: 100%;
}
.p6 .p6-cont .p6-item h3{
    margin:.32rem 0 .2rem 0;
    line-height: 1em;
    font-weight: normal;
    font-size: .22rem;
    line-height: .26rem;
    color: #000;
}
.p6 .p6-cont .p6-item a{
    position: absolute;
    bottom:-.3rem;
    left: 50%;
    margin-left: -.93rem;
    display: inline-block;
    width: 1.86rem;
    height: .74rem;
    border-radius: .38rem;
    font-size: .32rem;
    line-height: .74rem;
    color: #fff;
    box-shadow: 0 .05rem .1rem rgba(255,124,6,.5);
    background: -webkit-linear-gradient(70deg,#f29f42,#ee8b2a);
    background: liearn-gradient(70deg,#f29f42,#ee8b2a); 
}
.p6-nav{
    width: 6.2rem;
    margin: 0 auto;
    border-radius: .3rem;
    background-color: #fae4e7;
    padding: 0 .15rem .75rem .15rem;
    box-sizing:border-box;
    box-shadow: 0 .18rem 0 #d2555c;
}
.p6-nav h2{
    font-size: .36rem;
    font-weight: bold;
    text-align: center;
    line-height: 1.1rem;
    color: #e9444f;
}
.p8{
    padding-bottom: .65rem;
    background: #ff6879;
}

.p8 h2{
    line-height: 1em;
    font-size: .44rem;
    color: #6b232b;
    text-align: center;
}
.p8 .cont{
    position: relative;
    margin-top: -1.25rem;
    padding:.4rem .3rem .6rem;
    border-radius: .3rem;
    box-shadow: 0 .12rem 0 #e25969;
    background: #ffefea;
    box-sizing:border-box;

}
.p8 .p-style{
    margin-bottom: .35rem;
    font-size: .24rem;
    line-height: .34rem;
    text-indent: 2em;
    color: #3b0c17;
    background: #ffefea;
}
.p8 .p8-btn{
    position: absolute;
    bottom:-.27rem;
    left: 0;
    width: 100%;
}
.p8 .p8-btn a{
    width: 2.68rem;
    height: .8rem;
    line-height: .8rem;
    text-align: center;
    font-size: .32rem;
    border-radius: .4rem;
    color: #fff;
    box-shadow: 0 .05rem .1rem rgba(96,77,59,.5);
}
.p8 .p8-btn a.a1{
    float: left;
    margin-left: .2rem;
    color: #fff;
    background: -webkit-linear-gradient(70deg,#f4ad53,#ee8b29);
    background: liearn-gradient(70deg,#f4ad53,#ee8b29);   
}
.p8 .p8-btn a.a2{
    float: right; 
    margin-right: .2rem; 
    color: #ff5c71;
    background: -webkit-linear-gradient(70deg,#ffd6de,#ffc4cf);
    background: liearn-gradient(70deg,#ffd6de,#ffc4cf); 
}
.p9{
    padding-bottom: .4rem;
    background: #ff6879;
}
.p9 .p9-txt{
    padding:.25rem 0;
    font-size: .24rem;
    line-height: .34rem;
    color: #fff;
    text-align: center;
}
.p9 .p9-item{
    width: 6rem;
    margin:0 auto;
}
.p9 .p9-item li{
    width: 1.75rem;
    height: 1.75rem;
    float: left;
    margin:0 .35rem .3rem 0;
    overflow: hidden;
    box-shadow: .1rem .1rem 0 rgba(0,0,0,0.06);
    position: relative;
}
.p9 .p9-item li:nth-of-type(3n){
    margin-right: 0;
}
.p9 .p9-item li img{
    width: 1.75rem;
}
.p9 .p9-item li p{
    width: 1.59rem;
    line-height: .28rem;
    background: rgba(0, 0, 0,.6);
    position: absolute;
    left: .08rem;
    bottom: .08rem;
    font-size: .2rem;
    color:#fff;
    text-align: center;
}
.p10{
    padding-bottom: .5rem;
    background: #ffe9ec;
}
.p10 .cont{
    width: 6rem;
    margin:0 auto;
}
.p10 .p10-item li{
    width: 2.86rem;
    float: left;
    margin:0 .25rem .3rem 0; 
    border-radius: .2rem;
    background: #fff;
    overflow: hidden;
    box-shadow: .15rem .15rem 0 #ffcbd5;
}
.p10 .p10-item li:nth-of-type(2n){
    margin-right: 0;
}
.p10 .p10-item li img{
    width: 2.86rem;
}
.p10 .p10-item li span{
    display: inline-block;
    width: 100%;
    height: .6rem;
    line-height: .6rem;
    font-size: .24rem;
    color: #000;
    text-align: center;
}
.f-img{
    width: 6.4rem;
}
.f-img img{
    display: block;
    width: 6.4rem;
}
footer{
    height: 4.74rem;
    background: url(../images/f-bg.jpg) center -.1rem no-repeat;
    background-size: 6.4rem;
    margin-bottom: 1.1rem;
    margin-top: .2rem;
}
footer .f-txt{
    float: right;
    padding-right: .2rem;
    padding-top: .65rem;
    margin-left:  2.84rem;
}
footer .f-txt p{
    margin-bottom: .15rem;
    line-height: .3rem;
    font-size: .22rem;
    color: #333333;
    overflow: hidden;
}
footer .f-txt p img{
    margin-right: .15rem;
    float: left;
    width: .3rem;
}
footer .f-txt p span{
    float: left;
}

.lowupdown{
    animation: lowmove 1s ease-in-out .8s infinite alternate;;
    -webkit-animation: lowmove 1s ease-in-out .8s infinite alternate;;
}
.scale{
    -moz-animation: scalemove 1s linear infinite backwards;
    -ms-animation: scalemove 1s linear infinite backwards;
    -o-animation: scalemove 1s linear infinite backwards;
    -webkit-animation: scalemove 1s linear infinite backwards;
    animation: scalemove 1s linear infinite backwards;
}
@-webkit-keyframes lowmove{
    0%{
            -webkit-transform:translateY(0);
        }
    100% {
            -webkit-transform:translateY(-10px);
        }
}
@keyframes lowmove{
    0%{
            transform:translateY(0);
        }
    100% {
            transform:translateY(-10px);
        }
}
@-webkit-keyframes scalemove{
    0%{ 
    transform:scale(1);
    }
    50%{  
    transform:scale(1.05);
    } 
    100%{  
    transform:scale(1);
    }
}
@-moz-keyframes scalemove{
    0%{ 
    transform:scale(1);
    }
    50%{  
    transform:scale(1.05);
    } 
    100%{  
    transform:scale(1);
    }
}
@keyframes scalemove{
    0%{ 
    transform:scale(1);
    }
    50%{  
    transform:scale(1.05);
    } 
    100%{  
    transform:scale(1);
    }
}