/*公共样式*/
.wid{
    width:1200px;
    margin: 0 auto;
    height: inherit;
}
.icon{
    display: inline-block;
    background-image: url(../../images/metal/icon.png);
    background-repeat: no-repeat;
}
.title{
    font-size: 44px;
    font-weight: normal;
    color: #333333;
    text-align: center;
    position:relative;
}
.title:after{
    content: '';
    position:absolute;
    width: 70px;
    height: 3px;
    background-color: #ffffff;
    left: 50%;
    margin-left: -35px;
    bottom: -20px;
}
.titText{
    font-size: 18px;
    color: #333333;
    text-align: center;
    padding-top: 55px;
}

/*.banner*/
.banner{
    height: 618px;
    background-image: url(../../images/metal/banner.png);
    background-repeat: no-repeat;
    background-position: center top;
}
.banner ul{
    display: flex;
    justify-content: space-between;
    width:790px;
    margin: 0 auto;
    padding-top: 300px;
}
.banner li{
    font-size: 18px;
    line-height: 24px;
    color: #ffffff;
}
.banner li span{
    width: 20px;
    height: 24px;
    background-position: -39px -70px;
    vertical-align: sub;
    padding-right: 7px;
}
.btn{
    text-align: center;
    padding-top: 35px;

}
.btn a{
    font-size: 16px;
    color: #1c1e24;
    width: 132px;
    height: 42px;
    background-image: linear-gradient(90deg,
    #e5c886 0%,
    #c5a05a 100%),
    linear-gradient(
            #ffdea1,
            #ffdea1);
    background-blend-mode: normal,
    normal;
    border-radius: 4px 4px 4px 36px;
    text-align: center;
    line-height: 42px;
    display:inline-block;
    text-decoration: none;
}
.product{
    margin-top: -175px;
}
.product .wid{
    height: 366px;
    background-image: linear-gradient(90deg,
    #e8d3a8 0%,
    #f3ecd7 23%,
    #f4eac7 50%,
    #f5e8ba 69%,
    #e8d3a8 100%),
    linear-gradient(90deg,
            #e6c787 0%,
            #c4a46f 69%,
            #e8d3a8 100%),
    linear-gradient(
            #ffffff,
            #ffffff);
    background-blend-mode: normal,
    normal,
    normal;
    box-shadow: 0px -4px 9px 0px
    rgba(0, 0, 0, 0.1);
    border-radius: 50px 50px 4px 4px;
}
.product .title{
    padding-top: 50px;
    margin-bottom: 55px;
}
.product .title:after{
    background-color: #59584b;
}
.product p{
    font-size: 18px;
    line-height: 34px;
    color: #11151b;
    text-indent: 36px;
    padding:0 27px;
}

.pattern{
    height: 1650px;
    background-image: url(../../images/metal/proBg.png);
    background-repeat: no-repeat;
    background-position: center;
    margin-top: -310px;
}
.pattern .wid{
    padding-top: 420px;
}
.pattern .title{

}
.pattern .title:after{
    background: #c9a560;
}
.pattern ul{
    width:780px;
    margin: 0 auto;
    display:flex;
    justify-content: space-between;
    margin-top: 40px;
}
.pattern li{
    width: 386px;
    height: 510px;
}
.pattern li:first-child{
    background-image: url(../../images/metal/yewu01.png);
    background-repeat: no-repeat;
}
.pattern li:last-child{
    background-image: url(../../images/metal/yewu02.png);
    background-repeat: no-repeat;
}
.pattern .patTitle{
    font-size: 48px;
    line-height: 24px;
    color: #ffffff;
    padding:80px 0 0 50px;
}
.pattern li p{
    font-size: 16px;
    line-height: 30px;
    color: #ffffff;
    padding:95px 68px 0;
}
.pattern li .zixun{
    text-align: center;
    position:relative;
}
.pattern li:first-child .zixun a{
    display:inline-block;
    width: 152px;
    height: 76px;
    background-color: #0091ff;
    box-shadow: 1px 1px 32px 0px
    rgba(55, 79, 159, 0.69);
    border-radius: 4px;
    font-size: 24px;
    line-height: 76px;
    color: #ffffff;
    text-align: center;
    position:relative;
    margin: 110px auto 0;
    text-decoration: none;
}
.pattern li .zixun:after{
    content: '';
    display:inline-block;
    position:absolute;
    right: 142px;
    bottom: 24px;
    width:20px;
    height: 26px;
    background-image: url(../../images/metal/icon.png);
    background-position: -65px -70px;
}
.pattern li:last-child .zixun a{
    display:inline-block;
    width: 152px;
    height: 76px;
    background-color: #ff13ae;
    box-shadow: 1px 1px 32px 0px
    rgba(55, 79, 159, 0.69);
    border-radius: 4px;
    font-size: 24px;
    color: #ffffff;
    text-align: center;
    line-height: 76px;
    position:relative;
    margin: 110px auto 0;
    text-decoration: none;
}

.user{
    height: 670px;
    background-image: url(../../images/metal/tongdainBg.png);
    background-repeat: no-repeat;
    background-position: center;
    margin-top: -460px
}
.user .title{
    padding-top: 75px;
    color: #fff;
}
.nr{
    height: 700px;
    background-image: url(../../images/metal/tongdian.png);
    background-repeat: no-repeat;
    background-position: center;
    margin-top:-440px;
}
.nr .wid{
    display:flex;
    justify-content: center
}
.nr .left{
    padding-top: 40px;
}
.nr .left li{
    width:543px;
    height: 147px;
    background-image: url(../../images/metal/td01.png);
    background-repeat: no-repeat;
    position:relative;
    margin-top: 27px;
}
.pain:before{
    content: '';
    display:inline-block;
    position:absolute;
    width: 23px;
    height: 32px;
    background-image: url(../../images/metal/icon.png);
    background-position: -244px -34px;
    left: 80px;
    top: -24px;
}
.solve:before{
    content: '';
    display:inline-block;
    position:absolute;
    width: 39px;
    height: 70px;
    background-image: url(../../images/metal/icon.png);
    background-position: 0 0;
    right: 80px;
    top: -47px;
}
.nr .left li .leftTit{
    font-size: 18px;
    line-height: 24px;
    color: #ffffff;
    padding:10px 0 45px 50px;
}
.nr .left li p{
    font-size: 18px;
    line-height: 24px;
    color: #ffffff;
    padding-left: 25px;
}
.nr .right{
    margin-top: 64px;
    margin-left: -30px;

}
.nr .right li{
    width:543px;
    height: 147px;
    background-image: url(../../images/metal/td02.png);
    background-repeat: no-repeat;
    position:relative;
    margin-top: 27px;
}
.nr .right li .rightTit{
    font-size: 18px;
    line-height: 24px;
    color: #ffffff;
    padding:10px 45px 36px 0 ;
    text-align: right;
}
.nr .right li p{
    font-size: 18px;
    line-height: 24px;
    color: #ffffff;
    padding-left: 25px;
}
.system{
    height: 1021px;
    background-image: url(../../images/metal/jiegou.png);
    background-repeat: no-repeat;
    background-position: center;
    margin-top:-110px;
    position:relative;
    z-index: 9;
}
.flow{
    height: 2084px;
    background-image: url(../../images/metal/liucheng.png);
    background-repeat: no-repeat;
    background-position: center;
    margin-top: -200px;
}

.trait{
    height: 900px;
    margin-top: -190px;
    background-image: url(../../images/metal/tedianBg.png);
    background-repeat: no-repeat;
    background-position: right;
}
.trait .wid{
    height: 1080px;
    background-image: url(../../images/metal/trait.png);
    background-repeat: no-repeat;
    background-position:center;
}
.trait .title{

}
.trait .title:after{
    background: #c9a560;
}
.minTitle{
    font-size: 28px;
    color: #4a2e30;
    text-align: center;
    position:relative;
    z-index: 9;
    font-weight: bold;
    padding-top: 78px;
}
.minTitle:after{
    content: '';
    display:inline-block;
    position:absolute;
    width: 158px;
    height: 18px;
    background-color: #e3d7ba;
    left: 50%;
    margin-left: -78px;
    bottom: -5px;
    z-index: -1;
}
.trait .titText{
    padding-top: 40px;
}
.trait .box{
    height: 580px;
    position:relative;
    padding-top: 80px;
}
.trait .box .boxTitle{
    font-size: 24px;
    line-height: 10px;
    color: #333333;
    position:relative;
}
.trait .box .boxTitle:after{
    position:absolute;
    content: '';
    display:inline-block;
    width: 32px;
    height: 3px;
    background-color: #c9a560;
    top: -27px;
    left: 0;
}
.trait .box p{
    font-size: 18px;
    line-height: 24px;
    color: #333333;
    padding-top: 28px;
}

.trait .box .leftT{
    position:absolute;
    width: 180px;
    top: 125px;
}

.trait .box .leftB{
    position:absolute;
    width: 180px;
    bottom: 110px;
}
.trait .box .rightT{
    position:absolute;
    width: 180px;
    top: 125px;
    right: 10px;
}

.trait .box .rightB{
    position:absolute;
    width: 180px;
    bottom: 110px;
    right: 10px;
}

.earnings{
    height: 745px;
    background-image: url(../../images/metal/shouyiBg.png);
    background-repeat: no-repeat;
    background-position: center;
}
.earnings .minTitle{
    color: #fff;
    padding-top: 80px;
}
.earnings .minTitle:after{
    background: #fff;
    opacity: 0.1;
}
.earnings .titText{
    color: #fff;
    padding-top: 46px;
}

.surface{
    height: 788px;
    background-image: url(../../images/metal/tubiaoBg.png);
    background-repeat: no-repeat;
    background-position: bottom;
}
.surface .cont{
    display:flex;
}
.surface .minTitle{
    padding-top: 80px;
}
.surface .minTitle:after{
    background: #e3d7ba;
}
.surface ul{
    width:600px;
    padding-top: 60px;
}
.surface li{
    width:603px;
    height:128px;
    position:relative;
    align-items: center;
    margin-top: 20px;
}
.surface .contTitle{
    font-size: 20px;
    color: #af8b5b;
    padding:22px 0 0 22px;
}
.surface li .tp{
    width: 116px;
    height: 130px;
    background-image: linear-gradient(-45deg,
    #b08d53 0%,
    #cbb280 58%,
    #e6d6ad 100%),
    linear-gradient(
            #af70eb,
            #af70eb);
    background-blend-mode: normal,
    normal;
    text-align: center;
    box-shadow: 0 3px 20px #eee5dd;
    border-radius: 8px;
    position:absolute;
    left:0;
    top:-6px;
}
.surface  li .text{
    /*width:480px;*/
    /*height: 102px;*/
    width:603px;
    height:128px;
    float:right;
    padding-left:110px;
    box-sizing: border-box;
}
.surface  li:nth-of-type(1) .text{
    background:url("../../images/metal/jishu_1.png") no-repeat;
}
.surface  li:nth-of-type(2) .text{
    background:url("../../images/metal/jishu_2.png") no-repeat;
}
.surface  li:nth-of-type(3) .text{
    background:url("../../images/metal/jishu_3.png") no-repeat;
}
.surface .text p{
    font-size: 16px;
    line-height: 24px;
    color: #333333;
    padding-left: 20px;
    padding-top: 8px;
}
.shuju{
    width: 56px;
    height: 49px;
    background-position: -40px 0;
    margin-top: 40px;
}
.zhenlie{
    width: 54px;
    height: 50px;
    background-position: -97px 0;
    margin-top: 40px;
}
.fenbu{
    width: 64px;
    height: 47px;
    background-position: -161px -1px;
    margin-top: 40px;
}

.bring{
    height: 880px;
    background-image: url(../../images/metal/bring.png);
    background-repeat: no-repeat;
    background-position: center;
}

.terminal{
    height: 400px;
    background-image: url(../../images/metal/zhongdyanBg.png);
    background-repeat: no-repeat;
    background-position: center;
}
.terminal .middleTitle{
    font-size: 36px;
    color: #ffffff;
    text-align: center;
    padding-top: 53px;
}
.terminal p{
    padding-top: 38px;
    font-size: 18px;
    color: #ffffff;
    opacity: 0.9;
    text-align: center;
}


.serve{
    height: 800px;
}
.serve .title{
    padding-top: 62px;
    margin-bottom: 50px;
}
.serve .title:after{
    background: #c9a560;
}
.serve ul{
    display:flex;
    flex-wrap: wrap;
    justify-content: center;
}
.serve li{
    width:374px;
    height: 230px;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 39px;
    margin-top: 44px;
}
.serve li:nth-child(1){
    background-image: url(../../images/metal/serve01.png);
}
.serve li:nth-child(2){
    background-image: url(../../images/metal/serve02.png);
}
.serve li:nth-child(3){
    background-image: url(../../images/metal/serve03.png);
    margin-right: 0;
}
.serve li:nth-child(4){
    background-image: url(../../images/metal/serve04.png);
}
.serve li:nth-child(5){
    background-image: url(../../images/metal/serve05.png);
    margin-right:0;
}

.serve li .serveTitle{
    font-size: 20px;
    color: #ffffff;
    padding: 20px 0 0 20px;
}
.serve li p{
    font-size: 16px;
    color: #ffffff;
    padding:42px 20px;
    line-height: 26px;
}

/*matter12*/
.matter12{
    height: 640px;
    background-image: linear-gradient(143deg,
    #853bf4 0%,
    #628af9 100%),
    linear-gradient(
            #f5ca59,
            #f5ca59);
    background-blend-mode: normal,
    normal;
    margin-top: 50;
}
.matter12 .title{
    padding-top:78px;
    color: #fff;
    margin-bottom: 72px;
}
.client table p{
    line-height: 26px;
    color: #333;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
}
.matter12 .txt{
    padding-top: 80px;
}
.matter12 .client{
    width: auto;
}
.client table tr td{
    padding: 40px;
    width: 320px;
    height: 168px;
    background-color: #fff;
    text-align:center;
    box-shadow: 2px 4px 16px 0px
    rgba(207, 205, 205, 0.56);
    border-radius: 8px;
}
.matter12 .client table tr td{
    border-radius: 0;
}
.matter12 table{
    border-spacing:20px 20px;
}
.matter12 .client table h2{
    padding-bottom: 15px;
    font-weight: normal;
    font-size: 16px;
}
.matter12 .f1,
.matter12 .f2,
.matter12 .f3,
.matter12 .f4,
.matter12 .f5{
    width: 52px;
    height: 68px;
    margin: 0 auto 40px;
}
.matter12 .f1{
    background-position:0 -96px;
}
.matter12 .f2{
    background-position: -54px -96px;
}
.matter12 .f3{
    background-position: -108px -96px;
}
.matter12 .f4{
    background-position: -162px -96px;
}
.matter12 .f5{
    background-position: -215px -96px;
}