@charset "utf-8";
/* 首页 */
.nav_fixed span:nth-child(4){ display:inline-block;}
.nav_fixed b.buy_butt{ display:none;}
.top_icon{ display:none;}

.swipe{overflow: hidden;visibility: hidden;position: relative;}
.swipe-wrap {overflow: hidden;position: relative;}
.swipe-wrap > div {float:left;width:100%;position: relative;font-family: "Microsoft YaHei";}
.swipe-wrap > div img{width: 100%;}
.swipe-wrap > div .info{position: absolute;text-align: center;top: 0;z-index: 100;width: 50%;}
.swipe-wrap > div .info img{width: 100%;}
.swipe-wrap > div.fc_1 .info{right: 5%;width: 38%;}

.swipe-wrap > div .info .pic1_n,.swipe-wrap > div .info .pic1_m,.swipe-wrap > div .info .pic1_01,.swipe-wrap > div .info .pic1_02{position: absolute;transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); transition: all 1s; -webkit-transition: all 1s;}

.swipe-wrap > div.fc_1 .info .pic1_n{opacity: 0; width: 100%;top: 2em;right: 0em;}
.swipe-wrap > div.fc_1 .info .pic1_m{opacity: 0; width: 100%;top: 4em;right: 0em;}
.swipe-wrap > div.fc_1 .info .pic1_01{opacity: 0; width: 50%;top: 7.4em;right: 0.5em;}
.swipe-wrap > div.fc_1 .info .pic1_02{opacity: 0; width: 100%;top: 8.2em;right: 0em;}

.swipe-wrap > div.on .info .pic1_n{opacity: 1;transform:scale(1, 1); -webkit-transform:scale(1, 1); transition-delay: 0.3s; -webkit-transition-delay:0.3s;}
.swipe-wrap > div.on .info .pic1_m{opacity: 1;transform:scale(1, 1); -webkit-transform:scale(1, 1); transition-delay:0.8s; -webkit-transition-delay:0.8s;}
.swipe-wrap > div.on .info .pic1_01{opacity: 1;transform:scale(1, 1); -webkit-transform:scale(1, 1); transition-delay:1.3s; -webkit-transition-delay:1.3s;}
.swipe-wrap > div.on .info .pic1_02{opacity: 1;transform:scale(1, 1); -webkit-transform:scale(1, 1); transition-delay:1.5s; -webkit-transition-delay:1.5s;}

