/*reset*/
html, body, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, blockquote, pre, hr, figure, table, caption, th, td, form, fieldset, legend, input, button, textarea, menu {
    margin: 0;
    padding: 0;
}
body{position:relative;font-size:12px;background-color:white;overflow:auto;}
body, textarea, input, button, select, keygen, legend {
    font-family: "Microsoft Yahei", "PingHei", "PingFang SC", "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
    color: #333;
    outline: 0;
    speak: none;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 {font-weight: 300; }
li {list-style: none; }
html, body, fieldset, img, iframe, abbr {border: 0; }
img{ vertical-align: top; }
a, button {cursor: pointer; }
a {color: #333; outline: 0; text-decoration: none;}

/*common*/
.container{ width: 1200px; margin: 0 auto; }
.container:after{ content:""; display: block; clear: both; }
.clearfix:after{ content: ""; display: block; clear: both; }
.fl{ float: left; }
.fr{ float: right; }
.tl{ text-align: left; }
.tr{ text-align: right; }
.tc{ text-align: center; }
.color-white {color: white!important; }
.red {color: #e01d20!important; }
.flex{display:-webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;}
.flex-box{ -prefix-box-flex: 1; -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; }

/*rewrite*/
.swiper-pagination-h .swiper-pagination-bullet{ transition: all .3s; position: relative; opacity: .6}
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-h .swiper-pagination-bullet{ margin: 16px 0; outline: none;}
.swiper-pagination-h .swiper-pagination-bullet:before{ content: ""; position: absolute; width: 14px; height: 14px; left: -4px; top: -4px; border-radius: 100%; border: 1px solid #ef0034; opacity: 0; transform: scale(.5);}
.swiper-pagination-h .swiper-pagination-bullet-active{ background: #ef0034; opacity: 1;}
.swiper-pagination-h .swiper-pagination-bullet-active:before{ opacity: 1; transform: scale(1); }
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-h{ right: 10px;}

/*style*/
html,body{ position: relative; height: 100%; }
.mod-head-padding{ height: 91px; }
.mod-head{ height: 90px; background: #fff; transition: all .2s; position: fixed; top: 0; left: 0; right: 0; z-index: 11; border-bottom: 1px solid rgba(0,0,0,.1);}
.mod-head .logo{ float: left; margin-top: 15px; height: 60px; width: 180px; background: url(../images/01-logo.png?2) no-repeat right center; }
.mod-head .nav{ float: left; }/*margin-left: 50px;*/
.mod-head .nav .nav-item{ float: left; }
.mod-head .nav .nav-item .nav-link{ color: #333; display: block; line-height: 90px; padding: 0 30px; font-size: 20px; transition: all .2s;}
.mod-head .nav .nav-item .nav-link:hover,
.mod-head .nav .nav-item-active .nav-link{ color: #ef0034; opacity: 1;}
.mod-head .extra{ float: right; line-height: 90px; }
.mod-head .extra .shop{ font-size: 18px; color: #333; }
.mod-head .extra .shop i{ display: inline-block; width: 20px; height: 20px; background: url(../images/01-icon.png) no-repeat right center; vertical-align: -3px; margin-right: 6px;}
.mod-head-top{ background: transparent; border-bottom: 1px solid rgba(255,255,255,.3); }
.mod-head-top .logo{ background-position: left center; }
.mod-head-top .nav .nav-item .nav-link{ color: #fff; }
.mod-head-top .nav .nav-item .nav-link:hover{ opacity: .9; color: #fff;}
.mod-head-top .nav .nav-item-active .nav-link{ opacity: 1; color: #fff;}
.mod-head-top .extra .shop{ color: #f00; font-weight:800;}
/*平台首页商城字体样式*/
.mod-head-top .extra .shopshouye{ color: #fff;  font-size:18px;}

.mod-head-top .extra .shop i{ background-position: left center; }

.home-image{ width: 100%; overflow-y: hidden; text-align: center;}
.home-image img{ max-width: 100%; margin: 0 auto; }
/*.home-swiper{width: 100%; height: 100%; margin-left: auto; margin-right: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 10;}*/
.home-swiper{}
.home-swiper>.swiper-wrapper>.swiper-slide{ position: relative; box-sizing:border-box; overflow: hidden;}
.home-swiper .slide-inner{ position: absolute; left: 0; right: 0; bottom: 0; top: 91px; }
.home-swiper .s-head{ margin-top: -91px; height: 269px; position: relative; z-index: 2;}
.home-swiper .s-head .text{ padding-top: 91px; text-align: center; height: 178px; color: #fff; overflow: hidden; font-size: 36px; font-weight: 700; }
.home-swiper .slide-3 .s-head .text{ background: url(../images/03-title.png) no-repeat center 170px; }
.home-swiper .slide-4 .s-head .text{ background: url(../images/04-title.png) no-repeat center 170px; }
.home-swiper .slide-5 .title{ background: url(../images/05-title.png) no-repeat center; }
.home-swiper .slide-arrow{ position: absolute; z-index: 3; left: 50%; bottom: 25px; margin-left: -6px; animation: arrowFloat 1s ease-in-out infinite alternate; width: 12px; height: 12px; border: 1px solid #fff; border-color: #fff transparent transparent #fff; transform: rotate(-135deg); }
.home-swiper .slide-arrow:hover{ animation: none; border-color: #ff9292 transparent transparent #ff9292; cursor: pointer; }
@keyframes arrowFloat{
    0%{ bottom: 30px; }
    100%{ bottom: 20px; }
}
.home-swiper .slide-1{ position: relative; }
/*.home-swiper .slide-1 .home-banner{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; }*/
.home-swiper .slide-1 .home-banner{ height: 850px; }
.home-swiper .slide-1 .home-banner .swiper-slide a{ display: block; height: 100%; }
.home-swiper .slide-1 .home-banner .swiper-slide.s-1{ background: url(../images/01-banner-1.jpg?1) no-repeat center center; background-size: cover; }
.home-swiper .slide-1 .home-banner .swiper-slide.s-2{ background: url(../images/01-banner-2.jpg?1) no-repeat center center; background-size: cover; }
.home-swiper .slide-1 .home-banner .swiper-slide.s-3{ background: url(../images/01-banner-3.jpg?1) no-repeat center center; background-size: cover; }
.home-swiper .slide-1 .home-banner.swiper-container-horizontal>.swiper-pagination-bullets{ bottom: 7%;}
.home-swiper .slide-1 .home-banner .swiper-pagination .swiper-pagination-bullet{ border-radius: 0; background: #fff; opacity: .4; width: 44px; height: 3px; box-shadow: 0 0 15px rgba(0,0,0,0.2); position: relative;}
.home-swiper .slide-1 .home-banner .swiper-pagination .swiper-pagination-bullet:before{ content: ""; position: absolute; top: -10px; bottom: -10px; left: 0; right: 0; }
.home-swiper .slide-1 .home-banner .swiper-pagination .swiper-pagination-bullet-active{ opacity: 1; }
.home-swiper .slide-2{ background: url(../images/02-bg.jpg?1) no-repeat center center; background-size: cover; }
.home-swiper .slide-2 .text{ position: absolute; left: 5%; top: 50%; transform: translate(0,-50%); width: 30%; color: #fe605f; font-size: 17px; line-height: 1.7;}
.home-swiper .slide-2 .text .title{ width: 55%; padding-top: 25%; background: url(../images/02-title.png?1) no-repeat; background-size: contain; padding-bottom: 85px; position: relative; }
.home-swiper .slide-2 .text .title:after{ content: ""; width: 90px; height: 3px; background: #fe605f; position: absolute; left: 0; bottom: 42px;}
.home-swiper .slide-2 .list{ position: absolute; left: 37%; width:61%; top: 50%; transform: translate(0,-50%);}
.home-swiper .slide-2 .list li{ float: left; width: 48% ; padding-top: 27%; margin: 1%; overflow: hidden; border-radius: 22px; position: relative; border-radius: 1.5em;}
.home-swiper .slide-2 .list li .img{ position: absolute; left: 0; top: 0; }
.home-swiper .slide-2 .list li .img img{ width: 100%;}
.home-swiper .slide-2 .list li p{ position: absolute; left: 0; bottom: 0; right: 0; padding: 50px 30px 15px; font-size: 20px; color: #fff; font-weight: 700; z-index: 2;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+1,000000+100&0+0,0.47+99 */
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0.47) 99%, rgba(0,0,0,0.47) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,0.47) 99%,rgba(0,0,0,0.47) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,0.47) 99%,rgba(0,0,0,0.47) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#78000000',GradientType=0 ); /* IE6-9 */}
.home-swiper .slide-3 .s-head{ background: url(../images/03-bg.jpg?1) no-repeat center top; background-size: cover; }
.home-swiper .slide-3 .list{ position: absolute; left: 0; top: 178px; bottom: 0; right: 0; }
.home-swiper .slide-3 .list li{ float: left; width: 33.33%; position: relative; height: 50%;}
.home-swiper .slide-3 .list li .img{ position: relative; height: 100%; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: center;}
.home-swiper .slide-3 .list li.item-1 .img{ background-image: url(../images/03-img1.jpg?1);}
.home-swiper .slide-3 .list li.item-2 .img{ background-image: url(../images/03-img2.jpg?1);}
.home-swiper .slide-3 .list li.item-3 .img{ background-image: url(../images/03-img3.jpg?1);}
.home-swiper .slide-3 .list li.item-4 .img{ background-image: url(../images/03-img4.jpg?1);}
.home-swiper .slide-3 .list li.item-5 .img{ background-image: url(../images/03-img5.jpg?1);}
.home-swiper .slide-3 .list li.item-6 .img{ background-image: url(../images/03-img6.jpg?1);}
.home-swiper .slide-3 .list li .text{ position: absolute; left: 0; right: 0; bottom: 0; font-size: 22px; color: #fff; text-align: center; padding: 60px 0 30px; font-weight: 700;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+1,000000+100&0+0,0.47+99 */
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0.47) 99%, rgba(0,0,0,0.47) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,0.47) 99%,rgba(0,0,0,0.47) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,0.47) 99%,rgba(0,0,0,0.47) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#78000000',GradientType=0 ); /* IE6-9 */}
.home-swiper .slide-4 .s-head{ background: url(../images/04-bg.jpg) no-repeat center top; background-size: cover; }
.home-swiper .slide-4 .list{ height: 100%; margin-top: -90px; }
.home-swiper .slide-4 .list li{ width: 10%; transition: all .4s; overflow: hidden; position: relative;}
.home-swiper .slide-4 .list li .img,
.home-swiper .slide-4 .list li .img:after{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-repeat: no-repeat; background-position: center; background-size: cover; }
.home-swiper .slide-4 .list li .img:after{ content: ""; }
.home-swiper .slide-4 .list li.item-1 .img,
.home-swiper .slide-4 .list li.item-1 .img:after{ background-image: url(../images/04-img1.jpg); }
.home-swiper .slide-4 .list li.item-2 .img,
.home-swiper .slide-4 .list li.item-2 .img:after{ background-image: url(../images/04-img2.jpg); }
.home-swiper .slide-4 .list li.item-3 .img,
.home-swiper .slide-4 .list li.item-3 .img:after{ background-image: url(../images/04-img3.jpg); }
.home-swiper .slide-4 .list li.item-4 .img,
.home-swiper .slide-4 .list li.item-4 .img:after{ background-image: url(../images/04-img4.jpg); }
.home-swiper .slide-4 .list li.item-5 .img,
.home-swiper .slide-4 .list li.item-5 .img:after{ background-image: url(../images/04-img5.jpg); }
.home-swiper .slide-4 .list li.item-6 .img,
.home-swiper .slide-4 .list li.item-6 .img:after{ background-image: url(../images/04-img6.jpg); }
.home-swiper .slide-4 .list li.item-7 .img,
.home-swiper .slide-4 .list li.item-7 .img:after{ background-image: url(../images/04-img7.jpg); }
.home-swiper .slide-4 .list li .inner{ position: absolute; height: 100%; left: 0; top: 0; right: 0;}
.home-swiper .slide-4 .list li .inner .title{ transition: all .4s; font-weight: 700; font-size: 24px; color: #fff; width: 100px; height: 100px; top: 50%; left: 50%; margin: -50px; text-align: center; line-height: 100px; position: absolute;}
.home-swiper .slide-4 .list li .inner .title:before,
.home-swiper .slide-4 .list li .inner .title:after{ content: ""; width:36%; border-top: 1px solid #fff; position: absolute; left: 32%; top: 50%; transform: rotate(90deg); transition: all .4s;}
.home-swiper .slide-4 .list li .inner .title:before{ margin-top: -45%; }
.home-swiper .slide-4 .list li .inner .title:after{ margin-top: 45%; }
.home-swiper .slide-4 .list li .inner .brands{ opacity: 0; position: relative; z-index: -1; margin: 0 5%; transition: all .4s; top: 100%;}
.home-swiper .slide-4 .list li .inner .brands img{ float: left; width: 23%; margin: 0 2% 2% 0; }
.home-swiper .slide-4 .list li.active{ -prefix-box-flex: 4; -webkit-box-flex: 4; -webkit-flex: 4; -moz-box-flex: 4; -ms-flex: 4; flex: 4; }
.home-swiper .slide-4 .list li.active .img:after{ filter: blur(2px); }
.home-swiper .slide-4 .list li.active .inner .title{ left: 5%; top: 139px; margin-left: -20px; }
.home-swiper .slide-4 .list li.active .inner .title:before,
.home-swiper .slide-4 .list li.active .inner .title:after{ transform: rotate(0deg); top: 89%; margin-top: 0;}
.home-swiper .slide-4 .list li.active .inner .brands{ opacity: 1; z-index: 1; top: 218px;}
.home-swiper .slide-5{ background: url(../images/05-bg.jpg) no-repeat center top; background-size: cover; }
.home-swiper .slide-5 .title{ text-align: center; line-height: 130px; height: 130px; font-size: 36px; color: #fff; font-weight: 700;}
.home-swiper .slide-5 .brands{ width: 1200px; margin: 0 auto; background: #fff; overflow: hidden;}
.home-swiper .slide-5 .brands .inner{ overflow: hidden; margin: 3%; }
.home-swiper .slide-5 .brands .img{ float: left; width: 16.6%; text-align: center; padding: 1% 0; }
.home-swiper .slide-5 .brands .img img{ width: 90%; margin: 0 auto; border:1px solid #ddd; }
.home-swiper .slide-6{ height: 120px; background: #3d3e49; color: #cccccc; font-size: 14px; line-height: 60px;}
.home-swiper .slide-6 a{ color: #fff; }
.home-swiper .slide-6 .ft-link{ overflow: hidden; height: 60px; }
.home-swiper .slide-6 .ft-link .fr a{ margin-left: 14px; }
.home-swiper .slide-6 .ft-copy{ border-top:1px solid #4F505C; text-align: center; font-size: 12px;}
.home-swiper .slide-6 .ft-copy img{ vertical-align: middle; margin-right: 10px; }


/*birthday*/
.page-birthday .body{background: #EEEEEE;}
.page-birthday .banner{ height: 670px; position: relative; }
.page-birthday .banner .img{ height: 670px; position: absolute; left: 0; right: 0; top: 0; background: url(../images/birthday/01-banner.jpg) no-repeat center top;}
.page-birthday .banner .cover{ height: 670px; position: absolute; z-index: 2; left: 0; right: 0; top: 0; background: url(../images/birthday/01-img.png) no-repeat center top;}
.page-birthday .banner .title{ height: 192px; width: 502px; margin-left: -251px; position: absolute; z-index: 2; left: 50%; right: 0; top: 80px; background: url(../images/birthday/01-title.png) no-repeat center top;}
.page-birthday .banner .arrow{ height: 70px; width: 70px; margin-left: -35px; position: absolute; z-index: 2; left: 50%; right: 0; top: 510px; background: url(../images/birthday/01-jt.png) no-repeat center top;}
.page-birthday .section-1{ padding: 91px 0 114px; background:#EDEDED url(../images/birthday/02-bg.png) no-repeat center top; }
.page-birthday .section-1 .s-hd{ height: 105px; background: url(../images/birthday/02-bt.png) no-repeat center top; }
.page-birthday .section-1 .s-hd .s-left{ width: 550px; float: left; margin-left: 370px; margin-top: 16px; line-height: 89px; font-size: 15px; color: #eee;}
.page-birthday .section-1 .s-hd .s-right{ float: right; text-align: right;  margin-top: 16px; line-height: 89px; font-size: 14px; color: #fff;}
.page-birthday .section-1 .s-hd .s-right a{ color: #fff; margin-right: 39px; }
.page-birthday .section-1 .s-hd .s-right a i{ display: inline-block; width: 16px; height: 14px; background: url(../images/birthday/more.png) no-repeat; vertical-align: -2px; margin-left: 5px;}
.page-birthday .section-1 .s-bd{ border: 5px solid #222222; background: #fff; border-top: 0 none; }
.page-birthday .section-1 .s-bd .swiper-container{  padding: 20px; margin: 0 50px; }
.page-birthday .section-1 .s-bd .swiper-wrapper{  }
.page-birthday .section-1 .s-bd .swiper-slide .inner{ margin: 24px; text-align: center;}
.page-birthday .section-1 .s-bd .swiper-slide .img{ text-align: center; height: 200px; overflow: hidden; margin-bottom: 10px;}
.page-birthday .section-1 .s-bd .swiper-slide .title{ font-size: 16px; margin-bottom: 5px;}
.page-birthday .section-1 .s-bd .swiper-slide .intro{ font-size: 14px; color: #888; margin-bottom: 10px;}
.page-birthday .section-1 .s-bd .swiper-slide .price{ height: 36px; line-height: 36px; color: #fff; border-radius: 18px; display: block; font-size: 18px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fe9f0f+0,ff730a+100 */
background: rgb(254,159,15); /* Old browsers */
background: -moz-linear-gradient(left, rgba(254,159,15,1) 0%, rgba(255,115,10,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(254,159,15,1) 0%,rgba(255,115,10,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(254,159,15,1) 0%,rgba(255,115,10,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe9f0f', endColorstr='#ff730a',GradientType=1 ); /* IE6-9 */}
.page-birthday .section-1 .s-bd .swiper-slide .price .p-shop{ font-size: 18px; }
.page-birthday .section-1 .s-bd .swiper-slide .price .p-market{ color: #fafafa; }
.page-birthday .section-1 .s-bd .swiper-slide:hover{ box-shadow: 0 0 10px rgba(0,0,0,.1) }
.page-birthday .section-1 .s-bd .swiper-slide:hover .title{ color: #ff7500; }
.page-birthday .section-1 .s-bd .swiper-button-next, 
.page-birthday .section-1 .s-bd .swiper-button-prev{ width: 60px; height: 60px; border-radius: 100%; background: rgba(0,0,0,.1); pointer-events: auto;}
.page-birthday .section-1 .s-bd .swiper-button-prev:before,
.page-birthday .section-1 .s-bd .swiper-button-next:before{ content: ""; width: 16px; height: 16px; border: 2px solid #fff; border-color: #fff transparent transparent #fff; position: absolute; }
.page-birthday .section-1 .s-bd .swiper-button-prev:before{ left: 50%; top: 50%; margin: -8px -5px; transform: rotate(-45deg); }
.page-birthday .section-1 .s-bd .swiper-button-next:before{ left: 50%; top: 50%; margin: -8px -15px; transform: rotate(135deg); }
.page-birthday .section-2{ padding-top: 50px; height: 330px; background: url(../images/birthday/03-bg.png) no-repeat center top; }
.page-birthday .section-2 .s-title{ padding-top: 81px; background: url(../images/birthday/03-title.png) no-repeat center top; }
.page-birthday .section-2 .s-title .tr a{ color: #fff; font-size: 15px;}
.page-birthday .section-2 .s-title .tr i{display: inline-block; width: 16px; height: 14px; background: url(../images/birthday/more.png) no-repeat; vertical-align: -2px; margin-left: 5px;}
.page-birthday .section-2 .list{ margin-right: -20px; padding-top: 60px;}
.page-birthday .section-2 .list li{ position: relative; width: 465px; height: 100px; color: #fff; float: left; margin-right: 140px; }
.page-birthday .section-2 .list li .img{ float: left;}
.page-birthday .section-2 .list li .text{ margin-left: 245px; }
.page-birthday .section-2 .list li .text h3{ font-size: 18px; padding: 3px 0 8px}
.page-birthday .section-2 .list li .text p{ color: #ccc; font-size: 14px;}
.page-birthday .section-3{ padding: 80px 0; height: 400px; background: url(../images/birthday/04-bg.png) no-repeat center 80px; }
.page-birthday .section-3 .s-title{ width: 870px; margin: 0 0 0 286px; text-align: right; color: #fff; height: 60px; line-height: 60px; }
.page-birthday .section-3 .s-title a{ color: #fff; font-size: 16px; }
.page-birthday .section-3 .s-title a i{display: inline-block; width: 16px; height: 14px; background: url(../images/birthday/more.png) no-repeat; vertical-align: -2px; margin-left: 5px;}
.page-birthday .section-3 .s-box{ width: 870px; height: 310px; background: #fff; margin: 0 0 0 286px;}
.page-birthday .section-3 .s-box .list{ margin: 0 0 0 20px; padding-top: 20px; }
.page-birthday .section-3 .s-box .list li{position: relative; text-align: center; float: left; width: 200px; margin-right: 10px; height: 270px; }
.page-birthday .section-3 .s-box .list li .bg{ position: absolute; transition: all .2s; left: 0; bottom: 0; width: 200px; height: 205px; background: #F5F5F5; z-index: 0;}
.page-birthday .section-3 .s-box .list li .inner{ position: relative; z-index: 2; }
.page-birthday .section-3 .s-box .list li .img img{ box-shadow: 0 0 10px rgba(0,0,0,.1); margin-bottom: 27px; width: 75%; }
.page-birthday .section-3 .s-box .list li .title{ font-size: 16px; margin: 0 25px; margin-bottom: 10px; }
.page-birthday .section-3 .s-box .list li .title b{ display: block; margin-bottom: 10px; }
.page-birthday .section-3 .s-box .list li .price .p-shop{ color: #FF2C4D; font-size: 18px; }
.page-birthday .section-3 .s-box .list li:hover .bg{ transform: translate(0,-10px); }
.page-birthday .section-4 .s-img{ float: left; width: 300px; height: 460px; background: url(../images/birthday/05-bg.jpg) no-repeat;}
.page-birthday .section-4 .list{ float: left; width: 900px;}
.page-birthday .section-4 .list li{ height: 460px; width: 300px; background: #fff; float: left; text-align: center; position: relative; z-index: 1; }
.page-birthday .section-4 .list li .inner{ padding: 50px 50px 0; }
.page-birthday .section-4 .list li .title{ font-size: 17px; margin: 24px 0px 36px; }
.page-birthday .section-4 .list li .price{ display: none; font-size: 14px; color: #888; margin: 0 0 24px;}
.page-birthday .section-4 .list li .price .p-shop{ color: #FF2C4D; font-size: 17px; }
.page-birthday .section-4 .list li .l-btn{ line-height: 50px; border-radius: 25px; text-align: center; font-size: 16px; color: #fff; display: block;
background: rgb(255,101,108); /* Old browsers */
background: -moz-linear-gradient(left, rgba(255,101,108,1) 0%, rgba(255,45,78,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(255,101,108,1) 0%,rgba(255,45,78,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(255,101,108,1) 0%,rgba(255,45,78,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff656c', endColorstr='#ff2d4e',GradientType=1 ); /* IE6-9 */  }
.page-birthday .section-4 .list li:hover{ box-shadow: 0 0 40px rgba(0,0,0,.1); z-index: 2; }
.page-birthday .section-4 .btn-wrap{ padding: 30px 0 50px; clear: both;}
.page-birthday .section-4 .btn-wrap a{ display: inline-block; font-size: 16px; color: #FF3452; border: 1px solid #FF3452; line-height: 30px; padding: 0 30px; border-radius: 15px;}
.page-birthday .section-4 .btn-wrap a i{display: inline-block; width: 16px; height: 14px; background: url(../images/birthday/more-1.png) no-repeat; vertical-align: -2px; margin-left: 5px;}

.f-icon{ background:url(../images/footer_new_icon.png) no-repeat; display:inline-block;}
.f-icon-qi{ background-position:0 0;}
.f-icon-zheng{ background-position:-34px 0;}
.f-icon-hao{ background-position:-68px 0;}
.f-icon-shan{ background-position:-102px 0;}
.f-icon-quan{ background-position:-136px 0;}
.f-icon-tel{ background-position:-3px -103px;}
.f-icon-kefu{ background-position:-3px -138px;}
.footer-new {background-color: #fbfbfb; overflow: hidden; }
.footer-new-top{ padding:24px 0;}
.footer-new-top .service-list{ overflow:hidden; float:left;}
.footer-new-top .contact{ float:right;}
.contact .contact-item{ float:left; height:32px; line-height:30px;}
.contact .contact-item.contact-item-first{}
.contact .contact-item .f-icon-tel{ width:22px; height:24px; float:left; margin-top:5px;}
.contact .contact-item .f-icon-kefu{ width:27px; height:24px; float:left; margin-top:4px;}
.contact .contact-item span{ float:left; color:#262626; font-size:16px; font-weight:bold; margin-left:8px; overflow:hidden}
.service-list .service-item{ float:left; width:170px; height:32px; line-height:30px; overflow:hidden; padding-right:10px; }
.service-list .service-item .f-icon{ width:32px; height:32px; float:left;}
.service-list .service-item span{ float:left; font-size:18px; color:#888888; margin-left:12px;}
.footer-new-bot{ overflow:hidden; padding:30px 0 20px; background: #262626}
.footer-new-bot p{ text-align:center; color:#666;}
.footer-new-bot a{ color: #888; }
.footer-new-bot a:hover{ color: #f42424; }



/*手机端*/
.page_mobile{ display: none; }
@media screen and (max-width: 768px){
    .page_pc{ display: none; }
    .page_mobile{ display: block; }

    /*base*/
    html{ font-size:12px; overflow: auto;}
    body{ font-size: 1rem; min-width: auto; overflow: auto;}
    *{ box-sizing: border-box; }
    *{-webkit-tap-highlight-color:rgba(0,0,0,0); }
    /* 7行代码实现手机端栅格布局（2~6列） */
    [data-row]:after,[data-row]:before{ content: " "; display: table; clear:both; }
    [data-row]>*{ float: left; }
    [data-row="2"]>*{ width: 50%; }
    [data-row="3"]>*{ width: 33.3333%; }
    [data-row="4"]>*{ width: 25%; }
    [data-row="5"]>*{ width: 20%; }
    [data-row="6"]>*{ width: 16.6666%; }
    .flex{ display: flex; }
    .flex-item{ flex: 1; }
    
    /*common*/
    .container{ width: auto; padding-left: 1rem; padding-right: 1rem; }
    .s-title{ padding-top: 3rem; text-align: center; margin-bottom: 2rem; }
    .s-title h2{ font-size: 1.8rem; margin-bottom: 1rem; }
    .s-title p{ color: #95989d; font-size: 1.2rem;}
    .swiper-container img,
    .img img{ width: 100%; vertical-align: top; height: auto; }
    .bg-gray{ background: #f5f7fa; }
    .bg-lp{ background: #f9f7fc; } /* lighter purple 亮紫色 */
    .bg-b{ background: #4147f6; }
    .bg-black{ background: #000; }
    .mob-pb{ padding-bottom: 2rem; }
    .list h3{ font-size: 1.3rem; margin-bottom: 0.2rem; }
    .list p{ color: #999; }

    /*rewrite*/
    .swiper-pagination-bullet{ width: 17px; height: 4px; border-radius: 0; background: #fff; opacity: 0.4; }
    .swiper-pagination-bullet-active{ background: #fff; opacity: 1; }

    /*header*/
    .mob-header{-webkit-transform: translateZ(0); height: 4.2rem; padding: 1rem 0; background: #fff; border-bottom: 1px solid rgba(255,255,255,.1); position: fixed; left: 0; right: 0; z-index: 999;}
    .mob-header .hd-logo{ width: 3.4rem; height: 2.2rem; background: url(../images/01-logo.png) no-repeat top right; background-size: 6.5rem; float: left; }
    .mob-header .hd-extra{ float: right; }
    .mob-header .hd-extra .e-btn{ float: left; width: 7.15rem; height: 2.2rem; line-height: 2.2rem; background-size: 14.3rem; margin-right: 1rem;}
    .mob-header .hd-extra .menu-handler{ float: left;}
    .mob-header .hd-extra .menu-handler i{ height: 1.8rem; width: 2.4rem; background: url(../images/m/1-icon-gray.png) no-repeat center; background-size: contain; display: inline-block; vertical-align: top;}
    .mob-header-padding{ height: 4.2rem; }
    .mob-header-menu{-webkit-transform: translateZ(0); position: fixed; top: 4.2rem; bottom: 0; background: #fff; bottom: 0; left: 0; right: 0; z-index: 100000; -webkit-transform: rotateX(90deg); -moz-transform: rotateX(90deg); transform: rotateX(90deg); transform-origin: top; transform-style: preserve-3d; -webkit-transition: all .2s; -moz-transition: all .2s; transition: all .2s; overflow-y: auto; overflow-x: hidden; opacity: 0; font-size: 1rem;}
    .mob-header-menu.active{-webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1;}
    .mob-header-menu .menu-list{  }
    .mob-header-menu .menu-item{ /*border-bottom: 1px solid #f9f9f9;*/ line-height: 3.4rem;}
    .mob-header-menu .menu-item>.container{ border-bottom: 1px solid #f6f6f6; }
    .mob-header-menu .menu-link{ display: block; position: relative; font-size: 1.3rem; color: #000}
    .mob-header-menu .menu-item-dropdown .menu-link:after{ content: ""; position: absolute; right: 0; top: 1.5rem; width: 0; height: 0; border: 1px solid transparent; border-width: 0.5rem 0.45rem 0 0.45rem; border-top-color: #666;}
    .mob-header-menu .dropdown-wrap{ display: none; overflow: hidden;}
    .mob-header-menu .menu-item-dropdown.active .dropdown-wrap{ background: #f9f9f9; display: block; -webkit-animation: fadeIn .5s; -moz-animation: fadeIn .5s; -o-animation: fadeIn .5s; animation: fadeIn .5s;}
    .mob-header-menu .menu-item-dropdown.active .menu-link:after{ transform: rotate(180deg); }
    .mob-header-menu .sub-menu{ float: left; width: 100%;}
    .mob-header-menu .sub-menu.no-border:after{ border-bottom: 0 none; }
    .mob-header-menu .sub-menu dt{ font-size: 1.3rem; border-bottom: 1px solid #ececec; padding-left: 2rem;}
    .mob-header-menu .sub-menu dd{ font-size: 1.3rem; border-bottom: 1px solid #ececec;}
    .mob-header-menu .sub-menu dd:last-child{ clear: right; }
    .mob-header-menu .sub-menu dd a{ display: block; padding-left: 3rem; color: #666;}
    .mob-header-menu .menu-item:nth-child(3) .sub-menu dd:nth-child(4),
    .mob-header-menu .menu-item:nth-child(6) .sub-menu:nth-child(1) dd:nth-child(3),
    .mob-header-menu .menu-item:nth-child(6) .sub-menu:nth-child(2),
    .mob-header-menu .menu-item:nth-child(6) .sub-menu:nth-child(3) dd:nth-child(3),
    .mob-header-menu .menu-item:nth-child(7){ display: none; }
    @keyframes fadeIn {
        0% {opacity: 0 }
        100% {opacity: 1 }
    }
    @keyframes fadeOut {
        0% {opacity: 1 }
        100% {opacity: 0 }
    }
    .mob-header-active{ background: transparent; }
    .mob-header-active .hd-logo{ background-position: top left; }
    .mob-header-active .hd-extra .menu-handler i{ background-image: url(../images/m/1-icon-gray.png); }
    .mob-header.active{ background: #fff; }
    .mob-header.active .hd-logo{ background-position: top right; }
    .mob-header.active .hd-extra .menu-handler i{ background-image: url(../images/m/1-icon-gray.png); }
    .mob-footer{ background: #3E3E4A; color: #b3b3b3; text-align: center; padding: 1.4rem 0; }

    /*index*/
    .page-home .mob-s1 .swiper-slide{ padding-top: 123%; position: relative; }
    .page-home .mob-s1 .swiper-slide a{ position: absolute; left: 0; top: 0; height: 100%; width: 100%; }
    .page-home .mob-s1 .swiper-slide.slide-1 a{ background: url(../images/m/1-1.jpg) no-repeat center top; background-size: cover; }
    .page-home .mob-s1 .swiper-slide.slide-2 a{ background: url(../images/m/1-2.jpg) no-repeat center top; background-size: cover; }
    .page-home .mob-s1 .swiper-slide.slide-3 a{ background: url(../images/m/1-3.jpg) no-repeat center top; background-size: cover; }
    .page-home .mob-s2 .s-title h2{ height: 3.6rem; background: url(../images/m/2-title.png) no-repeat center; background-size: contain;}
    .page-home .mob-s2 .s-title p{ margin: 0 3rem; }
    .page-home .mob-s2 .list li{ float: left; width: 48%; margin: 1%; position: relative; border-radius: 1rem; overflow: hidden;}
    .page-home .mob-s2 .list li p{ font-size: 1.2rem; font-weight: 700; padding: 1rem; position: absolute; bottom: 0; left: 0; right: 0; color: #fff; }
    .page-home .mob-s4{ background: #222222; }
    .page-home .mob-s4 .s-title h2{ height: 1.9rem; background: url(../images/m/4-title.png) no-repeat center; background-size: contain; }
    .page-home .mob-s4 .list{ padding-bottom: 3rem; }
    .page-home .mob-s4 .list li{ overflow: hidden; margin-bottom: 2rem;}
    .page-home .mob-s4 .list li.item-1{ background: url(../images/m/04-img1.jpg) no-repeat center; background-size: cover; }
    .page-home .mob-s4 .list li.item-2{ background: url(../images/m/04-img2.jpg) no-repeat center; background-size: cover; }
    .page-home .mob-s4 .list li.item-3{ background: url(../images/m/04-img3.jpg) no-repeat center; background-size: cover; }
    .page-home .mob-s4 .list li.item-4{ background: url(../images/m/04-img4.jpg) no-repeat center; background-size: cover; }
    .page-home .mob-s4 .list li.item-5{ background: url(../images/m/04-img5.jpg) no-repeat center; background-size: cover; }
    .page-home .mob-s4 .list li.item-6{ background: url(../images/m/04-img6.jpg) no-repeat center; background-size: cover; }
    .page-home .mob-s4 .list li.item-7{ background: url(../images/m/04-img7.jpg) no-repeat center; background-size: cover; }
    .page-home .mob-s4 .list li .title{ font-size: 1.3rem; color: #fff; font-weight: 700; padding: 1.5rem 1rem 0.7rem;} 
    .page-home .mob-s4 .list li .title:after{ content: ""; border-bottom: 1px solid #fff; width: 3rem; display: block; margin-top: 1.1rem; }
    .page-home .mob-s4 .list li .brands{ overflow: hidden; margin: 1rem 1rem 2rem; }
    .page-home .mob-s4 .list li .brands .img{ float: left; width: 24%; margin: .5%; }
    .page-home .mob-s5 .s-title h2{ height: 1.9rem; background: url(../images/m/5-title.png) no-repeat center; background-size: contain; }
    .page-home .mob-s5 .brands{ overflow: hidden; }
    .page-home .mob-s5 .brands .img{ width: 24%; margin: .5%; float: left; border: 1px solid #eee; overflow: hidden;}

    /*birthday*/
    .page-birthday .mob-s1 { padding-top: 94%;  background: url(../images/mbirthday/1-banner.jpg) no-repeat center top; background-size: cover; }
    .page-birthday .mob-s2 { background: url(../images/mbirthday/2-bg.png); background-size: 120%; }
    .page-birthday .mob-s2 .s-title{ margin-bottom: 0; }
    .page-birthday .mob-s2 .s-title h2{ padding-top: 18.44%; margin-bottom: 0; background: url(../images/mbirthday/2-title.png) no-repeat center; background-size: contain;}
    .page-birthday .mob-s2 .list{ border: 0.3rem solid #212121; overflow: hidden; background: #fff; padding: 0.7rem;}
    .page-birthday .mob-s2 .list li{ width: 48%; float: left; margin: 1%; }
    .page-birthday .mob-s2 .list li img{ width: 100%; }
    .page-birthday .mob-s3{ background: url(../images/mbirthday/3.jpg) no-repeat center top; background-size: cover; }
    .page-birthday .mob-s3 .s-title h2{ background: url(../images/birthday/03-title.png) no-repeat center top; height: 3.9rem; background-size: contain; }
    .page-birthday .mob-s3 .list{ overflow: hidden; width: 80%; margin: 0 auto; }
    .page-birthday .mob-s3 .list li{ float: left; width: 46%; margin: 2%; }
    .page-birthday .mob-s4{ background: url(../images/mbirthday/4-bg.png) no-repeat center top; background-size: 100%; margin-top: 5%; }
    .page-birthday .mob-s4 .s-title{ padding-top: 38%; margin-bottom: 0; }
    .page-birthday .mob-s4 .s-title h2{ margin-bottom: 0; }
    .page-birthday .mob-s4 .list{ margin: 0 5%; overflow: hidden; padding-bottom: 29%; }
    .page-birthday .mob-s4 .list li{ float: left; width: 46%; margin: 2%; }
    .page-birthday .mob-s5{ background: url(../images/mbirthday/5-bg.png) no-repeat center top; background-size: 100%; padding-top: 20%; margin-top: 8%; }
    .page-birthday .mob-s5 .list{ margin: 0 5%; overflow: hidden; padding-bottom: 21%; }
    .page-birthday .mob-s5 .list li{ float: left; width: 46%; margin: 2%; }
    .page-birthday .btn-wrap{ padding: 2rem 0 1rem; clear: both;}
    .page-birthday .btn-wrap a{ display: inline-block; font-size: 16px; color: #FF3452; border: 1px solid #FF3452; line-height: 30px; padding: 0 30px; border-radius: 15px;}
    .page-birthday .btn-wrap a i{display: inline-block; width: 16px; height: 14px; background: url(../images/birthday/more-1.png) no-repeat; vertical-align: -2px; margin-left: 5px;}
}