/*-----------------------------------------------------------*/

/*copyright by 动力无限  www.btoe.cn*/

/*邮箱 btoe@btoe.cn*/

/*合作电话 400-0599-360*/

/*版权所有违者必究*/

/*-----------------------------------------------------------*/

.sjcTop,

.sjcTop2,

.sjcBottom,

.sjcLeft,

.sjcRight,

.rightWow,

.leftWow,

.bottomWow,

.bg {

    -webkit-transition: all 0.8s ease-out;

    transition: all 0.8s ease-out;

}



.banner {

    width: 100%;

    position: relative;

    z-index: 8;

    margin-top: 130px;

    height: 750px;

    overflow: hidden;

}



.banner .slider {

    position: absolute !important;

    left: 50%;

    transform: translate(-50%);

    width: 100% !important;

    height: 100%;

    overflow: hidden;

    z-index: 1;

    top: 0;

    margin: 0 auto;

}



.banner .slider-main {

    width: 100%;

    height: 100%;

    position: absolute;

    left: 50%;

    transform: translate(-50%);

    z-index: 1;

}



.banner .slider-main li {

    width: 100%;

    height: 100%;

}



.banner .slider-main li a img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.banner .osSlider-main .slider-btn-prev {

    position: absolute;

    z-index: 30;

    top: 50%;

    left: -81px;

    width: 81px;

    height: 81px;

    text-indent: -9999px;

    margin-top: -20px;

    background: url(../images/arrowPrev.png) 50% 50% no-repeat;

    transition: all 0.5s linear;

    cursor: pointer;

}



.banner .osSlider-main:hover .slider-btn-prev {

    left: 10%;

}



.banner .osSlider-main .slider-btn-next {

    position: absolute;

    z-index: 30;

    top: 50%;

    right: -81px;

    width: 81px;

    height: 81px;

    text-indent: -9999px;

    margin-top: -20px;

    background: url(../images/arrowNext.png) 50% 50% no-repeat;

    transition: all 0.5s linear;

    cursor: pointer;

}



.banner .osSlider-main:hover .slider-btn-next {

    right: 10%;

    cursor: pointer;

}





.one {

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

}



.tran {

    transition: all 0.5s ease-in-out;

    -webkit-transition: all 0.5s ease-in-out;

}



a,

img {

    transition: all 0.5s ease-in-out;

    -webkit-transition: all 0.5s ease-in-out;

}



button,

input {

    border: none;

    outline: none;

}



.out {

    position: relative;

}



.out:hover::after,

.out:hover::before {

    width: 100%;

}



.out:hover>a::after,

.out:hover>a::before {

    height: 166px;

}



.out:hover .pro_hot_txt>a {

    color: #0074d4;

}



.out::after,

.out::before {

    content: "";

    position: absolute;

    width: 0;

    height: 1px;

    background: #386be1;

    left: 0;

    transition: all 0.5s ease-in-out;

    -webkit-transition: all 0.5s ease-in-out;

}



.out::after {

    top: 0;

}



.out::before {

    top: 166px;

}



.in::after,

.in::before {

    content: "";

    position: absolute;

    width: 1px;

    height: 0;

    background: #386be1;

    top: 0;

    transition: all 0.5s ease-in-out;

    -webkit-transition: all 0.5s ease-in-out;

}



.in::after {

    left: 0;

}



.in::before {

    right: 0;

}



.shadow:hover {

    transform: translateY(-5px);

    box-shadow: 0 10px 15px -10px rgba(0, 0, 0, 0.5);

}



.shadow2:hover {

    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

}



.linkeff {

    position: relative;

}



.linkeff:hover::after,

.linkeff:hover::before {

    width: 100%;

}



.linkeff::after,

.linkeff::before {

    content: "";

    position: absolute;

    width: 0;

    height: 100%;

    height: 1px;

    background: #386be1;

    transition: all 0.5s ease-in-out;

    -webkit-transition: all 0.5s ease-in-out;

}



