@import url('./base.css');

/* 新闻文字列表样式 */
.news {
    margin: 0;
}

.news ol {
    padding: 15px 0;
    border-bottom: 1px dashed #d8d8d8;
    margin: 0 0 7px 0;
    position: relative;
}

.news ol .news-img {
    margin-right: 15px;
    width: 150px;
    height: 100px;
    overflow: hidden;
}

.news ol .info {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    flex: 1;
    width: 0;
}

.news ol .info h5 {
    font-size: 16px;
}

.news ol .info p {
    font-size: 13px;
    line-height: 1.8em;
    height: 5.4em;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    margin-bottom: 0;
    color: #999;
}

.news li {
    font-size: 14px;
    line-height: 20px;
    padding: .6em 0;
    border-bottom: 1px dashed #e8e8e8;
}

.news li>.date {
    font-size: 14px;
    color: #999;
    margin-left: 1em;
    font-family: Arial, Helvetica, sans-serif;
}


/* 品牌企业 */
.layer1 ul {
    overflow: hidden;
    margin: 0 -.5em;
}

.layer1 ul li {
    float: left;
    width: 14.2857%;
    padding: 0 .5em;
}

.layer1 ul li a {
    display: block;
    border: 1px solid #e8e8e8;
    height: 107px;
    overflow: hidden;
}

.layer1 ul li a img {
    max-width: 100%;
    max-height: 100%;
    transition: all .2s ease-in-out;
}

.layer1 ul li a:hover img {
    transform: scale(1.1);
}

/* 图片轮播效果 */
.layer2 {
    width: 475px;
    height: 355px;
}

/* .layer2 .swiper-wrapper{
    display: block;
} */


/* 行业资讯 */
.layer3 {
    margin-left: 1.5em;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    flex: 1;
}

.layer3 .card {
    border: none;
    border-radius: 0;
    display: block !important;
}

.layer3 .card-header {
    background: none;
    border: none;
    padding: 0;
}

.layer3 .card-header .nav {
    padding-left: 1em;
}

.layer3 .card-header .nav-link.active {
    color: #dc3545;
    font-size: 18px;
}

.layer3 .card-header .nav-link.active em {
    font-style: normal;
    color: #999;
    margin-left: .5em;
}

.layer3 .card-body {
    padding-top: 0;
    padding-bottom: 0;
}

.layer3 .news li {
    border-bottom: none;
    padding: .5em .5em .5em 0;
}

.layer3 .news li a {
    float: left;
    max-width: 100%;
}

.layer3 .news li:last-child {
    padding-bottom: 0;
}

/* 新特产品 */
.layer4 .card {
    border-color: #D53980;
}

.layer4 .card-header {
    background-color: #e83e8c;
    color: #fff;
    font-size: 18px;
}

.layer4 .card-header-more {
    font-size: 12px;
    color: #fff;
}

.layer4 .card-header-more i {
    width: 1em;
    height: 1em;
}

.layer4 .card-header-more:hover,
.layer4 .card-header-more:hover i {
    color: #FCE4EF;
}

.layer4 .card-body .superSlide {
    width: 100%;
    overflow: hidden;
    height: 165px;
}

.layer4 .card-body ul li {
    float: left;
    width: 198px;
    padding: 0 8px;
}

.layer4 .card-body ul li a {
    display: block;

}

.layer4 .card-body ul li a .img {
    width: 182px;
    height: 137px;
    display: block;
    overflow: hidden;
    background-color: #f5f5f5;
    border: 1px solid #e8e8e8;

}

.layer4 .card-body ul li a .img img {
    max-width: 100%;
    max-height: 100%;
}

.layer4 .card-body ul li a .txt {
    display: block;
    line-height: 1em;
    font-size: 14px;
    text-align: center;
    margin-top: 1em;

}

.layer4 .card-body ul li a:hover .txt {
    color: #e83e8c;
}

/* 橡胶制品 */
.layer5 {
    width: 240px;
}

.layer5 .card {
    border-color: #e8e8e8;
    border-radius: 0;
}

.layer5 .card-header {
    padding: 0;
    background-color: #4565F7;
    color: #fff;
    text-align: center;
    line-height: 85px;
    font-size: 28px;
    margin: -1px -1px 0 -1px;
    border-bottom: none;
}

.layer5 .card-body {
    padding: .5em .625em;
}

