/* *
 * desc: 公司要求首页导航条有单独的样式，所以单独在此css文件加对应的代码
 */
 .navbar-fixed-top {
    background-color: rgba(1, 1, 1, .5);
    transition: all .4s ease;
}
.navbar-fixed-top.scroll600px {
    background-color: rgba(1, 1, 1, 1);
}
.navbar-fixed-top .navbar-nav li a {
    color: #fff !important;
}
.navbar-fixed-top .navbar-nav li.open a,
.navbar-fixed-top .navbar-nav li a.active,
.navbar-fixed-top .navbar-nav li a:hover {
    color: #1b1b1b !important;
    background-color: #fff !important;
}
header { margin-top: 0 !important; }
@media screen and (max-width: 767px)  { 
    header{ margin-top: 0 !important; }
}
/* 首页独立的头部样式结束 */


/* 横幅banner */
.swiper-container {
    width: 100%;
    height: 600px;
}  
.swiper-container .swiper-slide {width: 100%}
.swiper-container .swiper-bgimg {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;  
    background-position: center center;
}  


/* ss0产品中心 */
.ss0 .row,
.ss1 .row  {width: 100%;margin: 0 auto;} /*80%*/
/* 公用标题样式 */
.ss0 .common-til,
.ss1 .common-til,
.ss3 .common-til,
.ss4 .common-til,
.ss2 .common-til {margin: 30px 0;text-align: center;}
.ss2 .common-til.left {text-align: left;}
.ss0 .common-til h3,
.ss1 .common-til h3,
.ss3 .common-til h3,
.ss4 .common-til h3,
.ss2 .common-til h3 {font-size: 24px;color:#000;}
.ss0 .common-til p,
.ss1 .common-til p,
.ss3 .common-til p,
.ss4 .common-til p,
.ss2 .common-til p {font-size: 12px;color:#B5B5B5;margin-top: 10px;}
/* 六张图片 */
.ss0 .col-xs-6 {position: relative;padding: 0;overflow: hidden;}
.ss0 .col-xs-6 .product-img {width: 100%;height: 237px;vertical-align: bottom;cursor: pointer;transition: all .4s ease;}
.ss0 .col-xs-6:hover .product-img{transform: scale(1.1);}
/* hover加号层 */
.ss0 .col-xs-6 .light-yarn-xm {
    transition: all .4s ease;opacity: 0;
    position: absolute;
    top: 0;left:0;
    right: 0;bottom: 0;
    background-color: rgba(27, 27, 27, .7);
}
.ss0 .col-xs-6 .light-yarn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    text-align: center;
    cursor: pointer;
}
.ss0 .col-xs-6:hover .light-yarn-xm {opacity: 1;}
.ss0 .col-xs-6 .light-yarn img {width: 4rem; height: 4rem;}
.ss0 .col-xs-6 .light-yarn h4{color: #FFBE23;font-size: 14px;margin: 10px 0;}
.ss0 .col-xs-6 .light-yarn p{color: #A0A0A0;font-size: 12px;}
/* More Right */
.more-right {
    height: 1px;
    background-color: #E5E5E5;
    margin: 50px 0;
    position: relative;
}
.more-right p {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 150px;
    text-align: center;
    height: 50px;
    line-height: 50px;
    color: #313131;
    background-color: #fff;
}

@media screen and (max-width: 1199px) {
    .swiper-container {height: 500px;}
}
@media screen and (max-width: 991px)  {
    .swiper-container {height: 400px;}
    .ss0 .row {width: 100%;margin: 0 auto;}
}
@media screen and (max-width: 767px)  {
    .swiper-container {height: 200px;}
    .ss0 .col-xs-6 .light-yarn img {width: 2rem; height: 2rem;}
    .ss0 .col-xs-6 .product-img {width: 100%;height: 117px;}
    .ss0 .col-xs-6 .light-yarn h4{font-size: 12px;}
}
/* ss1品牌创意 */
.ss1 {background-color: #F5F5F5;padding: 0 0 50px;}
.ss1 .col-xs-12 {cursor: pointer;padding: 0 10px;margin-bottom: 15px;position: relative;}
.ss1 .col-xs-12:nth-child(2) {left: -10px;}
.ss1 .col-xs-12:nth-child(4) {right: -10px;}
.ss1 .col-xs-12:hover .brand-img{transform: scale(1.1);}
.ss1 .col-xs-12:hover .brand-top-box{opacity: 1;}
.ss1 .col-xs-12:hover .brand-bottom{background-color: #fff;}
.ss1 .brand-top {position: relative;overflow: hidden;}
.ss1 .brand-top .brand-img{width: 100%;vertical-align: middle;transition: all .3s ease;}
.ss1 .brand-top-box {opacity: 0;height: 30px;background-color: #FFBE23;position: absolute;bottom: 0;width: 100%;transition: all .3s ease;}
.ss1 .brand-top-box img {width: 14px; height: 14px;position: absolute;top: 50%; left: 50%;transform: translate(-50%, -50%);}
/*text-align-last: justify;*/
.ss1 .brand-bottom {background-color: transparent;border:1px solid rgba(229, 229, 229, 1);box-shadow:0px 7px 27px 2px rgba(123,123,123,0.18);padding: 10px 20px;transition: all .3s ease;}
.ss1 .brand-bottom h3 {color: #313131;font-size: 16px;height: 40px;line-height: 40px;text-align: center;}
.ss1 .brand-bottom p {color: #898989;height: 50px; overflow: hidden;font-size: 12px;line-height: 25px;text-align: justify;}
.ss1 .brand-bottom p::after { display: inline-block;width: 100%;content: '';height: 0;}

@media screen and (max-width: 767px)  {
    .ss1 .col-xs-12 {padding: 0;}
    .ss1 .col-xs-12:nth-child(2) {left: 0;}
    .ss1 .col-xs-12:nth-child(4) {right: 0;}
}

/* ss2关于我们 */
.ss2 {padding: 30px 0;background-image: url(../images/index/about_us_bg.png);overflow: hidden;}
.ss2 .col-xs-12 .about-left {position: relative;top: 110px;}
.ss2 .about-p { color: #7D7D7D; font-size: 13px;line-height: 30px;}
.ss2 .about-right {text-align: right;}
.ss2 .about-img {height: 500px;width: 90%;}
@media screen and (max-width: 767px)  {
    .ss2 .common-til.left {text-align: center;}
    .ss2 .col-xs-12 .about-left {top: 0;}
    .ss2 .about-img {height: 300px;width: 100%;}
}

/* ss3新闻动态 */
.ss3 {display: flex;align-items: center;}
.ss3 .news-left,
.ss3 .news-right {flex: 1;}
.ss3 .news-left img {width: 100%;margin: 10px 0;}
.ss3 .news-left ul,
.ss3 .news-right ul {
    padding-left: 90px;
}
.ss3 .news-left li,
.ss3 .news-right li {
    position: relative;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
}
.ss3 .news-right li:last-child {border-bottom: none;}
.ss3 .news-left li b,
.ss3 .news-right li b {
    position: absolute;
    top: 11px;
    font-size: 18px;
    font-weight: normal;
    color: #626262;
}
.ss3 .news-right li b span {
    display: block;
    font-size: 14px;
    margin-top: 5px;
    color: #777;
}
.ss3 .news-left li b {left: -90px;}
.ss3 .news-right li b {left: -75px;}
.ss3 .news-left li h3,
.ss3 .news-right li h3 {
    color: #434343;
    font-size: 16px;
    height: 40px;
    line-height: 40px;
    overflow: hidden;
    /* white-space: nowrap; */
    text-overflow: ellipsis;
}
.ss3 .news-left li p,
.ss3 .news-right li p {
    color: #898989;
    font-size: 12px;
    line-height: 20px;
}
.ss3 .news-right ul {
    border-left: 1px solid #eee;
}
.ss3 .news-right ul li.more p {
    text-align: right;
    color: #313131;
    font-size: 16px;
    margin-bottom: -20px;
}
@media screen and (max-width: 767px)  {
    .ss3 .news-right ul {border-left: none;}
    .ss3 .news-left ul, .ss3 .news-right ul {padding-left: 70px;}
    .ss3 .news-left li b, .ss3 .news-right li b {left: -70px;}
}