.linkeff::after {

    left: 0;

    top: 0;

}



.linkeff::before {

    right: 0;

    bottom: 0;

}



.img_white {

    overflow: hidden;

}



.img_white::after {

    display: block;

    content: "";

    width: 100%;

    height: 100%;

    position: absolute;

    z-index: 1;

    -webkit-transform: scaleY(0);

    transform: scaleY(0);

    -webkit-transform-origin: bottom;

    transform-origin: bottom;

    background: linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6));

    background: -webkit-linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6));

    background: -moz-linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6));

    background: -o-linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6));

    background: -ms-linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.6));

    opacity: 1;

    bottom: -100%;

    transition: all 0.8s ease-in-out;

    -webkit-transition: all 0.8s ease-in-out;

    -ms-transition: all 0.8s ease-in-out;

    -o-transition: all 0.8s ease-in-out;

}



.img_white:hover::after {

    -webkit-transition: all 1s cubic-bezier(0, 0, 0.18, 0.96);

    transition: all 1s cubic-bezier(0, 0, 0.18, 0.96);

    -webkit-transform: scaleY(1);

    transform: scaleY(1);

    -webkit-transform-origin: top;

    transform-origin: top;

    opacity: 0;

    bottom: 100%;

}



.img_save {

    position: absolute;

    left: 0;

    top: 0;

    right: 0;

    bottom: 0;

    margin: auto;

    max-width: 100%;

    max-height: 100%;

}





.yebl {

    width: 1300px;

    margin: 0 auto;

}





/* tit-box */

.tit-box {

    display: inline-block;

    position: relative;

    line-height: 40px;

}



.tit-box::after {

    content: "";

    position: absolute;

    top: 30px;

    left: -320px;

    width: 320px;

    height: 1px;

    background-color: #162544;

    border-radius: 0px 1px 1px 0px;

    opacity: 0.2;

}



.tit-box .num {

    display: block;

    border-radius: 50%;

    width: 58px;

    height: 58px;

    background-color: #162544;

    font-family: Arial;

    font-size: 22px;

    text-align: center;

    line-height: 58px;

    font-weight: bold;

    color: #ffffff;

    margin-bottom: 20px;

}



.tit-box .yw {

    font-family: Arial;

    font-size: 36px;

    font-weight: bold;

    color: #bb9f6f;

    display: block;

}



.tit-box .tit {

    display: block;

    font-size: 20px;

    color: #162544;

}





/* pro-box */

.pro-box {

    padding: 80px 0;

    overflow: hidden;

}



.pro-con {

    position: relative;

}



.pro-ul li {

    display: inline-block;

    margin-right: 37px;

}



.pro-ul li a,

.slide-pro .more {

    display: block;

    width: 140px;

    height: 220px;

    box-sizing: border-box;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    background-color: #ffffff;

    border: solid 1px #e5e5e5;

    padding: 8px;

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

}





.pro-ul li a .icon,

.slide-pro .more .icon {

    display: block;

    width: 66px;

    height: 66px;

    border-radius: 50%;

    text-align: center;

    line-height: 66px;

    background-color: #162544;

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

}





.pro-ul li a .tit,

.slide-pro .more .tit {

    font-size: 18px;

    color: #333333;

    width: 90%;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    text-align: center;

    margin-top: 35px;

}





.pro-ul li a .yw,