.layer5 .card-body .row {
    margin-left: 0;
    margin-right: 0;
}

.layer5 .card-body .row [class*=col-] {
    padding-left: 0;
    padding-right: 0;
    font-size: 13px;
    margin: .5em 0;
}

.layer5 .card-body .row [class*=col-] a {
    max-width: 100%;
}

.layer5 .card-footer {
    border-top: none;
    background: none;
    padding: 0 .625em .5em;
}

/* 网上商城 */
.layer6 {
    border: 1px solid #e8e8e8;
    border-left: none;
    padding: 1.5em;
}

.layer6 .row [class*=col-] a {
    display: block;
}

.layer6 .row [class*=col-] a .thumb-center {
    width: 180px;
    height: 180px;
    margin: 0 auto;
}

.layer6 .row [class*=col-] a .price {
    color: #dc3545;
    line-height: 1em;
    margin-top: .5em;
    text-align: center;
}

.layer6 .row [class*=col-] a .title {
    line-height: 1em;
    margin-top: .5em;
    text-align: center;
}

/* 橡胶企业 科研院所 模具制造/橡胶机械 */
.layer7 .row {
    margin-left: -.5em;
    margin-right: -.5em;
}

.layer7 .row [class*=col-] {
    padding-left: .5em;
    padding-right: .5em;
}

.layer7 .card {
    border-color: #e8e8e8;
    border-radius: 0;
    padding: .5em 1em 1em;
}

.layer7 .card-header {
    background-color: #fff;
    padding-left: 1em;
    padding-right: .5em;
    border-bottom-color: #D80000;
    color: #D80000;
    font-size: 18px;
}

.layer7 .card-header-more {
    font-size: 12px;
    color: #999;
}

.layer7 .card-header-more i {
    width: 1em;
    height: 1em;
}

.layer7 .card-header-more:hover,
.layer7 .card-header-more:hover i {
    color: #e83e8c;
}

.layer7 .card-body {
    padding: .5em 0 0;
}

.layer7 .card-body ul {
    height: 322px;
}

.layer7 .card-body ul li {
    font-size: 16px;
}

.layer7 .card-body ul li .icon-zs {
    padding-right: 20px;
    background: url('/static/img/icon1.png') right center no-repeat;
}

/* 二手橡胶设备 */
.layer8 .card {
    border-color: #41cac0;
    border-radius: 0;
}

.layer8 .card-header {
    background-color: #41cac0;
    color: #fff;
    font-size: 18px;
    border-radius: 0;
}

.layer8 .card-header-more {
    font-size: 12px;
    color: #fff;
}

.layer8 .card-header-more i {
    width: 1em;
    height: 1em;
}

.layer8 .card-header-more:hover,
.layer8 .card-header-more:hover i {
    color: #E5F8F6;
}

.layer8 .card-body .row {
    height: 183px;
}

.layer8 .card-body .row [class*=col] {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    flex: 1;
    width: 0;
    max-width: 20%;
}

.layer8 .card-body ul li a {
    display: block;
}

.layer8 .card-body ul li a .img {
    width: 100%;
    height: 155px;
    display: block;
    overflow: hidden;
    background-color: #f5f5f5;
    border: 1px solid #e8e8e8;

}

.layer8 .card-body ul li a .img img {
    max-width: 100%;
    max-height: 100%;
}

.layer8 .card-body ul li a .txt {
    display: block;
    line-height: 1em;
    font-size: 14px;
    text-align: center;
    margin-top: 1em;

}

.layer8 .card-body ul li a:hover .txt {
    color: #e83e8c;
}

/* 求购信息 */
.layer9 {
    width: 320px;
    padding: 0 1em 0;
    border-right: 1px dashed #e8e8e8;
    margin-right: 1em;
}

.layer9 .card {
    border: none;
    border-radius: 0;
}

.layer9 .card-header {
    background: none;
    padding: .5em .5em 0 0;
    line-height: 41px;
}

.layer9 .card-header-title {
    padding: 0 .5em;
    margin-bottom: -1px;
    border-bottom: 1px solid #FBB101;
}

.layer9 .card-header-more {
    font-size: 12px;
    color: #999;
}

.layer9 .card-header-more i {
    width: 1em;
    height: 1em;
}

.layer9 .card-header-more:hover,
.layer9 .card-header-more:hover i {
    color: #e83e8c;
}

