@charset "utf-8";

.crumb { height: 45px; line-height: 45px; color: #969696; font-size: 12px; }
.crumb a { color: #969696; }
.crumb a:hover { color: #14b9c8; }
.crumb span { padding: 0 2px; font-family: Serif;font-weight: bold;padding-right: 0px; }

.rankingwarp .cont_L { width: 295px; margin-right: 15px;float: left; }
.rankingwarp .cont_R { width: 890px; float: right;}
.rankingwarp .rankinglabe { width: 100%; }
.rankingwarp .rankinglabe .bt { height: 77px; background: #14b9c8; text-align: center; color: #fff; display:block; cursor:pointer;}
.rankingwarp .rankinglabe .bt i { display: inline-block; vertical-align: middle; margin: 15px 0 5px 0; height: 25px; width: 26px; background-position: -140px -77px; }
.rankingwarp .rankinglabe .bt span { display: block; }
.rankingwarp .rankinglabe ul li { margin-top: 6px; background: #fff; text-align: center; }
.rankingwarp .rankinglabe ul li .tab,
.rankingwarp .rankinglabe ul li>a { display: block; height: 52px; line-height: 52px; position: relative; width: 173px; padding: 0 50px; margin: 0 11px; }
.rankingwarp .rankinglabe ul li .tab:after { background: url("../images/ico_img.png") no-repeat center; height: 11px; width: 6px; background-position: -14px 0; content: ''; position: absolute; right: 0px; top: 20px; }
.rankingwarp .rankinglabe ul li i { display: block; position: absolute; }
.rankingwarp .rankinglabe ul li .tab span { width: 100%; text-align: center; display: block; overflow: hidden; cursor: pointer; }
.rankingwarp .rankinglabe ul li .ico1 { height: 19px; width: 26px; background-position: -178px -80px; left: 12px; top: 18px; }
.rankingwarp .rankinglabe ul li .ico2 { height: 23px; width: 16px; background-position: -216px -78px; left: 17px; top: 16px; }
.rankingwarp .rankinglabe ul li .list_box { width: 100%; display: none; padding-bottom: 10px; }
.rankingwarp .rankinglabe ul li .list_box .lis { height: 43px; line-height: 43px; position: relative; }
.rankingwarp .rankinglabe ul li .list_box .lis:first-child .ico:before { display: none; }
.rankingwarp .rankinglabe ul li .list_box .lis:last-child .ico:after { display: none; }
.rankingwarp .rankinglabe ul li .list_box .lis:hover { background: #f6f6f6; }
.rankingwarp .rankinglabe ul li .list_box .lis:hover .ico i { background: #ff7044; border-color: #ff7044; }
.rankingwarp .rankinglabe ul li .list_box .lis .ico { position: absolute; width: 50px; height: 43px; left: 0px; top: 0px; }
.rankingwarp .rankinglabe ul li .list_box .lis .ico:before, .rankingwarp .rankinglabe ul li .list_box .lis .ico:after { width: 2px; height: 18px; content: ''; display: block; position: absolute; left: 24px; background: #eee; z-index: 0; }
.rankingwarp .rankinglabe ul li .list_box .lis .ico:before { top: 0px; }
.rankingwarp .rankinglabe ul li .list_box .lis .ico:after { bottom: 0px; }
.rankingwarp .rankinglabe ul li .list_box .lis .ico i { display: block; width: 7px; height: 7px; border: 1px solid #a2a2a2; position: absolute; left: 21px; top: 18px; background: #fff; border-radius: 20px; z-index: 1; }
.rankingwarp .rankinglabe ul li .list_box .lis a { margin: 0 11px; position: relative; width: 173px; padding: 0 50px; display: block; overflow: hidden; height: 100%; }
.rankingwarp .rankinglabe ul li .list_box .lis.on { background: #f6f6f6; }
.rankingwarp .rankinglabe ul li .list_box .lis.on a{color: #14b9c8;}
.rankingwarp .rankinglabe ul li .list_box .lis.on .ico i { background: #ff7044; border-color: #ff7044; }
.rankingwarp .rankinglabe ul li.on .tab:after { transform: rotate(90deg); }
.rankingwarp .rankinglabe ul li.on .list_box { display: block; }
.rankingwarp .rankinglabe ul li.cur a{color: #14b9c8;}

.rank_top {background-color: #fff;padding: 20px 10px;}
.rank_info {width: 100%;height: 240px;margin-bottom: 20px;background: #FFFFFF;border: 2px solid #eee;border-radius: 10px;box-sizing: border-box;display: flex;}
.rank_info .top_img {position: relative;top: -2px;left: -2px;display: block;width: 420px;height: 240px;flex: 0 0 auto;}
.rank_info .top_img img {display: block;width: 100%;height: 100%;border-radius: 10px}
.rank_info .des {padding: 20px 25px 0; flex: 1 1 auto;min-width: 0;}
.rank_info .des h1 {font-size: 24px;font-family: Microsoft YaHei;font-weight: bold;color: #333333;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.rank_info .des p {height: 134px;margin-top: 10px;font-size: 14px;font-family: Microsoft YaHei;font-weight: 400;color: #666666;line-height: 28px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 5;overflow: hidden}
.rank_info .des .author {color: #969696;font-size: 12px;display: flex;justify-content: flex-end;margin-top: 15px;}
.rank_info .des .author span {display: block;margin-left: 20px;}

.rankinglist {margin-top: 30px;}
.rankinglist li{ margin-top: 20px;width: 830px;transition: all 0.3s;border: 1px solid #eee;position: relative;;padding: 20px;height: 140px;/*box-shadow: 0 0 10px 5px #eeeeee; */}
.rankinglist li img{ float: left;border-radius: 15px;display: block;width: 140px;height: 140px;transition: all 0.3s; }
.rankinglist li a.aImg{ width: 140px;height: 140px;overflow: hidden;display: block;float: left; border-radius: 20px;}
.rankinglist li dl { margin-left: 20px;float: left;width: 550px; }
.rankinglist li dl dt{ width: 100%;height: 32px;overflow: hidden;; display: flex;}
.rankinglist li dl dt a{display: block;font-weight: 600;font-size: 20px;line-height: 32px;height: 32px;overflow: hidden;color: #434343;flex: 0 0 auto;/* min-width: 0; */}
.rankinglist li dl dt p{color: #969696;margin-left: 10px;line-height: 36px;/* max-width: 250px; */flex: 0 1 auto;}
.rankinglist li dl dt span{ float: left;color: #ff4b3a;line-height: 36px; }
.rankinglist li dl dt em{ width: 14px;height: 18px;background-position: -440px -140px;margin: 8px ;margin-left: 23px;}
.rankinglist li dl dd.cont1{ font-size: 14px;line-height: 26px;border-bottom: 1px solid #eeeeee;padding-bottom: 6px; width: 100%;height: 52px;overflow: hidden;margin-top: 8px;color: #969696;}
.rankinglist li dl dd.cont2{ width: 550px;height: 28px;overflow: hidden;margin-top: 12px; }
.rankinglist li dl dd.cont2 a{display: block;background: #43D3E0;float: left;height: 24px;margin-bottom: 5px;color: #ffffff;padding: 0 7px;transition: all 0.3s;margin-right: 20px;text-align: center;line-height: 24px;border-radius: 5px;transition: all 0.3s;font-size: 12px;}
.morwNav{ float: right;width: 80px;height: 80px;margin: 34px 10px 0 20px;transition: all 0.3s; }
.icon2 {background: url(../images/cn_bg4.png) no-repeat;display: block;}
.morwNav em{width: 43px;height: 42px;float: initial;background-position: -430px -200px;margin: 0 auto; }
.morwNav p{ font-size: 18px;color: #14b9c8;text-align: center;margin-top: 8px; }
.rankinglist li em.most{ position: absolute;top: -5px;right: -5px; }
.rankinglist li:nth-child(1) em.most{ width: 83px;height: 66px;background-position: 0 0 ; }
.rankinglist li:nth-child(2) em.most{ width: 83px;height: 66px;background-position: -110px 0 ; }
.rankinglist li:nth-child(3) em.most{ width: 83px;height: 66px;background-position: -220px 0 ; }
.rankinglist li dl dt a:hover{ color: #14b9c8;}
.rankinglist li img:hover{ transform: scale(1.12); }

.related_rank {margin-top: 15px;background-color: #fff;}
.related_rank .title { height: 50px; line-height: 50px; border-bottom: 1px solid #f2f2f2; padding: 0 10px;}
.related_rank .title .bt { font-size: 20px; font-weight: 600;}
.related_rank .title .bt:before { width: 4px; height: 20px; content: ''; display: inline-block; vertical-align: middle; background: #14b9c8; margin: -3px 8px 0 0; }
.related_rank .rank_list {padding: 10px;display: flex;flex-wrap: wrap;}
.related_rank .rank_list li {border: 1px solid #eee;line-height: 40px;border-radius: 4px;padding: 0 9px;color: #434343;width: 144px;text-align: center;font-size: 14px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;margin-right: 12px;margin-bottom: 8px;}
.related_rank .rank_list li:nth-of-type(5n){margin-right: 0;}
.related_rank .rank_list li a{display: block;overflow: hidden;}
.related_rank .rank_list li:hover {background-color: #14b9c8;color: #fff;border-color: #14b9c8;}
.related_rank .rank_list li:hover a {color: #fff;}