﻿@charset "utf-8";

/*公共*/
.caption{ line-height:24px;}
.caption b{ font-size:24px; display:inline-block; margin:0 0 25px 0;}
.arrow2{ display:inline-block; width:20px; height:20px; background:url(../images/elements.png) left -80px no-repeat; overflow:hidden; vertical-align:middle; margin:-2px 8px 0 8px;}

/*框架*/
#box{ position:relative;}
#subl{ width:210px; border-top:#6A8F1b 2px solid; padding:1px 0 20px 0; float:left;}
#subr{ width:950px; float:right;}
#subr2{ width:920px; float:right; border-top:#d6d6d6 1px solid; padding-top:30px;}
#conL{ float:left; width:850px;}
#conR{ /*position:absolute; left:auto; right:0;*/ margin:-30px 0 -60px 0; float:right; width:300px; min-height:100%; border-left:#d6d6d6 1px solid; padding-left:30px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
#subr img,#conL img,#conR img{ max-width:100%;}
.conR_tit{ font-size:22px; color:#212121; margin:25px 0 20px 0;}
.conR_tit i{ display:inline-block; width:20px; height:20px; overflow:hidden; background:url(../images/elements.png) left -60px no-repeat; vertical-align:middle; margin:0 8px;}
/*banner*/
#subBanner{ height:150px; height:auto !important; min-height:150px; background:url(../images/loading.gif) center center no-repeat #000; line-height:0; margin-bottom:25px;}
#subBanner img,#sbu_banner img{ *width:100%; max-width:100%;}
#FSBanner{height:150px; height:auto !important; min-height:150px; overflow:hidden;background:url(../images/loading.gif) center center no-repeat #000; line-height:0;}
#FSBanner div{ position:relative; width:1920px; left:50%; margin-left:-960px;}

/*当前位置*/
#posi{ text-align:right; height:68px; line-height:78px; color:#828282; overflow:hidden;}
#posi a{ color:#828282;}#posi a:hover{ color:#3e342e;}
#posi.dividing{ border-bottom:#d6d6d6 1px solid; margin-bottom:30px;}

/*list*/
.list_tit{ margin:22px 0;}
.list_tit img{ max-width:100%;}
#list{ margin-bottom:15px;}
#list dt{border-top:#9d9a98 1px dotted; line-height:0;}
#list dt a{ display:inline-block; height:40px; line-height:40px; width:100%; overflow:hidden;white-space: nowrap; text-overflow:ellipsis;-o-text-overflow:ellipsis; padding-left:23px; background:url(../images/icos.png) left -40px no-repeat; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; box-sizing:border-box;}
#list dt a.active{ background-position:left top;}
#list dd{ margin:0; padding:10px 0 20px 0; border-top:#9d9a98 1px dotted; line-height:0;}
#list dd a{display:inline-block; height:30px; line-height:30px; width:100%; overflow:hidden;white-space: nowrap; text-overflow:ellipsis;-o-text-overflow:ellipsis;background:url(../images/icos.png) 23px -80px no-repeat; padding-left:34px;-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; box-sizing:border-box;}
#list dd a:hover{ background-position:23px -110px;}

#linkPic{ line-height:0;}
#linkPic a{ width:100%; display:inline-block; margin-bottom:12px;}
#linkPic a img{ max-width:100%;}

/*排序*/
#sorting{ background:#87bd14; height:38px; line-height:38px; color:#fbe2bc; padding:0 25px; margin-bottom:25px;color:#fff1ce; font-size:12px;}
#sorting a{color:#fbe2bc; padding:0 20px; display:inline-block; height:38px; line-height:38px;}
#sorting a.currSort{ background:#fff1ce; color:#6A8F1b; margin-right:-4px;}

#sorting2{ height:38px; line-height:38px; color:#fbe2bc; padding:0 25px; float:left; margin-top:20px; color:#87bd14; font-size:12px;}
#sorting2 a{color:#87bd14; padding:0 20px; display:inline-block; height:38px; line-height:38px;}
#sorting2 a.currSort{ background:#87bd14; color:#fff1ce; margin-right:-4px;}

/*产品列表*/
#product{float:left; position:relative; margin-right:-30px;}
#product dl{ float:left; margin:0 25px 50px 0; padding:0; width:300px; overflow:hidden;}
#product dt{ margin:0 0 14px 0; padding:0;}
#product dt a{ background:#f4efe9; display:inline-block; width:300px; height:300px; border:#dcd2c8 1px solid; margin-bottom:20px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; line-height:0; text-align:center;}
#product dt a img{ max-width:100%; max-height:100%;}
#product dt a:hover{ border-color:#c0b3a6;}
#product dt span{ display:inline-block; height:24px; line-height:24px; font-size:14px; color:#87bd12; width:100%; overflow:hidden; white-space: nowrap; text-overflow:ellipsis;-o-text-overflow:ellipsis; }
#product dt b{ display:inline-block; height:24px; line-height:24px; font-size:18px; color:#364212; width:100%; overflow:hidden; white-space: nowrap; text-overflow:ellipsis;-o-text-overflow:ellipsis; text-indent:6px;}
#product dd p{line-height:22px; height:44px; overflow:hidden; margin:0; padding:0;}

/*产品详细页*/
#product_pic{ position:relative; float:left; width:42%; background:#f4f0e8;text-align:center; line-height:0; border:#dcd2c8 1px solid; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
#product_pic a{position:relative; display:inline-block; width:100%; overflow:hidden;}
#product_pic a img{ max-width:100%;}
#product_pic a i{ display:inline-block; position:absolute; left:auto; right:12px; top:auto; bottom:12px; width:30px; height:30px; background:url(../images/elements.png) left -30px no-repeat;}
#product_Info{ float:left; margin-left:4%;word-break:break-all; display:inline; width:54%;}
#product_Title{ line-height:34px; font-size:30px; word-break:break-all; margin:0; padding:20px 0; color:#364212;}
#product_Title span{ font-size:16px;}
#product_Param{ padding-top:15px;}
#product_Param li{ line-height:30px; margin:8px 0;}
#product_Param li span{ margin-right:8px; display:inline-block; width:auto !important; width:50px; min-width:50px;}
#price{ font-size:30px; color:#780b05; padding-right:8px;}
#NetWeight{ color:#787878; font-size:15px; padding-left:8px;}
a.NetWeight{ height:30px; line-height:30px; display:inline-block; border:#c8beb4 1px solid; padding:0 15px; margin-right:5px; cursor:pointer; cursor:hand;}
a.NetWeight.curr{ border:#780b05 1px solid; color:#780b05;}
#product_summary{ padding:0; margin:25px 0 15px 0;}
#product_Intro{ padding:30px 0 35px 0; border-bottom:#92c326 3px solid;}

.ico_tmalll{ display:inline-block; width:40px; height:40px; background:url(../images/elements.png) -30px -30px; vertical-align:middle; margin-right:5px;}
.ico_hair{ display:inline-block; width:40px; height:40px; background:url(../images/elements.png) -70px -30px; vertical-align:middle; margin-right:5px; }

/*------------------发质评测----------------------*/
#reviews{ background:url(../images/hairReviews_bg.jpg) left top no-repeat; position:relative; margin:50px auto; text-align:center; height:520px; overflow:hidden; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
#reviews_tit{ position:absolute; left:30px; top:0; height:42px; line-height:42px; font-size:26px; color:#fff1ce;}
#closeReviews{ position:absolute; z-index:10; left:auto; right:0; top:0; height:42px; line-height:42px; text-align:center; width:42px; background:#780b05; color:#fff1ce; font-size:12px;cursor:hand; cursor:pointer;}
.step{ position:absolute; z-index:1; width:100%; height:100%; left:0;}
.reviews_tit{ font-size:36px; color:#fff1ce; text-align:center; margin:90px 0 50px 0; padding:0;}
.reviews_tit i{ display:inline-block; width:50px; height:50px; background:url(../images/elements.png) -110px -30px no-repeat; vertical-align:middle; margin:-2px 10px 0 10px;}
/*步骤1*/
#step1{ top:0;}
#step1 ul{ width:90%; clear:both; margin:0 auto;}
#step1 li{ width:25%; text-align:center; float:left; cursor:hand; cursor:pointer;}
#step1 li a{ position:relative; display:inline-block; width:184px; height:184px; background:#f4f0e8; overflow:hidden;}
#step1 li a img{ width:180px; margin:2px;}
#step1 li a,#step1 li a img{border-radius:48%;}
#step1 li a span{ position:absolute; left:10%; top:33%; width:80%; height:100%; text-align:center; font-size:26px; color:#fff1ce; line-height:34px;}
#step1 li:hover a{ background:#f7c451; color:#780b05;}
#step1 li.curr img{ display:none;}#step1 li.curr span{ color:#780b05;}
/*步骤2*/
#step2{ top:100%;}
#resultPro{ width:80%; margin:-10px 10% 25px 10%; overflow:hidden;}
#resultPro ul{ height:236px; overflow:hidden; background:url(../images/loading.gif) center center no-repeat; color:#fff1ce;}
#resultPro ul.loaded{ background:none;}
#resultPro li{ float:left; width:33.3%; text-align:center; color:#fff1ce; line-height:0; display:none;}
#resultPro li p{ margin:0; padding:0;}
#resultPro li p a{ display:inline-block; width:174px; overflow:hidden; text-align:center; background:#f4f0e8; border-radius:48%;}
#resultPro li p a img{ max-width:170px; max-height:170px; margin:2px; border-radius:48%;}
#resultPro li p span{ display:inline-block; width:170px; margin:0 auto; clear:both; overflow:hidden; height:40px; line-height:40px; white-space: nowrap; text-overflow:ellipsis;-o-text-overflow:ellipsis;}
#resultPro li a.btn3{ display:inline-block; border:#8d8777 1px dotted; margin:0 6px; color:#fff1ce; padding:0 22px; height:20px; line-height:20px; font-size:12px;}
#resultPro li a.btn3:hover{ background:#fff1ce; color:#000; border:#fff1ce 1px solid;}

#prevPage,#nextPage{ display:inline-block; width:40px; height:50px; line-height:50px; position:absolute; left:0; top:45%; background:rgba(255,255,255,0.6); background:#a5a5a5\9; color:#000; font-size:25px; text-align:center; font-family:"宋体",Helvetica, sans-serif; cursor:hand; cursor:pointer; display:none;}
#nextPage{ left:auto; right:0;}
#prevPage:hover,#nextPage:hover{ background:#fff;}

/*头条新闻*/
#topNews{ width:100%; height:320px; position:relative; }
#topNews_pic{ position:absolute; left:0; top:0; margin:0; padding:0; width:405px; height:320px; overflow:hidden; background:url(../images/newsELE.png) left top no-repeat;}
#topNews_pic a{ display:inline-block; width:360px; height:270px; overflow:hidden; margin:18px 0 0 23px; background:#fff;}
#topNews_pic a img{ max-width:360px; max-height:270px; *width:360px;}
#topNews_cont{ margin:0; padding:15px 0 15px 438px;}
a.topNews_tit{ font-size:28px; padding:16px 0 0 0; display:inline-block; width:100%; height:40px; line-height:40px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis;color:#1c0404;}
a.topNews_tit:hover{ color:#780b05;}
.news_time{ font-size:11px; color:#a6a6a6;}
.news_summary{ line-height:24px; height:96px; width:100%; display:inline-block; overflow:hidden; color:#787878; margin:10px 0 20px 0;}
/*新闻相关按钮*/
a.readMore{ display:inline-block; height:30px; line-height:30px; overflow:hidden; background:url(../images/newsELE.png) -410px -60px no-repeat; color:#a6a6a6; cursor:hand; cursor:pointer; padding:0 10px 0 35px; vertical-align:top;}
a.readMore:hover{ background-position:-410px -90px; color:#e2b348;}
a.likeIt{ position:relative; display:inline-block; height:30px; line-height:30px; background:url(../images/newsELE.png) -410px top no-repeat; color:#87bd14; cursor:hand; cursor:pointer; padding:0 10px 0 35px; vertical-align:top;}
a.likeIt:hover,a.likeIt.clicked{ background-position:-410px -30px; color:#e2b348;}
a.likeIt b{ font-weight:normal;}
a.likeIt .promptBox{ position:absolute; left:12px; top:0; display:inline-block; width:70px; height:26px; line-height:18px; background:url(../images/newsELE.png) -410px -130px no-repeat; color:#dcac40; text-align:center;}
/*文章列表*/
#article{height:auto !important; height:350px; min-height:350px; margin:10px auto 50px auto;}
#article dl{ position:relative; height:185px; overflow:hidden; margin:20px 0 0 0; border-top:#bebebe 1px dotted; padding-top:20px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
#article dl dt{ position:absolute; width:210px; height:160px; top:20px; left:0; display:inline-block; z-index:100; border:#e1e1e1 1px solid;}
#article dl dt a{ display:inline-block; width:200px; height:150px; margin:5px; background:#fff;}
#article dl dt a img{ max-width:100%; max-height:100%; *width:100%;}
#article dl dd{ margin:0 0 0 250px; padding:0; }
a.articleTit{ display:inline-block; width:100%; height:24px; line-height:24px; overflow:hidden;white-space: nowrap; text-overflow:ellipsis;-o-text-overflow:ellipsis; font-size:17px; margin-top:12px; color:#1c0404;}
a.articleTit:hover{ color:#87bd14;}
a.articleTit span{ font-size:11px; color:#a6a6a6; float:right; margin-left:25px;}
#article dl dd p{ display:inline-block; width:100%; height:40px; margin:10px 0; padding:0; overflow:hidden; line-height:20px; font-size:12px; color:#787878;}
/*新闻详细*/
.c_tit{ font-size:33px; margin:0; padding:15px 0 10px 0; color:#1c0404; line-height:40px;}
.c_info{ font-size:12px; color:#a6a6a6; margin:5px 0 25px 0; padding:0 0 15px 0; border-bottom:#b0c3d2 1px dotted;}
.c_info .likeIt{ float:right;}
/*新闻按钮*/
#btns{ margin:25px 0 0 0;border-top:#b0c3d2 1px dotted; padding-top:28px;}
#btns a{ display:inline-block; font-size:18px; color:#c1c1c1;  margin-left:10px; cursor:hand; cursor:pointer; margin-right:30px;}
#btns a:hover{ color:#3e342e;}
#btns a i{ display:inline-block; width:40px; height:32px; background:url(../images/btns.png) left top no-repeat; vertical-align:middle; margin-top:-2px;}
#btns a.prevone:hover i{ background-position:left -40px;}
#btns a.nextone i{ background-position:-40px top;}
#btns a.nextone:hover i{ background-position:-40px -40px;}
#btns a.back i{background-position:-80px top;}
#btns a.back:hover i{ background-position:-80px -40px;}
/*相关新闻*/
#relatedNews dl{ padding:0 0 15px 0; margin:0 0 25px 0; border-bottom:#c8c8c8 1px dotted;}
#relatedNews dl dt{ margin:0; padding:0; }
#relatedNews dl dt a{ display:inline-block; width:100%; overflow:hidden; background:#000; text-align:center; line-height:0;}
#relatedNews dl dt a img{ max-width:100%; *width:100%;}
#relatedNews dl dd a{display:inline-block; width:100%; font-size:16px; line-height:26px; max-height:52px; overflow:hidden; *height:52px;}
#relatedNews dl dd p{ margin:0; padding:0; color:#787878; font-size:12px; line-height:20px; max-height:60px; overflow:hidden; *height:60px;}

/*试用申请*/
#tryout{ padding-top:20px;}
#tryout dl{ margin:0 auto 40px auto; clear:both;}
#tryout dl dt{ width:750px; float:left; margin:0 40px 20px 0; overflow:hidden;}
#tryout dl dt a{ display:inline-block; width:100%;}
#tryout dl dt a img{ max-width:100%;}
#tryout dl dd h1{ color:#780b05; font-size:26px; line-height:40px; margin:0; padding:20px 0 0 0;}
#tryout dl dd h2{ color:#780b05; font-size:18px; font-weight:normal; line-height:28px; margin:0; padding:0;}
#tryout dl dd h3{ font-size:14px; font-weight:normal; line-height:26px; margin:35px 0; padding:0;}
@media screen and (max-width: 1024px){
  #tryout dl dt{ width:650px;}
  #tryout dl dd h1{ font-size:22px; line-height:34px;}
  #tryout dl dd h2{ font-size:16px; line-height:24px;}
  #tryout dl dd h3{ margin:15px 0; font-size:13px; line-height:22px;}
}
/*试用申请表单*/
#applyForm{ position:relative; border-top:#d6d6d6 1px solid; padding:40px 0; display:none;}
#applyForm .caption{ width:410px; position:absolute; left:0; top:40px;}
#apply_Form{ margin-left:450px;}
#apply_Form input[type="text"],#apply_Form select{ height:40px; line-height:40px; background:#fff; border:#d2d2d2 1px solid; width:100%; font-size:16px; color:#a0a0a0; margin:0; padding:0 0 0 10px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}

a#apply_btn{ height:100%; display:inline-block;border:#d2d2d2 1px solid; width:30px; font-size:20px;color:#a0a0a0; padding:10px 19px 0 19px; text-align:center; margin-right:-5px; cursor:hand; cursor:pointer;}
a#apply_btn:hover{ background:#e6e6e6;}
/*评价*/
#evaluation_tit{ border-top:#780b05 2px solid; padding:40px 0; text-align:center;}
#evaluation_ava{ position:absolute; left:0; top:0; width:120px;}
#evaluation_ava span{ display:inline-block; width:100%; text-align:center; color:#959595; line-height:18px; background:#dedede; padding:4px 8px; margin:8px 0 0 0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
.ava img{ max-width:120px; *width:120px;}
/*评价内容*/
#evaluation_cont{ margin-left:175px;}
.voteTit{ float:left; margin:8px 0; color:#888;}
.vote{ float:left;margin:8px 0;}
.target{ float:left; background:#eeeeee; border:#d7d7d7 1px solid; color:#7d7d7d; font-size:12px; padding:0 6px; height:20px; line-height:20px; margin:8px 5px;}
textarea.Comment{ width:100%; height:165px; border:#d2d2d2 2px solid; padding:10px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; color:#a0a0a0; font-size:14px;}
/*评价列表*/
#evaluation_list{ margin-top:50px;}
#evaluation_list dl{ position:relative; padding:25px 0; border-top:#c8c8c8 1px dotted; height:120px; height:auto !important; min-height:130px;}
#evaluation_list dl dt{ position:absolute; left:0; top:25px; width:120px;}
#evaluation_list dl dd{ margin-left:175px; color:#7d7d7d;}
#evaluation_list dl dd h2{ color:#780b05; font-size:16px; font-weight:normal;}
.stars{ display:inline-block; height:20px; background:url(../images/star-on.png) left top repeat-x; width:100px; vertical-align:middle; margin-top:-4px;} 
.stars4{ width:80px;}.stars3{ width:60px;}.stars2{ width:40px;}.stars1{ width:20px;}

/*品牌故事*/
#brandBox{ overflow:hidden;}
#brand{ width:115%;}
#brand li{ width:580px; margin:0 40px 40px 0;}
#brand li a{ display:inline-block; width:100%; overflow:hidden; font-size:14px;}
#brand li a img{ max-width:100%; margin-bottom:8px;}
#brand li a b{ font-size:24px; font-weight:normal;}
#brand li a i{ display:inline-block; float:right; width:40px; height:54px; background:url(../images/elements.png) left -100px no-repeat #780b05;}

/*翻页*/
.pages{margin:35px 0 0 0; clear:both; height:30px; line-height:30px;  text-align:center; padding:15px 0;/*  background:#f4efe9; border:#e9ded3 1px solid; */}
.pages a,.pages a:visited{ vertical-align:middle; height:30px; width:30px; font-size:13px; margin:0 3px; display:inline-block; text-align:center;color:#666666; background:url(../images/pageshow_bg.png) left top no-repeat;}
.pages a:hover{color:#fbe2bc; background-position:left -70px;}
.pages span{ vertical-align:middle; margin:0 3px; color:#aeaeae; display:inline-block; height:30px; width:30px; text-align:center; background:url(../images/pageshow_bg.png) left -35px no-repeat;}
.pages .thisp{color:#fbe2bc; display:inline-block;width:30px; height:30px; background:url(../images/pageshow_bg.png) left -70px no-repeat;}
.pages a.disabled,.pages a[disabled~="disabled"]{ color:#a0a0a0; background-position:left -35px;}


a.turnPage{font-size:12px; letter-spacing:-0.3em; font-family:"宋体",serif; text-indent:-0.4em;}
a.turnPage.disabled,a.turnPage[disabled~="disabled"]{ color:#a0a0a0;}

@media screen and (max-width: 1024px){
	#subr{ width:730px;}#subr2{ width:700px;}
	#conL{ width:680px;}
	#conR{ width:250px}
	#product dl{ float:left; margin:0 30px 50px 0; padding:0; width:350px; overflow:hidden;}
	#product dt a{ width:350px; height:350px;}
}