.layer9 .card-body {
    padding: .5em 0 0 0;
}

.layer9 .card-body ul li {
    font-size: 14px;
    padding: .3em 0;
    line-height: 29px;
    border-bottom: none;
}

/* 供应信息 */
.layer10 {
    padding-right: 1em;
}

.layer10 .card {
    border: none;
    border-radius: 0;
}

.layer10 .card-header {
    background: none;
    padding: .5em .5em 0 0;
    line-height: 41px;
}

.layer10 .card-header-title {
    padding: 0 .5em;
    margin-bottom: -1px;
    border-bottom: 1px solid #FBB101;
}

.layer10 .card-header-more {
    font-size: 12px;
    color: #999;
}

.layer10 .card-header-more i {
    width: 1em;
    height: 1em;
}

.layer10 .card-header-more:hover,
.layer10 .card-header-more:hover i {
    color: #e83e8c;
}

.layer10 .card-body {
    padding: .5em 0 0 0;
}

.layer10 .card-body ul li {
    font-size: 14px;
    padding: .3em 0;
    line-height: 29px;
    border-bottom: none;
}

/* 招聘求职信息 */
.layer11 {
    width: 330px;
}

.layer11 .card {
    border: none;
    border-radius: 0;
    padding: .5em 1em 1em;
}

.layer11 .card-header {
    background: none;
    padding: 0;
    border: none;
}

.layer11 .card-header .nav {
    border-bottom-color: #e8e8e8;
}

.layer11 .card-header .nav-link:hover {
    color: inherit;
    border: 1px solid #fff;
    border-bottom-color: #e8e8e8;
}

.layer11 .card-header .nav-link.active,
.layer11 .card-header .nav-link.active:hover {
    color: #FBB101;
    border: 1px solid #fff;
    border-bottom-color: #FBB101;
}

.layer11 .card-body {
    padding: 0;
    height: 335px;
}

.layer11 .card-body ul li {
    padding: .5em 0 .5em 1em;
    position: relative;
    border-bottom: 1px dashed #e8e8e8;
}

.layer11 .card-body ul li::before {
    position: absolute;
    top: 1.1em;
    left: 5px;
    width: 0;
    height: 0;
    content: '';
    border: 4px solid transparent;
    border-left-color: #FBB101;
}

.layer11 .card-body ul li a {
    display: block;
    line-height: 1.8em;
    font-size: 14px;
}

.layer11 .card-body ul li a .title {
    display: block;
    color: #333;
}

.layer11 .card-body ul li a .info {
    display: block;
    color: #999;
}

.layer11 .card-body ul li a i,
.layer11 .card-body ul li a em {
    font-style: normal;
}

.layer11 .card-body ul li a:hover .title {
    color: #e83e8c;
}

/* 橡胶百科 技术交流 配方工艺 技术标准 */
.layer12 .row {
    margin-left: -.5em;
    margin-right: -.5em;
}

.layer12 .row [class*=col-] {
    padding-left: .5em;
    padding-right: .5em;
}

.layer12 .card {
    border-color: #e8e8e8;
    border-radius: 0;
}

.layer12 .card-header {
    font-size: 16px;
    border-radius: 0;
}

.layer12 .card-header-more {
    font-size: 12px;
    color: #999;
}

.layer12 .card-header-more i {
    width: 1em;
    height: 1em;
}

.layer12 .card-header-more:hover,
.layer12 .card-header-more:hover i {
    color: #e83e8c;
}

.layer12 .card-body {
    padding: .5em 1em;
}

.layer12 .card-body .news {
    height: 303px;
}

/* 橡塑制品 */
.layer13 .card {
    display: block !important;
}

.layer13 .card-header {
    font-size: 18px;
}

.layer13 .card-body .left {
    width: 60%;
    margin-right: 1em;
    border-right: 1px dashed #e8e8e8;
    padding-right: 1em;
}

.layer13 .card-body ul li {
    font-size: 14px;
    padding-top: .25em;
    padding-bottom: .25em;
}

.layer13 .card-body .right ul {
    overflow: hidden;
    position: relative;
    padding-left: 5em;
}

.layer13 .card-body .right ul ol {
    font-size: 14px;
    color: #999;
    padding-top: .25em;
    padding-bottom: .25em;
    margin-right: 1em;
    position: absolute;
    top: 0;
    left: 0;
    width: 5em;
}