.pagination{position: absolute;z-index: 100;right: 10px;bottom:8px;height: 11px;overflow: hidden;}
.pagination b{display: inline-block;width: 10px;height: 10px;background: #636d7f;margin-right: 5px;cursor: pointer;font-size: 0;float: left;}
.pagination b.add_on{background:#ddb288;}

/*产品订购*/
.products{background: #ccc;width:100%;overflow: hidden; padding:0.4em 0;}
.products dt{width:33%;background: #f5f5f5;float:left;margin-left:7%;border:2px solid #dbdbdb;overflow: hidden;}
.products dt img{width:100%;max-width:213px;transition: all 0.4s; -webkit-transition: all 0.4s;}
.products dt img:hover{margin-left:0.3em;transition: all 0.4s; -webkit-transition: all 0.4s;}
.products dd{width:50%; float:left;padding:1.3% 0 0 7%;}
.products dd h2{color:#808080; font-size: 1em;}
.products dd h3{color:#464646; font-size: 0.9em;font-weight: normal;}
.products dd p.rmb{color:#f92929;font-size: 1.2em;line-height:177%;}
.products dd p a{display: inline-block;font-size:0.85em;padding:0.1em 0.5em;background: #f92929;color:#fff;border-radius: 0.2em;margin-right:5%;}
.products dd p a:hover{background:#d51a1a;}
.products dd p a.on_chat{background: #000;}

.tit{width:100%;}
.tit img{width:100%;}
/*产品资讯*/
.cp_zx{padding: 0 0.5em;background: #000;}
.cp_zx dl{padding:0.8em 0.6em;overflow:hidden;border-bottom:1px dashed #666;}
.cp_zx dl dt{float: left;width:31%;}
.cp_zx dl dt img{width:100%;max-width: 180px; }
.cp_zx dl dd{width:60%;float:left;margin-left:1.2em; color:#fff;}
.cp_zx dl dd h2{font-size: 0.8em;}
.cp_zx dl dd p{font-size: 0.75em;}
.cp_zx dl dd a.details{display:inline-block;color:#000;background: #ddb288; font-size: 0.8em;padding:0.05em 0.4em;margin-top:0.4em;}

.cp_zx dl dd a.details span{display: inline-block;width: 18px;animation: got 2s infinite ease-in-out; -webkit-animation: got 2s infinite ease-in-out;-ms-animation: got 2s infinite ease-in-out;}
@keyframes got{0%,20%{opacity:0;transform:translate(-2px,0);}40%{opacity:1;transform:translate(1px,0)}60%{opacity:0.8;transform:translate(5px,0);}100%{opacity:0;transform:translate(6px,0);}}
@-webkit-keyframes got{0%,20%{ opacity:0;-webkit-transform:translate(-2px,0);}40%{opacity:1;-webkit-transform:translate(1px,0)}60%{opacity:0.8;-webkit-transform:translate(5px,0);}100%{opacity:0;-webkit-transform:translate(6px,0);}}
@-ms-keyframes got{0%,20%{ opacity:0;-ms-transform:translate(-2px,0);}40%{opacity:1;-ms-transform:translate(1px,0)}60%{opacity:0.8;-ms-transform:translate(5px,0);}100%{opacity:0;-ms-transform:translate(6px,0);}}

@keyframes linel{ 0%{ display:block; opacity:0.8} 80%{ opacity:0;left: 140%;} 100%{ display:none;left: 400px;} }
@-webkit-keyframes linel{ 0%{ display:block; opacity:0.8} 80%{ opacity:0;left: 140%;} 100%{ display:none;left: 400px;} }

@keyframes liner{ 0%{ display:block; opacity:1} 80%{ opacity:0;right: 140%;} 100%{ display:none;right: 140%;} }
@-webkit-keyframes liner{ 0%{ display:block; opacity:1} 80%{ opacity:0;right: 140%;} 100%{ display:none;right: 140%;} }

.cp_zx .b_btn{text-align: center;padding:0.5em 0 1em;}
.cp_zx .b_btn a{display: inline-block;width:40%;font-size:0.8em;color:#fff;background: #f92929;text-align: center;border-radius: 0.2em;padding:0.2em 0;}
.cp_zx .b_btn a.go_up{background: #e99f56; margin-left:1em;}

/*彩妆资讯-美妆教学*/
.teach{background: #f6f6f6;padding-top:0.4em;}
.a_tit{margin:0em 0.6em 0.6em;font-size:1em;padding:0.3em 0em;height:1em;line-height: 1em;border-bottom:1px solid #b5b5b5;}
.a_tit span{float:left;width:0.3em;height:1em;display:inline-block;margin-right:0.2em;background: #b20019;}
.videos{padding:0 0.6em;}
video{width:100%;}
.b_nav{text-align: center;border-bottom:1px dashed #c1c1c1;padding:0.2em 0 0.8em;}
.b_nav a{font-size: 0.9em;color:#b9001a;}
.b_nav a:hover{text-decoration: underline;}
.home{margin-right:1em;}
.prod{margin:0 0.15em 0.8em;overflow:hidden;border:1px solid #e1e1e1;box-shadow: 0 0.2em 0.2em #dedede;padding-bottom: 0.8em;}
.prod li{width:29%;text-align: center;float:left;padding-top: 0.8em;margin-left:0.74em;}
.prod li img{border:1px solid #afafaf;width:100%;max-width: 179px;}
.prod li a{display: block;}
.bottoms h3{color:#a3a3a3;font-size: 0.7em;height:2em;line-height:2em;font-weight: normal;overflow: hidden;}
.bottoms p{color: #000;font-family: myImpact;font-size: 1em;font-weight: bold;}
.prod .bottoms a{display: inline-block;background: #000;color:#ff6177;font-size:0.85em;padding:0.1em 1.5em;border-radius: 0.25em;}

/*资讯详情*/
.zx_dt{background: #fff;}
.heads h2{text-align: center;color:#000;font-size:1.2em;}
.navs{padding:0 0.6em 0.4em;text-align:center;overflow: hidden;border-bottom: 1px dashed #b3b3b3;}
.navs ul{height:1.5em; line-height: 1.5em;}
.navs li{font-size: 0.8em;display:inline-block;color:#bd2536;}
.navs li a{color:#bd2536;}
.navs li a:hover{text-decoration: underline;}
.navs li.lasts{margin-right:0;}
.comments{padding:0.5em 0.6em 6em;overflow: hidden;}
.comments p{font-size: 0.9em;line-height: 1.5em;color:#484848;text-indent: 2em;}
.comments .pic{text-align: center;padding:0.8em 0;}
.comments .pic span{display: inline-block;width:66%;}
.comments .pic span img{width:100%;max-width: 396px;}
.selects{margin-top:2em;}
.selects a{color:#b9001a;height:1.5em;line-height: 1.5em;}
.selects a:hover{text-decoration: underline;}















.pro_grid{}
.pro_grid .grid_tit{padding: .5em 0;background: #1d1d1d;}
.pro_grid .grid_tit img{width: 100%;}
.pro_cont{border-bottom: 4px solid #000;}
.pro_cont>div{width: 50%;float: left;position: relative;overflow: hidden;}
.pro_cont>div img{width: 100%;}
.pro_cont>div a.name{position: absolute;background: rgba(0,0,0,0.7);bottom: 0;left: 0;right: 0;padding: .5em 0;width: 100%;text-align: center;font-size: .8em;color: #fff;font-weight: normal;}
.pro_cont>div a b{font-family:"Lucida Grande" ;font-weight: normal;}
.pro_cont>div a:hover b{opacity: 0.8;transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-o-transition: width 0.3s;}
.pro_cont>div a em{color: #9486f8;}

.pro_cont>div .lightl{position: absolute;left: -80%;top: 0;width: 30%;height: 90%;
  background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));
  background-image: -moz-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));
  background-image: -o-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));
  background-image: -ms-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));

  -webkit-transform: skewx(-30deg);
  -moz-transform: skewx(-30deg);
  -o-transform: skewx(-30deg);
  -ms-transform: skewx(-30deg);
  transform: skewx(-30deg);

   -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;

  animation: linel 2s infinite ease-in-out; 
  -webkit-animation: linel 2s infinite ease-in-out;
  -ms-animation: linel 2s infinite ease-in-out;

  animation-iteration-count:2;
  animation-fill-mode:forwards;

  -webkit-animation-iteration-count:2;
  -webkit-animation-fill-mode:forwards;
  
}
.pro_cont>div .lightr{position: absolute;right: -80%;top: 0;width: 30%;height: 90%;
  background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));
  background-image: -moz-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));
  background-image: -o-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));
  background-image: -ms-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));

  -webkit-transform: skewx(-25deg);
  -moz-transform: skewx(-25deg);
  -o-transform: skewx(-25deg);
  -ms-transform: skewx(-25deg);
  transform: skewx(-25deg);

  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;

  animation: liner 3s infinite ease-in-out; 
  -webkit-animation: liner 3s infinite ease-in-out;
  -ms-animation: liner 3s infinite ease-in-out;

  animation-iteration-count:2;
  animation-fill-mode:forwards;

  -webkit-animation-iteration-count:2;
  -webkit-animation-fill-mode:forwards;
 
}

.pro_cont>div a span.gt_go{display: inline-block;width: 18px;
	 animation: got 2s infinite ease-in-out; 
   -webkit-animation: got 2s infinite ease-in-out;
   -ms-animation: got 2s infinite ease-in-out;
	 }

@keyframes got{0%,20%{opacity:0;transform:translate(-2px,0);}40%{opacity:1;transform:translate(1px,0)}60%{opacity:0.8;transform:translate(5px,0);}100%{opacity:0;transform:translate(6px,0);}}
@-webkit-keyframes got{0%,20%{ opacity:0;-webkit-transform:translate(-2px,0);}40%{opacity:1;-webkit-transform:translate(1px,0)}60%{opacity:0.8;-webkit-transform:translate(5px,0);}100%{opacity:0;-webkit-transform:translate(6px,0);}}
@-ms-keyframes got{0%,20%{ opacity:0;-ms-transform:translate(-2px,0);}40%{opacity:1;-ms-transform:translate(1px,0)}60%{opacity:0.8;-ms-transform:translate(5px,0);}100%{opacity:0;-ms-transform:translate(6px,0);}}

@keyframes linel{ 0%{ display:block; opacity:0.8} 80%{ opacity:0;left: 140%;} 100%{ display:none;left: 400px;} }
@-webkit-keyframes linel{ 0%{ display:block; opacity:0.8} 80%{ opacity:0;left: 140%;} 100%{ display:none;left: 400px;} }

@keyframes liner{ 0%{ display:block; opacity:1} 80%{ opacity:0;right: 140%;} 100%{ display:none;right: 140%;} }
@-webkit-keyframes liner{ 0%{ display:block; opacity:1} 80%{ opacity:0;right: 140%;} 100%{ display:none;right: 140%;} }


.hot_sale{border: 4px solid #000;border-left: none;border-right: none;background: #000;}
.hot_sale li{width: 49.6%;border: 1px solid #19191d;box-sizing:border-box;margin-bottom: .2em;overflow: hidden;}
.hot_sale li a{display: inline-block;overflow: hidden;width: 100%;}
.hot_sale li img{transition:0.6s all; -webkit-transition:0.6s all;}
.hot_sale li:first-child >a{background: #f9e6d6;}
.hot_sale li:nth-child(2) >a{background: #d7d7d7;}
.hot_sale li:nth-child(3) >a{background: #fff;}
.hot_sale li:nth-child(4) >a{background: #fffef4;}

.hot_sale li img{width: 100%;transform:translateY(12px); -webkit-transform:translateY(12px);}
.hot_sale li:first-child.effet img{transform:translateY(0px); -webkit-transform:translateY(0px);}
.hot_sale li:nth-child(2).effet img{transform:translateY(0px); -webkit-transform:translateY(0px);transition-delay:0.6s; -webkit-transition-delay:0.6s;}
.hot_sale li:nth-child(3).effet img{transform:translateY(0px); -webkit-transform:translateY(0px);transition-delay:1.2s; -webkit-transition-delay:1.2s;}
.hot_sale li:nth-child(4).effet img{transform:translateY(0px); -webkit-transform:translateY(0px);transition-delay:1.8s; -webkit-transition-delay:1.8s;}

.hot_sale li .p_name{background: #121212;line-height: 1.8em;font-size: .8em;font-family: "Microsoft YaHei";padding-left: .3em;color: #fff;}
.hot_sale li .p_name span{color: #f92929;padding: 0 .4em 0 .3em;float: right;line-height: 1.8em;}
.hot_sale li:first-child{float: left;border-left: none;border-bottom: none;}
.hot_sale li:nth-child(2){float: right;border-right: none;border-bottom: none;}
.hot_sale li:nth-child(3){float: left;border-left: none;border-bottom: none;margin-bottom: 0;}
.hot_sale li:nth-child(4){float: right;border-right: none;border-bottom: none;margin-bottom: 0;}