﻿
.route_index .category-warp {
  background-color: #fff;
}
.route_index .category-box {
  padding: 20px 20px 0px;
  position: relative;
}
.route_index .item {
  padding-bottom: 22px;
}
.route_index .item .item_category:before{
  box-sizing: content-box;
    width: 0px;
    height: 0px;
    position: absolute;
    right: -21px;
    top: 50%;
    padding: 0;
    border-right: 8px solid #fff;
    border-top: 8px solid transparent;
    border-left: 8px solid transparent;
    border-bottom: 8px solid transparent;
    display: block;
    content: '';
    z-index: 12;
    margin: -4px 0px 0px 0px;
    }
.route_index .item .item_category:after{
  box-sizing: content-box;
    width: 0px;
    height: 0px;
    position: absolute;
    right: -20px;
    top: 50%;
    padding: 0;
    border-right: 9px solid #2e677a;
    border-top: 9px solid transparent;
    border-left: 9px solid transparent;
    border-bottom: 9px solid transparent;
    display: block;
    content: '';
    z-index: 10;
    margin: -5px 0px 0px 0px;
    }
.route_index .item_category {
  display: block; width: 250px; margin-right: 20px; height: 200px;-moz-transition: 0.3s; -webkit-transition: 0.3s;  -o-transition: 0.3s; transition: 0.3s;
  position: relative;background: #d2e4e6;
}

.route_index .item:hover .item_category {
  background: #2e677a;
}
.route_index .item_category .pic-box {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.route_index .item_category .pic-box img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}
.route_index .item_category .info-box {position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,0.2);
    padding: 10px;
}

.route_index .item_category .info-box .title {
  color: #fff;
  font-size: 14px; height: 35px;
  line-height: 45px;
  display: block;
  padding: 0px 10px 0px 10px;
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.route_index .item .box_cont{height:200px; display: flex; background: #fff; padding: 12px 15px;  border: 1px solid #2e677a; border-radius: 10px; -moz-transition: 0.3s; -webkit-transition: 0.3s;  -o-transition: 0.3s; transition: 0.3s;}


.route_index .item .box_cont .msg{max-width: 30%;}
.route_index .item .box_cont .msg p{width: 90%; text-indent:2em; line-height:29px; color:#333; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6;}
.route_index .item .box_cont .news{flex: 1; overflow: hidden;}
.route_index .item .box_cont .news ul{height: 150px;}
.route_index .item .box_cont .news ul li a{ display:block; position: relative; color:#333;  line-height:30px; padding: 0px 0px 0px 18px;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.route_index .item .box_cont .news ul li a:hover{ color:#2e677a;}
.route_index .item .box_cont .news ul li a:before{box-sizing: content-box; width: 0px; height: 0px; position: absolute; top: 50%; left: 0; padding: 0;  border-left: 3px solid #ffffff;  border-bottom: 5px solid transparent; border-top: 5px solid transparent; display: block; content: ''; z-index: 11;  margin: -5px 0px 0px 0;}
.route_index .item .box_cont .news ul li a:after{
    box-sizing: content-box;
    width: 0px;
    height: 0px;
    position: absolute;
    top: 50%;
    left: 0;
    padding: 0;
    border-left: 10px solid #2e677a;
    border-bottom: 5px solid transparent;
    border-top: 5px solid transparent;
    display: block;
    content: '';
    z-index: 10;
    margin: -5px 0px 0px 0px;
    }
.route_index .item .box_cont .more{border-radius: 3px;overflow: hidden;}
.route_index .item .box_cont .more a{color:#f08336; display: inline-block;}