.layer13 .card-body .right ul li {
    margin-right: .65em;
    float: left;
}

.layer13 .card-body .right ul li:last-child {
    margin-right: 0;
}

.layer13 .card-body h3 {
    font-size: 18px;
    color: #000;
    font-weight: bold;
    margin-top: .65em;
    margin-bottom: .65em;
}

/* 产业带头人 */
.layer14 .card {
    border-color: #fd7e14;
    border-radius: 0;
}

.layer14 .card-header {
    background-color: #fd7e14;
    color: #fff;
    font-size: 18px;
    border-radius: 0;
}

.layer14 .card-header-more {
    font-size: 12px;
    color: #fff;
}

.layer14 .card-header-more i {
    width: 1em;
    height: 1em;
}

.layer14 .card-header-more:hover,
.layer14 .card-header-more:hover i {
    color: #E5F8F6;
}

.layer14 .card-body .row {
    height: 215px;
}

.layer14 .card-body .row [class*=col] {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    flex: 1;
    width: 0;
    max-width: 14.28%;
}

.layer14 .card-body ul li a {
    display: block;
}

.layer14 .card-body ul li a .img {
    width: 100%;
    height: 187px;
    display: block;
    overflow: hidden;
    background-color: #f5f5f5;
    border: 1px solid #e8e8e8;

}

.layer14 .card-body ul li a .img img {
    max-width: 100%;
    max-height: 100%;
}

.layer14 .card-body ul li a .txt {
    display: block;
    line-height: 1em;
    font-size: 14px;
    text-align: center;
    margin-top: 1em;

}

.layer14 .card-body ul li a:hover .txt {
    color: #fd7e14;
}

/* 友情链接 */
.links .card {
    border-color: #007bff;
    border-radius: 0;
}

.links .card-header {
    background-color: #007bff;
    border-radius: 0;
    color: #fff;
}

.links .card-body ul {
    margin: 0 -.5em;
}

.links .card-body ul li {
    display: inline-table;
    padding: 0 .5em;
    font-size: 14px;
}

@media screen and (min-width: 751px) {
    .layer1 ul li:nth-child(n + 8) {
        margin-top: 1em;
    }

}
@media screen and (min-width: 751px) and (max-width: 1024px){
    
}
@media screen and (max-width: 750px) {

    .wssc .d-flex,
    .baner-5 .d-flex,
    .gqxx>.d-flex,
    .gqxx>.d-flex>.flex-auto>.d-flex {
        display: block !important;
    }

    .gqxx>.d-flex>.flex-auto {
        border-right: 1px solid #e8e8e8 !important;
    }

    .gqxx .flex-auto {
        display: block !important;
        width: 100% !important;
        padding: 0 1em 0;
    }

    .layer1 ul li {
        width: 20%;
        padding: 0;
    }

    .layer2,
    .layer3,
    .layer5,
    .layer6,
    .layer9,
    .layer11 {
        width: 100%;
        height: auto;
    }

    .layer3 {
        margin-left: 0;
        -webkit-box-flex: none;
        -moz-box-flex: none;
        flex: none;
    }

    .layer6 {
        border: 1px solid #e8e8e8;
        border-left: none;
        padding: 1.5em;
    }

    .layer6 .col-3,
    .layer8 .card-body .row [class*=col],
    .layer14 .card-body .row [class*=col] {
        max-width: 50%;
    }

    .layer9 {
        margin-right: 0;
        border-right: none;
    }

    .layer10 {
        padding-right: 0;
    }

    .layer7 .col-4,
    .layer12 .col-3 {
        max-width: 100%;
        flex: 0 0 100%;
        margin-bottom: .5em;
    }

    .news .col-6 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .layer13 {
        display: none;
    }

    .layer10 .card-body ul li:nth-child(even) {
        display: none !important;
    }

    .layer14 .card-body .row {
        height: 135px;
    }

    .layer14 .card-body ul li a .img {
        height: 100px;
    }
    .layer6 .row [class*=col-] a .thumb-center {
    max-width: 100%;
    }
    
    .layer4 .card-body .superSlide {
        height: auto;
    }

    .layer4 .card-body ul li {
        width: 50%;
        padding: .5em;
    }

    .layer4 .card-body ul li a .img {
        max-width: 100%;
    }
}