.slide-pro .more .yw {

    display: block;

    width: 100%;

    text-align: center;

    font-family: Arial;

    font-size: 12px;

    color: #bfbfbf;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}



.pro-ul li a .yw::before,

.slide-pro .more .yw::before {

    content: '';

    display: block;

    width: 20px;

    height: 3px;

    position: relative;

    left: 50%;

    transform: translateX(-50%);

    margin: 7px 0 10px;

    background-color: #e6e6e6;

}



.pro-ul li.on a .icon,

.slide-pro .more:hover .icon {

    background-color: #bb9f6f;

}



.pro-ul li.on a,

.slide-pro .more:hover {

    border: solid 1px #fff;

    box-shadow: 0 0 20px rgba(0, 0, 0, 0.04);

}



.pro-bd .top {

    margin: 50px 0;

}



.pro-bd .top a {

    box-sizing: border-box;

    display: block;

}



.pro-bd .top a img {

    width: 670px;

    height: 430px;

    padding: 14px;

    background-color: #ffffff;

    border: solid 1px #e5e5e5;

    object-fit: cover;

    vertical-align: top;

}



.pro-bd .top a>span {

    width: 520px;

    display: inline-block;

    margin-left: 55px;

}





.pro-bd .top a>span .tit {

    display: block;

    font-size: 20px;

    width: 80%;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    color: #333333;

    margin: 140px 0 0;

}





.pro-bd .top a>span .desc {

    display: block;

    font-size: 15px;

    line-height: 36px;

    color: #8c8c8c;

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

}



.pro-bd .top a>span .desc::before {

    content: "";

    display: block;

    width: 28px;

    height: 3px;

    margin: 25px 0 20px;

    background-color: #bb9f6f;

}



.pro-bd .bd>div{

    height: 828px;

}



.ty-ul li {

    display: inline-block;

    margin-right: 22px;

}



.ty-ul li:last-child {

    margin-right: 0;

}



.ty-ul li a {

    display: block;

    width: 300px;

    box-sizing: border-box;

    position: relative;

}



.ty-ul li a img {

    width: 280px;

    height: 200px;

    object-fit: cover;

    padding: 9px;

    background-color: #ffffff;

    border: solid 1px #e5e5e5;

}



.ty-ul li a i {

    display: block;

    font-size: 18px;

    margin-top: 16px;

    width: 80%;

    color: #333333;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}





.ty-ul li a i::before {

    content: "-";

    margin-right: 10px;

    display: inline-block;

}





.ty-ul li a::before {

    content: "";

    display: inline-block;

    position: absolute;

    right: 0;

    bottom: 8px;

    width: 48px;

    height: 60px;

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

    background-color: #ffffff;

    border-radius: 0px 0px 24px 24px;

    box-shadow: 0 3px 18px rgba(0, 0, 0, 0.03);

}





.ty-ul li a::after {

    content: "";

    display: inline-block;

    position: absolute;

    width: 10px;

    height: 16px;

    bottom: 30px;

    right: 18px;

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

    background: url(../images/pror1.png) no-repeat center;

}



.ty-ul li:hover a img {

    padding: 8px;

    border: solid 2px #bb9f6f;

}



.ty-ul li:hover a::before {

    background-color: #bb9f6f;

    box-shadow: none;

}



.ty-ul li:hover a::after {

    background: url(../images/pror2.png) no-repeat center;

}



.pro-con .search-box {

    position: absolute;

    width: 534px;

    height: 60px;

    z-index: 99;

    line-height: 60px;

    padding: 0 5px 0 20px;

    right: 0;

    top: 270px;

    box-sizing: border-box;

    background-color: #ffffff;

    border-radius: 30px;

    border: solid 1px #e5e5e5;

}



.pro-con .search-box input {

    font-size: 14px;

    width: 85%;

    margin-right: 20px;

    color: #999999;

}



.search-box input::-webkit-input-placeholder {

    /* WebKit browsers */

    font-size: 14px;

    color: #999999;

}



.search-box input:-moz-placeholder {

    /* Mozilla Firefox 4 to 18 */

    font-size: 14px;

    color: #999999;

}



.search-box input::-moz-placeholder {

    /* Mozilla Firefox 19+ */

    font-size: 14px;

    color: #999999;

}



.search-box input:-ms-input-placeholder {

    /* Internet Explorer 10+ */

    font-size: 14px;

    color: #999999;

}



.pro-con .search-box button {

    width: 50px;

    height: 50px;

    background-color: #162544;

    border-radius: 25px;

    cursor: pointer;

}



.pro-con .phone {

    position: absolute;

    top: 619px;

    right: 255px;

    font-family: Arial;

    font-size: 16px;

    letter-spacing: 1px;

    color: #333333;

}



.pro-con .phone img {

    margin-right: 10px;

}



.pro-con .phone i {

    font-family: Arial;

    font-size: 27px;

    font-weight: bold;

    color: #162544;

    margin-left: 3px;

    display: inline-block;

}



/* adv-box */

.adv-box {

    overflow: hidden;

    background: url(../images/adv-bg.jpg) no-repeat center top;

    background-size: cover;

    margin: 0 0 80px;

    overflow: hidden;

    padding-bottom: 50px;

    background-position-y: -50px;

}



.adv-con{

    position: relative;

}



.adv-bd {

    height: 770px;

    box-sizing: border-box;

}



.adv-bd .bd>div {

    position: relative;

}



.adv-bd .bd>div img {

    position: absolute;

    top: 0;

    left: -310px;

}



.adv-bd .bd>div .text {

    text-align: right;

    margin-top: 290px;



}



.adv-bd .bd>div .text .tit::before {

    content: "";

    display: block;

    width: 30px;

    height: 3px;

    margin-left: auto;

    background-color: #162544;

    margin-bottom: 30px;

}



.adv-bd .bd>div .text .tit {

    font-size: 20px;

    font-weight: bold;

    color: #333333;

}



.adv-bd .bd>div .text .yw {

    font-family: Arial;

    font-size: 12px;

    letter-spacing: 20px;

    color: #bfbfbf;

    display: block;

    margin: 15px -20px 30px 0;

    text-transform: uppercase;

}



.adv-bd .bd>div .text .desc {

    width: 610px;

    font-size: 15px;

    line-height: 40px;

    color: #8c8c8c;

    margin-left: auto;

}



.slide-adv {

    position: relative;

}



.slide-adv .hd {

    position: absolute;

    bottom: 0;

    right: 0;

}



.slide-adv ul {

    display: flex;

    align-items: flex-end;

}



.slide-adv li {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    width: 83px;

    height: 120px;

    background-color: #162544;

    border-radius: 10px 10px 0px 0px;

    box-sizing: border-box;

    margin-left: 37px;

    cursor: pointer;

    transition: all .5s;

    -webkit-transition: all .5s;

}



.slide-adv li img {

    width: 29px;

    height: 29px;

    object-fit: contain;

}



.slide-adv li p {

    font-size: 18px;

    color: #ffffff;

    margin-top: 18px;

}



.slide-adv li p::after {

    content: "";

    display: none;

    width: 12px;

    height: 2px;

    margin: 14px 0 14px 10px;

    background-color: #d0bc9a;

}



.slide-adv li i {

    display: none;

    font-family: Arial;

    font-size: 12px;

    color: #dfd3c0;

    text-transform: uppercase;

    text-align: center;

}



.slide-adv li.on {

    width: 83px;

    height: 160px;

    background-color: #bb9f6f;

    border-radius: 10px 10px 0px 0px;

}



.slide-adv li.on p::after {

    display: block;

}



.slide-adv li.on i {

    display: block;

}



.adv-con .tit-box{

    position: absolute;

    z-index: 9;

    top: 80px;

    right: 0;

    text-align: right;

    left: auto;

}



.adv-con .tit-box .num{

    margin-left: auto;

}



.adv-con .tit-box::after{

    left: auto;

    right: -320px;

}



.adv-con .sj{

    position: absolute;

    top: -4px;

    left: 54px;

}



.adv-con .gd{

    position: absolute;

    bottom: -50px;

    left: 132px;

}











/* case-box */

.case-box {

    overflow: hidden;

}



.case-tit .tit-box {

    display: flex;

    align-items: center;

}



.case-tit .tit-box span {

    margin-left: 18px;

    display: inline-block;

}



.case-tit>p {

    font-size: 14px;

    letter-spacing: 4px;

    color: #333333;

    margin-top: 20px;

}



.swiper-case {

    margin-top: 50px;

}



.sw-case {

    width: 93%;

    margin-left: auto;

}







.slide-case {

    position: relative;

}



.case-bd .bd li a {

    display: block;

}





.case-bd .bd li span {

    display: inline-block;

    width: 508px;

    margin-right: 78px;

}



.case-bd .bd li a>img {

    vertical-align: top;

    width: 580px;

    height: 380px;

    object-fit: cover;

    padding: 9px;

    background-color: #ffffff;

    border: solid 1px #e5e5e5;

}



.case-bd .bd li a .tit {

    margin-top: 43px;

    font-size: 20px;

    font-weight: bold;

    color: #162544;

    display: inline-block;

    max-width: 90%;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    padding-bottom: 10px;

    border-bottom: 2px solid #162544;

}



.case-bd .bd li a .desc {

    margin-top: 15px;

    text-indent: 2em;

    display: block;

    font-size: 15px;

    line-height: 34px;

    color: #8c8c8c;

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;



}



.case-bd .bd li a .mo {

    margin-top: 15px;

    display: block;

    font-size: 14px;

    color: #808080;

    padding-top: 20px;

    border-top: 1px dashed #dedede;

}



.case-bd .bd li a .mo img {

    margin-left: 10px;

}





.slide-case .hd {

    position: absolute;

    bottom: 0;

    left: 0;

}



.slide-case .hd li {

    display: inline-block;

    margin-right: 13px;

}



.slide-case .hd li a {

    display: block;

}





.slide-case .hd li a img {

    width: 142px;

    height: 106px;

    object-fit: cover;

    padding: 7px;

    background-color: #ffffff;

    border: solid 1px #e5e5e5;

}



.swiper-case .swiper-pagination-bullets {

    width: auto;

    position: relative;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    margin: 20px 0;

}



.swiper-case .swiper-pagination-bullets span {

    display: block;

    margin: 0 0 15px !important;

    font-family: Arial;

    font-size: 14px;

    color: #999999;

    width: 27px;

    height: 27px;

    border-radius: 0;



}



.swiper-case .control {

    position: absolute;

    z-index: 99;

    top: 30px;

    left: 16px;

    height: 100%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

}



.swiper-case .control img {

    cursor: pointer;

}



.swiper-case .swiper-pagination-bullet {

    background: transparent;

    opacity: 1;

}



.swiper-case .swiper-pagination-bullet-active {

    border-bottom: 2px solid #bb9f6f;

    color: #bb9f6f !important;

}



.swiper-case>a {

    position: absolute;

    top: 0;

    left: 0;

    width: 51px;

    height: 50px;

    line-height: 50px;

    text-align: center;

    background-color: #162544;

    border-radius: 0px 0px 12px 0px;

    color: #fff;

    font-size: 30px;

    font-family: SimSun;

    font-weight: lighter;

}



.swiper-case>a::before {

    content: "";

    position: absolute;

    left: 51px;

    top: 0;

    width: 136px;

    height: 2px;

    background-color: #162544;

}



.swiper-case>a::after {

    content: "";

    position: absolute;

    top: 50px;

    left: 0;

    width: 2px;

    height: 136px;

    background-color: #162544;

}







/* process */

.process {

    overflow: hidden;

    padding: 80px 0;

}



.pcs-tit .tit-box {

    display: flex;

    text-align: right;

    align-items: center;

}



.pcs-tit .tit-box span {

    margin-right: 30px;

}



.pcs-tit .tit-box::after {

    left: auto;

    right: -320px;

}



.xunpan {

    position: relative;

    display: inline-block;

    cursor: pointer;

}



.xunpan img {

    margin-right: 14px;

}



.xunpan i {

    font-size: 14px;

    color: #737373;

}





.xunpan .tips {

    position: absolute;

    left: 36px;

    top: 26px;

    width: 180px;

    height: 30px;

    line-height: 30px;

    text-align: center;

    color: #fff;

    background-color: #162544;

    border-radius: 4px;

    font-weight: bold;

    box-shadow: 5px 5px 2px rgba(158, 158, 158, .3);



    -webkit-transform: translateX(-20%) scale(0);

    -moz-transform: translateX(-20%) scale(0);

    -o-transform: translateX(-20%) scale(0);

    -ms-transform: translateX(-20%) scale(0);

    transform: translateX(-20%) scale(0);

    -webkit-transition: transform .6s, opacity .4s;

    -moz-transition: transform .6s, opacity .4s;

    -o-transition: transform .6s, opacity .4s;

    -ms-transition: transform .6s, opacity .4s;

    transition: transform .6s, opacity .4s;

    opacity: 0;

}



.xunpan:hover .tips {

    -webkit-transform: translateX(-20%) scale(1);

    -moz-transform: translateX(-20%) scale(1);

    -o-transform: translateX(-20%) scale(1);

    -ms-transform: translateX(-20%) scale(1);

    transform: translateX(-20%) scale(1);

    opacity: 1;

}





.pcs-ul {

    display: flex;

    margin-top: 50px;

}



.pcs-ul li {

    position: relative;

    width: 160px;

    text-align: center;

    cursor: pointer;

}



.pcs-ul li:nth-child(odd):after {

    content: "";

    position: absolute;

    z-index: 7;

    top: 12.2px;

    left: 49.8%;

    display: inline-block;

    width: 106px;

    height: 106px;

    background-color: #162544;

    border-radius: 14px 0 14px 0;

    border: solid 5px #162544;

    transform: translateX(-50%) rotate(45deg);

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

}



.pcs-ul li:nth-child(even) {

    margin-top: -6px;

}



.pcs-ul li:nth-child(even):after {

    content: "";

    position: absolute;

    z-index: 7;

    top: 21px;

    left: 50%;

    display: inline-block;

    width: 106px;

    height: 106px;

    background-color: #162544;

    border-radius: 14px 0 14px 0;

    border: solid 5px #162544;

    transform: translateX(-50%) rotate(45deg);

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

}





.pcs-ul li .icon {

    display: block;

    position: relative;

    width: 160px;

    height: 149px;

}



.pcs-ul li .icon::before {

    content: "";

    width: 40px;

    height: 40px;

    display: inline-block;

    position: absolute;

    left: 50%;

    top: 50%;

    transform: translate(-50%, -50%);

    background: url(../images/r1.png) no-repeat center;

    background-size: contain;

    z-index: 9;

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

}



.pcs-ul li:nth-child(2) .icon::before {

    background: url(../images/r2.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(3) .icon::before {

    background: url(../images/r3.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(4) .icon::before {

    background: url(../images/r4.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(5) .icon::before {

    background: url(../images/r5.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(6) .icon::before {

    background: url(../images/r6.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(7) .icon::before {

    background: url(../images/r7.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(8) .icon::before {

    background: url(../images/r8.png) no-repeat center;

    background-size: contain;

}





.pcs-ul li .icon::after {

    content: "";

    position: absolute;

    width: 112px;

    height: 112px;

    background-color: #f2f2f2;

    border-radius: 14px 0px 14px 0px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%) rotate(45deg);

    z-index: 8;

    transition: all .6s ease-in-out;

-webkit-transition: all .6s ease-in-out;

}



.pcs-ul li p {

    font-size: 18px;

    color: #333333;

    margin-top: 35px;

}



.pcs-ul li.active::after {

    border: solid 5px #bb9f6f;

    background-color: #bb9f6f;

}



.pcs-ul li.active .icon:after {

    background-color: #162544;

}









.pcs-ul li:nth-child(2).active .icon::before {

    background: url(../images/r22.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(3).active .icon::before {

    background: url(../images/r32.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(4).active .icon::before {

    background: url(../images/r42.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(5).active .icon::before {

    background: url(../images/r52.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(6).active .icon::before {

    background: url(../images/r62.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(7).active .icon::before {

    background: url(../images/r72.png) no-repeat center;

    background-size: contain;

}



.pcs-ul li:nth-child(8).active .icon::before {

    background: url(../images/r82.png) no-repeat center;

    background-size: contain;

}





/* about-box */

.about-box {

    padding: 76px 0 154px;

    overflow: hidden;

    background: url(../images/ab-bg.jpg) no-repeat center;

    background-size: cover;

}



.ab-con {

    position: relative;

}



.ab-con .tit-box {

    display: flex;

    align-items: center;

}



.ab-con .tit-box span {

    margin-left: 20px;

}



.ab-con>.tit {

    font-size: 30px;

    font-weight: bold;

    color: #162544;

    margin: 70px 0 30px;

}





.ab-con .desc {

    width: 796px;

    font-size: 16px;

    line-height: 40px;

    color: #8c8c8c;

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-line-clamp: 4;

    -webkit-box-orient: vertical;

}



.ab-con .more {

    position: relative;

    display: block;

    width: 120px;

    height: 50px;

    line-height: 50px;

    text-align: center;

    background-color: #162544;

    font-size: 16px;

    letter-spacing: 1px;

    color: #ffffff;

    margin-top: 65px;

}



.ab-con .more:hover {

    margin-left: 10px;

}



.ab-con .more::before {

    content: "";

    position: absolute;

    bottom: 0;

    right: -180px;

    display: inline-block;

    width: 180px;

    height: 1px;

    background-color: #162544;

    opacity: 0.2;

}





.ab-con .more::after {

    content: "SINCE";

    position: absolute;

    bottom: -3px;

    right: -180px;

    font-size: 16px;

    letter-spacing: 1px;

    color: #162544;

}



.ab-con .yyzz {

    position: absolute;

    left: 668px;

    top: -24px;

    width: 104px;

    height: 150px;

    object-fit: cover;

    padding: 11px 13px;

    background: url(../images/yyzz.jpg) no-repeat center;

    background-size: cover;

}



.ab-con .year {

    position: absolute;

    z-index: 9;

    bottom: -120px;

    left: 338px;

    font-family: Arial;

    font-size: 180px;

    letter-spacing: 36px;

    color: rgba(187, 159, 111, 0.15);

    font-weight: bold;

}



/* factory */

.factory {

    padding: 80px 0;

    overflow: hidden;

}



.fac-tit .tit-box {

    display: flex;

    margin-bottom: 40px;

    align-items: center;

}



.fac-tit .tit-box span {

    margin-left: 20px;

}



.fac-prev,

.fac-next {

    font-family: Arial;

    font-size: 12px;

    font-weight: bold;

    color: #162544;

    cursor: pointer;

}



.fac-prev img {

    margin-right: 16px;

}



.fac-next img {

    margin-left: 16px;

}



.fac-con .control>img {

    margin: 0 50px;

}





/* news-box */

.news-box {

    overflow: hidden;

    padding: 0 0 80px;

}



.slide-news {

    position: relative;

    display: flex;

    justify-content: space-between;

}



.slide-news .tit-box {

    display: flex;

    justify-content: flex-end;

    text-align: right;

}





.slide-news .tit-box span {

    margin-right: 20px;

}



.slide-news .tit-box::after {

    left: auto;

    right: -320px;

}



.slide-news .hd {

    position: absolute;

    right: 0;

    top: 0;

}



.slide-news .hd ul {

    margin-top: 50px;

    box-shadow: 0 0 25px rgba(0, 0, 0, 0.05);

}



.slide-news .hd li a {

    width: 236px;

    height: 137px;

    text-align: center;

    line-height: 137px;

    display: block;

    box-sizing: border-box;

    background-color: #ffffff;

    border-top: 1px solid #d0d3da;

    font-size: 16px;

    color: #333333;

}



.slide-news .hd li .icon {

    position: relative;

    display: inline-block;

    width: 30px;

    height: 30px;

    transform: translateY(8px);

    margin-right: 22px;

}



.slide-news .hd li .icon::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 30px;

    height: 30px;

    background: url(../images/ni1.png) no-repeat center;

    transition: all .6s ease-in-out;

    -webkit-transition: all .6s ease-in-out;

}



.slide-news .hd li:nth-child(2) .icon::before {

    background: url(../images/ni2.png) no-repeat center;

}



.slide-news .hd li:nth-child(3) .icon::before {

    background: url(../images/ni3.png) no-repeat center;

}



.slide-news .hd li.on a {

    background-color: #162544;

    border-top: 1px solid #162544;

    color: #ffffff;

}



.slide-news .hd li:nth-child(1).on .icon::before {

    background: url(../images/ni12.png) no-repeat center;

}



.slide-news .hd li:nth-child(2).on .icon::before {

    background: url(../images/ni22.png) no-repeat center;

}



.slide-news .hd li:nth-child(3).on .icon::before {

    background: url(../images/ni32.png) no-repeat center;

}



.news-bd {

    margin-top: 38px;

    width: 100%;

}



.news-bd .bd>div {

    width: 100%;

}



.news-bd .top li {

    width: 996px;

}



.news-bd .top li a {

    display: block;

    width: 996px;

    height: 206px;

    box-sizing: border-box;

}





.news-bd .top li:nth-child(1) {

    padding-bottom: 40px;

    margin-bottom: 40px;

    border-bottom: 1px solid #e6e6e6;

}



.news-bd .dowp li:nth-child(2),

.news-bd .dowp li:nth-child(5),

.news-bd .dowp li:nth-child(8) {

    padding: 0 30px;

}



.news-bd .top li a>img {

    vertical-align: top;

    width: 293px;

    height: 206px;

    object-fit: cover;

}



.news-bd .top li a span {

    display: inline-block;

    width: 657px;

    margin-left: 40px;

    box-sizing: border-box;

}



.news-bd .top li a .tit {

    font-size: 18px;

    width: 80%;

    display: block;

    font-weight: bold;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    color: #333333;

    margin: 37px 0 10px;

}



.news-bd .top li a .date {

    display: block;

    font-family: Arial;

    font-size: 12px;

    color: #bfbfbf;

}



.news-bd .top li a .desc {

    display: block;

    font-size: 15px;

    width: 100%;

    color: #8c8c8c;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    margin: 18px 0 30px;

}



.news-bd .top li a .more {

    width: 60px;

    height: 30px;

    text-align: center;

    line-height: 30px;

    display: block;

    background-color: #162544;

    border-radius: 0px 15px 15px 0px;

    transition: all .5s;

    -webkit-transition: all .5s;

}



.news-bd .top li:hover a .more {

    background-color: #bb9f6f;

}



.news-bd .dowp {

    margin-top: 48px;

    display: flex;

    flex-wrap: wrap;

    width: 1300px;

    padding: 20px 30px;

    box-sizing: border-box;

    background-color: #ffffff;

    border: 1px solid #ededed;

}





.news-bd .dowp li {

    width: 33.33%;

    box-sizing: border-box;

    padding-bottom: 10px;

    border-bottom: 1px solid #ededed;

}



.news-bd .dowp li:nth-last-child(1),

.news-bd .dowp li:nth-last-child(2),

.news-bd .dowp li:nth-last-child(3) {

    padding-bottom: 0;

    border-bottom: 0px solid #ededed;

}



.news-bd .dowp li:nth-child(-n+3){

    padding-bottom: 10px;

    border-bottom: 1px solid #ededed;

}



.news-bd .dowp li:nth-child(n+4) {

    margin-top: 15px;

}



.news-bd .dowp li .tit {

    font-size: 15px;

    display: inline-block;

    width: 70%;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    color: #333333;

}



.news-bd .dowp li .tit::before {

    content: '·';

    font-size: 20px;

    color: #162544;

    margin-right: 10px;

    font-weight: bold;

}



.news-bd .dowp li .date {

    font-family: Arial;

    font-size: 12px;

    float: right;

    margin: 10px 10px 0 0;

    color: #bfbfbf;

}