@charset "utf-8";
.m-left{ width: 860px; float: left;}
.m-right{ width: 300px; float: right;}
.white-box{ background-color: #fff;}
.box-shadow{ box-shadow: 0 2px 5px 0 rgba(0,0,0,.1) }
.pt10{ padding: 10px; }
.mb20{ margin-bottom: 20px; }

.icon-buy{ background-position: 0 -504px; color: #fff; font-size: 12px; padding: 0 5px; width: 92px; height: 25px;line-height: 25px;}
.icon-buy span{ color: #333; margin-right: 5px;}
.icon-like{background-color: #fe9cbb;border-radius: 0 2px 2px 0; background-position: 0 -454px;color: #fff; float: right; font-size: 12px;padding: 0 5px 0 52px;height: 20px;line-height: 20px;}
/* 当前地址*/
.location{ padding: 10px 0; }
.location .layui-breadcrumb a{ color: #666 !important;}
.location .layui-breadcrumb a cite{ color: #999;}
/*****++++ 口碑中心首页 +++++*****/
.koubei{ padding: 20px 0; }
.main-title{ border-bottom: 1px solid #ddd; font-size: 20px; padding-bottom: 10px; margin-bottom: 10px;}
.main-title strong{ color: #333; padding-right: 15px; }
.side-title{ border-bottom: 1px solid #ccc; height: 40px;line-height: 40px;}
.side-title span{ border-bottom: 2px solid #f42f2f; color: #333; display: inline-block; font-size: 16px; font-weight: bold; padding: 0 5px;}
/* 导航*/
.koubei-nav{ width: 190px; position: relative; display: inline-block; float: left;}
.koubei-nav ul{ border: 1px solid #ddd;}
.koubei-nav dt{ background-color: #e5e5e5; color: #333; height: 35px; line-height: 35px; padding: 0 10px;display: flex; align-items: center; justify-content: space-between;}
.koubei-nav dt i{ font-size: 18px; }
.koubei-nav dd{ margin: 10px; -webkit-line-clamp: 4;}
.koubei-nav dd a{ line-height: 28px; padding-right: 10px; font-size: 12px; display: inline-block;}

.koubei-nav .sub-nav{ background-color: #fff; border: 1px solid #ddd; box-shadow: 4px 3px 5px rgba(0,0,0,.2); position: absolute; top: 0; left: 189px; padding: 10px 20px; width: 750px; z-index: 999; display: none;}
.koubei-nav .sub-nav h6{ border-bottom: 2px solid #ddd; font-weight: bold; padding: 10px 5px; margin-bottom: 10px;}
.koubei-nav .sub-nav p{ display: inline-block; padding: 0 5px;}
.koubei-nav .sub-nav p a{ color: #646464;margin-right: 5px;width: 75px;height: 22px;overflow: hidden;display: block;float: left;margin-bottom: 5px;font-size: 12px; white-space: nowrap; text-overflow: ellipsis;}

/* banner轮播*/
.flexslider{ float: right; margin: 0px auto; position: relative; width: 1000px; height: 420px; overflow: hidden;}
.flexslider .slides li{ width: 100%; height: 100%;}
.flexslider .slides li img { width: 100%; height: 418px; display: block;}
.flex-control-nav{ width: 100%; position: absolute; bottom: 10px; text-align: center;}
.flex-control-nav li{ margin: 0 2px; display: inline-block; background-color: rgba(255,255,255,.5); border-radius: 50%;text-indent: -99em;width: 10px;height: 10px;cursor: pointer;}
.flex-control-nav li.active{ background-color: #fff;}

/* 口碑达人之选*/
.koubei-goods .main-title .layui-badge-rim{ margin-right: 5px; }
.koubei-goods .main-title .btn-more{ font-size: 12px; padding-top: 10px; }
.koubei-goods ul li{ width: 32%; }
.koubei-goods ul li:hover{ box-shadow: 0 3px 11.64px 0.36px rgba(0, 0, 0, 0.18);}

.proinfo .num{ color: #999; }
.proinfo i{ font-style: normal; padding-right: 2px;}

.star-info{ font-size: 11px;color: #999;margin-top: 6px;line-height: 11px;height: 12px; }
.star-info .star { display: inline-block; float: left; width: 66px;height: 12px;vertical-align: middle;background: url("../images/star.png") no-repeat;background-size: 86px auto;}
.star-info .comment{ display: inline-block;margin-left: 10px;vertical-align: middle;line-height: 13px;white-space: nowrap;word-wrap: normal;text-overflow: ellipsis;overflow: hidden;height: 12px;}
.star-info .star.star-0{ background-position:0 -134px}
.star-info .star.star-10{ background-position:0 -117px}
.star-info .star.star-20{ background-position:0 -100px}
.star-info .star.star-30{ background-position:0 -83px}
.star-info .star.star-35{ background-position:0 -66px}
.star-info .star.star-40{ background-position:0 -49px}
.star-info .star.star-45{ background-position:0 -32px}
.star-info .star.star-50{ background-position:0 -15px}

/* 进口保健品品牌排行榜*/
.koubei-brand .btn-more{ font-size: 14px; padding-top: 5px; }
.koubei-brand li{ float: left;width: 125px;height: 80px;line-height: 80px;margin: 0 10px 10px;text-align: center;}
.koubei-brand li img{ max-width: 100%; height: 80px; vertical-align: middle; }

/*****++++ 口碑中心列表页 +++++*****/
/* 导读*/
.koubei-guide h1 a{ font-size: 14px; padding: 5px; float: right; font-weight: normal;}
.koubei-guide h1 a:hover{ color: #fff !important; }
.koubei-guide{ padding: 20px; display: flex; justify-content: space-between;}
.koubei-guide .guide-img{ width: 200px; height: 200px; margin-right: 20px;}
.koubei-guide .guide-img img{ border-radius: 5px; width: 200px; height: 200px; }
.koubei-guide .guide-text{ flex: 1;}
.koubei-guide .guide-text .mark{ background: url("../images/JKbaike/cross-grain.png") no-repeat 0 0; border-radius: 25px; font-size: 22px; margin-bottom: 15px;}
.koubei-guide .guide-text .mark span{ background-color: #fff; display: inline-block; padding: 0 15px; margin-left: 30px;}
.koubei-guide .guide-text h1{ color: #333; font-size: 23px; font-weight: bold; margin: 10px 0;}
.koubei-guide .guide-text p{ font-size: 15px; text-indent: 30px; line-height: 28px; -webkit-line-clamp: 5;}
.koubei-guide .guide-text p i{ text-indent: 5px; }
.koubei-guide .guide-tuijian{ color: #38993C; font-size: 18px; font-weight: bold; padding: 10px 25px 0;}
.koubei-guide .guide-tuijian a{ color: #b222be; padding: 0 5px; text-decoration: underline; }

.koubei-main .btn-more{ font-size: 12px; float: right; padding-top: 10px;}
/* 品牌排行榜*/
.ranking-list li{ border-bottom: 1px dashed #ddd; display: inline-block; padding: 20px 0;}
.ranking-list li:last-child{ border-bottom: 0 none; }
.ranking-list li .list-pic{ width: 110px; height: 110px; float: left;}
.ranking-list li .list-text{ width: 730px; float: right; padding: 0 10px;}
.ranking-list li .list-text .t-tit{ font-size: 16px; display: inline-block; width: 100%;padding: 10px 0 0 0;}
.ranking-list li .list-text .t-tit a{ display: inline-block; max-width: 600px; }
.ranking-list li .list-text .t-intro{ padding: 10px 0 0 0; font-size: 12px; line-height: 22px;}
/* 同类品牌产品*/
.like-product ul{ padding:20px 0 0; }
.like-product ul li{ width: 100%; border-bottom: 1px dashed #ddd; }
.like-product ul li:last-child{ border-bottom: 0 none; }
.like-product ul li img{ width: 30%; float: left;}
.like-product ul .proinfo{ width: 65%; float: right; display: inline-block; padding: 0;}

/* 相关资讯*/
.correlation-news ul{ padding: 12px 0 0 20px; }
.correlation-news ul li{ border-bottom: 1px dashed #ddd; float: left; width: 100%; line-height: 40px; list-style-type: disc;}
.correlation-news ul li:hover{ color: #f42f2f; }
.correlation-news ul li a{ display: inline-block; width: 100%; float: left;}

/*****++++ 口碑中心产品页 +++++*****/
.koubei-product{ padding-top: 20px;}
.koubei-product .pro-img{ width: 300px; height: 300px;}
.koubei-product .pro-img img{ width: 300px; height: 300px;}
.koubei-product .pro-info{ width: 540px; padding: 10px 0;}
.koubei-product .pro-info h1{ border-bottom: 1px dashed #ddd; font-size: 22px; padding-bottom: 10px; margin-bottom: 10px;}
.koubei-product .pro-info ul{ padding-bottom: 10px;}
.koubei-product .pro-info ul li{ font-size: 16px; line-height: 30px;}
.koubei-product .pro-info ul li span{}
.koubei-product .pro-btn a:hover{ color: #fff !important; }

.koubei-parameter{ padding-top: 50px; }
.koubei-parameter .layui-tab{ margin-top: 0; border-width: 1px 0 0 0; box-shadow: none;}
.koubei-parameter .layui-tab-title li{ font-weight: bold; }
.koubei-parameter .layui-tab-title .layui-this{ border-top: 2px solid #f42f2f; color: #f42f2f; }

.koubei-parameter table{ margin-top: 20px;}
.koubei-parameter table th{ color: #333; text-align: right; font-weight: bold; width: 100px;}
.koubei-parameter table td.pic{ width: 300px; padding: 0;}
.koubei-parameter table td.pic img{ max-width: 300px; height: 300px; }

/* 用户评价*/
.evaluate #page{ text-align: center;  margin: 20px 0 0;}
.evaluate .evaluate-star{ display: flex; align-items: center; justify-content: center; padding: 20px;}
.evaluate .evaluate-star .s-left{ display: inline-block; font-size: 26px; font-weight: bold;}
.evaluate .evaluate-star .s-middle{ display: inline-block; padding: 0 20px;}
.evaluate .evaluate-star .s-middle li{ display: flex; align-items: center; margin-bottom: 10px;}
.evaluate .evaluate-star .s-middle li .layui-progress{ width: 200px; display: inline-block; margin: 0 10px; height: 12px;}
.evaluate .evaluate-star .s-middle li .layui-progress .layui-progress-bar{ height: 12px; }
.evaluate .evaluate-star .s-right{ display: inline-block; }

.evaluate-content dl{ border-bottom: 1px solid #ddd; display: flex; padding: 10px 0;}
.evaluate-content dl dt{ padding-right: 20px;}
.evaluate-content dl dt img{ border-radius: 50%; width: 50px; height: 50px;}
.evaluate-content dl dd{ padding: 15px 0; width: 100%;}
.evaluate-content dl dd .c-1{ border-bottom: 1px dashed #eee; padding-bottom: 10px;}
.evaluate-content dl dd .c-1 span{ float: right; color: #bbb;}
.evaluate-content dl dd .c-2, .evaluate-content dl dd .c-3{ margin-top: 10px; }
.evaluate-content dl dd .c-2 span{ margin-right: 5px; }
.evaluate-content dl dd .c-3 span{ color: #000; }
.evaluate-content dl dd .moip li{ display: inline-block; float: left; margin: 10px 10px 0 0;}
.evaluate-content dl dd .moip li:hover{ cursor: pointer; }
.evaluate-content dl dd .moip li img{ width:100px; height:100px;max-width: 500px;}
#tooltip{ position:absolute; display:none;}

/*****++++ 口碑中心排行榜 +++++*****/
/* 左侧导航*/
.brandindex-nav{ display: inline-block; float: left; }
.brandindex-nav .layui-nav{ background-color: #e5e5e5; border: 1px solid #ddd; width: 190px;}
.brandindex-nav .layui-nav-tree .layui-nav-item a:hover{background-color:#ededed;}
.brandindex-nav .layui-nav-tree .layui-nav-item a{ color: #333 !important; font-weight: bold; }
.brandindex-nav .layui-nav-tree .layui-nav-bar{ background-color: #333; }
.layui-nav .layui-nav-more{ border-top-color: rgba(51,51,51, .7); }
.brandindex-nav .layui-nav-itemed .layui-nav-child{ background-color: #fff !important; }
.brandindex-nav .layui-nav-itemed .layui-nav-child a{ font-weight: normal; }
.brandindex-nav .layui-nav-itemed .layui-nav-child dd:hover a{ color: #f42f2f !important;}

/* 右侧品牌展示*/
.brandindex-con{ width: 990px; float: right; }
.brand-tab .layui-tab{ margin: 0; }
.brand-tab .layui-tab-item li{ display: inline-block; width: 20%; float: left; text-align: center; margin: 10px 0;}
.brand-tab .layui-tab-item li img{ border: 1px solid #eee; padding: 10px; margin-bottom: 10px;}

/* 成分大全*/
.brand-nav ul{ border: 1px solid #ddd; display: inline-block; }
.brand-nav li{ border-right: 1px solid #ddd; display: inline-block; float: left; padding: 15px 30px;}
.brand-nav li:last-child{ border-right: 0 none; }
.brand-nav li a{ color: #515151; font-size: 18px; font-weight: bold;}
.brand-nav li i{ color: #b654ce; font-size: 20px; margin-right: 10px; }

.products-list dl{ border-bottom: 1px dashed #ddd; display: inline-block; width: 100%; padding-bottom: 15px; margin-bottom: 15px;}
.products-list dt{ border-radius: 5px 5px 0 0; display: inline-block; float: left; text-align: center; width: 6%; padding: 10px 0;}
.products-list dt strong{ display: block;}
.products-list dt span{ display: block; font-size: 28px; font-family: arial;}
.products-list dd{ display: inline-block; float: left; width: 92%; padding: 0 0 0 2%;}
.products-list dd a{ display: inline-block; width: 100px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 0 15px 10px 0;}

.gongxiao-list{ border: 1px solid #ddd; }
.gongxiao-list ul{ border-right: 1px dashed #ddd;padding: 10px 0;display: inline-block;width: 19%;vertical-align: top;margin: 0 auto;text-align: center;}
.gongxiao-list ul:last-child{ border-right: 0 none; }
.gongxiao-list ul li{ padding: 5px 0; }

/* 右侧保健品排行榜*/
.brand-list{  }
.brand-list dl{ margin: 0 40px 20px 0; max-height: 365px; overflow: hidden;}
.brand-list dt{ border-bottom: 1px dashed #ddd; font-size: 18px; font-weight: 550; padding: 0 0 10px 10px; margin-bottom: 5px;}
.brand-list dd{ padding-left: 10px; }
.brand-list dd a{ line-height: 30px; display: inline-block; width: 100%;}

/*****++++ 口碑中心功效页 +++++*****/
.koubei-gongxiao{ box-sizing: border-box; display: inline-block; width: 100%;}
.koubei-gongxiao ul li{ width: 19%;}
.koubei-gongxiao ul li:hover{ box-shadow: 0 3px 11.64px 0.36px rgba(0, 0, 0, 0.18);}
.koubei-gongxiao.goods ul li img{ width: auto; height: 223px; margin: 0 auto; display: block;}

/*****++++ 口碑中心品牌页 +++++*****/
.brandInfo-guide.koubei-guide .guide-img{ border: 1px solid #ddd; height: 120px; line-height: 120px; text-align: center;}
.brandInfo-guide.koubei-guide .guide-img img{ max-width: 100%; width: auto; height: 118px; display: inline-block; }

/* 产品展示-形式1*/
.goods ul li{ width: 24%; margin: 0.5%; float: left; padding: 0 0 1%;}
.goods ul li img{ width: 99%; padding: 1px;}
.goods ul .proinfo{ padding: 10px 10px 0;}
.goods ul .proinfo h3{ font-weight: normal;font-size: 14px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin: 5px 0;}
.goods ul .proinfo h5{ color: #777; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.goods ul .proinfo .row{ display: flex; align-items: center; }
.goods ul .proinfo .price{ font-size: 18px; color: #f42f2f;}
.goods ul .proinfo .targ{ border: 1px dotted #f42f2f; color: #f42f2f; margin-left: 5px; padding: 0 3px;}
.goods ul .proinfo .num{ padding: 5px 0 0; display: flex; align-items: center; justify-content: space-between;}
.goods ul .proinfo .num .comment{ color: #666;}
.goods ul .proinfo .num .comment i{ color: #ccc; margin-right: 3px;}

.hotspot{ border: 1px solid #ddd; }
.hotspot .hotspot-title{ font-size: 20px; padding: 20px 32px 0;}
.hotspot .tag-ul{ padding: 20px 20px 0; }
.hotspot .tag-ul li{ color: #252a33; display: inline-block; float: left; margin-bottom: 15px; width: 140px; height: 30px; line-height: 32px}
.hotspot .tag-ul li a{ display: block; position: relative; padding-left: 8px; margin-left: 4px; color: #252a33; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
