
@font-face{
    font-family: 'p';
    src : url('../font/Poppins-Regular.ttf');
}
@font-face{
    font-family: 'pb';
    src : url('../font/Poppins-Bold.ttf');
}
*{
    margin: 0;
    padding: 0;
    font-family:p;
}
li{
    list-style: none;
}
a{
    text-decoration: none;
    cursor: pointer;
}
body{
    max-width: 19.2rem;
    margin: 0 auto;
}
.banners{
    width: 100%;
    max-width: 19.2rem;
    height: 8.5rem;
    background: url(../img/banner.jpg) no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
    box-sizing: content-box;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}


.bannerscenter{
    width: 14rem;
    height: 8.5rem;
    margin: 0 auto;
    position: absolute;
    left: 2.6rem;
    top:0rem
}
.banner1{
    width: 14rem;
    height: 5.6rem;
    position: absolute;
    bottom: 0rem;
    left: 0rem;
}
.banner2{
    width: 14rem;
    height: 5.6rem;
    position: absolute;
    bottom: 0rem;
    left: 0rem;
}
.bannersbtop{
   width: 17.56rem;
   height: 5.64rem;
   margin-top: 0.77rem;
   margin-left: 0.82rem;
   overflow: hidden;
   opacity: 1;
   
}
.company{
    width: 100%;
    height: auto;
    margin: 0 auto;
    overflow: hidden;
    padding-bottom: 0.8rem;
}
.companycenter{
    width: 14rem;
    height: auto;
    margin: 0 auto;
}
.companycenter h2{
    width: 14rem;
    height: auto;
    margin: 0 auto;
    font-size: 0.42rem;
    color: #000;
    font-weight: 600;
    font-family: pb;
    text-align: center;
    line-height: 0.42rem;
    padding-top: 1.13rem;
    padding-bottom: 0.12rem;
}
.companytitle{
    width: 10rem;
    height: auto;
    font-size: 0.22rem;
    font-family: 'p';
    line-height: 0.26rem;
    color: #666;
    text-align: center;
    margin: 0 auto;
    font-weight: 400;
    padding-bottom: 0.64rem;
}
.companycenter ul{
    width: 14rem;
    height: 5.69rem;
    display: flex;
    justify-content: space-around;
    margin: 0 auto;
    flex-wrap: wrap;
}
.companycenter ul li{
    width: 3.34rem;
    height: 2.74rem;
    background: #f5f8fb;
}

.fycy{width:100%; margin:0 auto; overflow:hidden; box-sizing:border-box; padding:100px 0 80px; background:#1b528e url(../images/bg_2.jpg) no-repeat center fixed; 
    background-size:cover;}
    .fycy .fycyc{width:100%; margin:54px auto 0;box-sizing:border-box; overflow:hidden;}
    .fycy .fycyc::after{content:""; display:block; clear:both;}
    .fycyc li{ width:280px; height:235px; display:block; float:left; position:relative;  }
    .fycyc li:nth-child(4n){ margin-right:0;}
    
    .fycyc li a{ display:block; width:100%; height:100%;box-sizing:border-box; padding:30px 34px;}
    .fycyc li a .tubz{ width:1.1rem; height:0.72rem; display:block; margin:0 auto;transition:0.3s;}
    .fycyc li a .tubz img{  width:100%; margin:0 auto; overflow:hidden; transition:0.3s;margin-top: 0.35rem !important;}
    .fycyc li a h3{font-weight:400; font-size:0.22rem; color:#000; line-height:1.5em; margin:0.7rem auto 16px !important; text-align:center;transition:0.3s;}
    .fycyc li a p{font-size:14px; color:#fff; line-height:1.5em; display:block; width:100%;transition:0.3s;
    display:inline-block;word-break: break-all; text-align:center;
    text-overflow: ellipsis;
    display: -webkit-box; /** å°†å¯¹è±¡ä½œä¸ºä¼¸ç¼©ç›’å­æ¨¡åž‹æ˜¾ç¤º **/
    -webkit-box-orient: vertical; /** è®¾ç½®æˆ–æ£€ç´¢ä¼¸ç¼©ç›’å¯¹è±¡çš„å­å…ƒç´ çš„æŽ’åˆ—æ–¹å¼ **/
    -webkit-line-clamp:2; /** æ˜¾ç¤ºçš„è¡Œæ•° **/
    overflow: hidden;  /** éšè—è¶…å‡ºçš„å†…å®¹ **/}
    .fycyc li i{ display:block; position:absolute; background:#fff; transition:0.3s; opacity:0}
    
    .fycyc li:hover i{ opacity:1;background: #1d6ec9;}
    .fycyc li .i1{ width:100%; height:1px; top:0; left:-100%;}
    .fycyc li .i2{ width:1px; height:100%; top:-100%; left:0;}
    .fycyc li .i3{ width:100%; height:1px; bottom:0; left:100%;}
    .fycyc li .i4{ width:1px; height:100%; top:100%; right:0;}
    
    .fycyc li:hover .i1{ left:0}
    .fycyc li:hover .i2{ top:0}
    .fycyc li:hover .i3{ left:0}
    .fycyc li:hover .i4{ top:0}
    
    .fycyc li:hover a .tubz{transform:rotateY(180deg); -webkit-transform:rotateY(180deg); -ms-transform:rotateY(180deg); -o-transform:rotateY(180deg);}
    .fycyc li:hover a h3{margin:16px auto 10px; font-weight:900;}
    .fycyc li:hover{ background:#1d6ec9;}
    .img2{
        display: none;
    }
    .blue  a h3{
        color: #fff !important;
    }
    .blue .img2{
        display:inline !important;
        margin-top: 0.35rem !important;
    }
    .blue .img1{
        display: none !important;
        margin-top: 0.35rem !important;
    }
    /*å·¥ç¨‹ä¸šç»©*/

    .Strengths{
        width: 100%;
        height: 7.64rem;
        margin: 0 auto;
        background: url(../img/764.jpg) no-repeat;
        background-size: 100% 100%;
    }
    .Strengthscenter{
        width: 14rem;
        height: 7.64rem;
        margin: 0 auto;
    }
    .Strengthscenter h2{
        width: 14rem;
        height: 1.88rem;
        color: #fff;
        line-height: 1.88rem;
        font-size: 0.42rem;
        font-weight: 600;
        text-align: center;
        font-family: pb;
    }
    .Strengthscenter ul{
        width: 14rem;
        height: 4.75rem;
        display: flex;
        justify-content: space-between;
        margin: 0 auto;
    }
    .Strengthscenter ul li{
        width: 4.47rem;
        height: 4.75rem;
        background: #fff;

    }
    .Strengthscenter ul li img{
        width: 4.47rem;
        height: 2.2rem;
        display: block;
        margin: 0 auto;
    }
    
    .strengthstitle{
        width: 4.07rem;
        box-shadow: 0px 4px 6px #f1f1f1;
        height: 1.75rem;
        font-size: 0.2rem;
        padding-left: 0.2rem;
        padding-right: 0.2rem;
        line-height: 0.3rem;
        color: #333;
        font-family: p;
        text-align: center;
        margin: 0 auto;
        padding-top:0.8rem;
    }
    .change{
        background: #1d6ec9 !important;
        transition: 0.4s;
        cursor: pointer;
    }
    .change .strengthstitle{
        color: #fff !important;
        transition: 0.4s;
    }
    .sellnew{
        width: 100%;
        height: 8.67rem;
        margin: 0 auto;
        background: url(../img/867.jpg) no-repeat;
        background-size: 100% 100%;
    }
    .sellnewcenter{
        width: 14rem;
        height: 8.67rem;
        margin: 0 auto;
      
    }
    .sellnewc{
        max-width: 19.2rem;
    
        width: 100%;
        height: 8.67rem;
        margin: 0 auto;
    
        overflow: hidden;
    }
    .sellnewcenter h2{
        width: 14rem;
        height: auto;
        margin: 0 auto;
        color: #fff;
        font-weight: 600;
        font-size: 0.42rem;
        font-family: pb;
        text-align: center;
        line-height: 0.42rem;
        padding-top: 1.85rem;
        padding-bottom: 0.3rem;
    }
    .sellbox{
        width: 10rem;
        height: auto;
        font-size: 0.2rem;
        line-height: 0.3rem;
        text-align: center;
        color: #fff;
        opacity: 0.8;
        margin:  0 auto;
    }
    .suchslist{
        width: 9.7rem;
        height: 1.18rem;
        margin: 0 auto;
        display: flex;
        margin-top: 0.85rem;
        justify-content: space-between;
        margin-bottom: 0.5rem;
    }
    .suchsimg{
        width: 2rem;
        height: 1.18rem;
    }
    .suchsimg img{
        width: 0.61rem;
        height: 0.61rem;
        display: table;
        padding-top: 0.12rem;
        margin: 0 auto;
    }
    .suchsimg p{
        width: auto;
        height: auto;
        font-size: 0.2rem;
        line-height: 0.3rem;
        color: #fff;
        font-weight: 400;
        font-family: p;
        text-align: center;
    }
    .suchtitle{
        font-weight: 600;
        font-family: pb;
        font-size: 0.48rem;
        color: #fff;
        text-align: center;
    }
    .suchtitle span{
        font-weight: 400;
        font-size: 0.3rem;
        font-family: p;
    }
    .suchstiao {
        width: 1px;
        height: 1.18rem;
        background: #fff;
        opacity: 0.5;
    }
    .sellccc{
        width: 100%;
        height: 1.9rem;
        background: transparent;
        border-top: 1px solid rgba(255, 255, 255, 0.3);
        margin: 0 auto;
        background: rgba(0,0,0,0.3);
        position: absolute;
        bottom: 0rem;
        left: 0rem;
    }
    .sellcccenter{
        width: 14rem;
        height: 1.9rem;
        margin: 0 auto;
    }
    .sellcccenter h3{
        font-size: 0.3rem;
        line-height: 0.3rem;
        color: #fff;
        font-weight: 600;
        text-align: left;
        float: left;
        padding-top: 0.66rem;
    }
    .sellcm{
        width: auto;
        font-size: 0.24rem;
        line-height: 0.3rem;
        color: #fff;
        font-weight: 400;
        font-family: p;
        text-align: left;
        position: absolute;
        top: 1.07rem;
    }
    .sellbutton{
        width: 3rem;
        height: 0.61rem;
        background: #1d6ec9;
        border-radius: 0.61rem;
        line-height: 0.61rem !important;
        text-align: center;
        font-size: 0.24rem;
        font-weight: 600;
        font-family: pb;
        color: #fff;
        position: absolute;
        top: 0.7rem;
        right: 2.6rem;
    }
    .service{
        width: 100%;
        height: 8.02rem;
        background: url(../img/802.jpg) no-repeat;
        background-size: 100% 100%;
        margin: 0 auto;
    }
    .servicecenter{
        width: 14rem;
        height: 8.02rem;
        margin: 0 auto;
    }
    .servicecenter h2{
        width: 14rem;
        height: 2.05rem;
        font-size: 0.42rem;
        color: #000;
        font-weight: 600;
        font-family: pb;
        text-align: center;
        line-height: 2.05rem;
    }
    .bb{
        width: 100%;
        height: 9rem;
        margin: 0 auto;
        background: url(../img/771.jpg) no-repeat;
        background-size: 100% 100%;
        overflow: hidden;
    }
    .bbcenter{
        width: 14rem;
        height: 9rem;
        margin: 0 auto;
    }
    .biaodanright{
        width: 9.1rem;
        height: 4.85rem;
        float: right;
        background: #fff;
    }
    #form2{
       
        padding-top: 0.35rem;
        padding-bottom: 0.8rem;
        border-radius: 10px;
    }
    #form3{
       
        padding-top: 0.35rem;
        padding-bottom: 0.8rem;
        border-radius: 10px;
    }
    .bottomss{
           width: 100%;
    height: 0.85rem;
    line-height: 0.85rem;
    text-align: center;
    color: #fff;
    opacity: 0.8;
    font-size: 0.2rem;
    position: absolute;
    bottom: 0rem;
    
    }
    .five1{
    width: 8.5rem;
    height: 2rem;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-content: space-between;
    }
    .five2{
    width: 4.05rem;
    height: 0.6rem;
    }
    .five2 p{
    width: 100%;
    height: 0.3rem;
    font-size: 0.22rem;
    line-height: 0.3rem;
    color: #000;
    }
    ..five2 span{
    color: red;
    font-size: 0.2rem;
    }
    .five2 input{
       width: 3.73rem;
    height: 0.54rem;
    float: left;
    border: 1px solid #ccc;
    padding-left: 0.35rem;
    background: #fafafa;
    font-size: 0.2rem;
    }
    
    .five3{
    width: 12.75rem;
    margin: 0 auto;
        height: auto;
    margin-top: 0.1rem;
    }
    .five3 p{
    width: 12.5rem;
    margin: 0 auto;
    height: 0.3rem;
    font-size: 0.22rem;
    line-height: 0.3rem;
    color: #000;
    }
    .five3 span{
    color: red;
    font-size: 0.2rem;
    }
    .buttons1{
        width: 4rem;
        height: 0.65rem;
        line-height: 0.65rem;
        text-align: center;
        font-size: 0.3rem;
        color: #000;
        margin: 0 auto;
        font-weight: 600;
        display: table;
        border-radius: 5px;
        border: none;
      
        border-radius: 0.65rem;
        
    }
    .five3 textarea{
        width: 7.97rem;
        height: 1.16rem;
        background: #fafafa;
        float: left;
        resize: none;
        border: 1px solid #ccc;
        padding-top: 0.1rem;
        line-height: 0.3rem;
        color: #666;
        font-size: 0.2rem;
        padding-left: 0.35rem;
        margin-left: 0.4rem;
    }
    input::-webkit-input-placeholder{
    
    color: #666;
    font-size: 0.18rem;
    }
    
    input::-moz-placeholder{   /* Mozilla Firefox 19+ */
    
    color: #666;
    font-size: 0.18rem;
    }
    
    input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
    
    color: #666;
    font-size: 0.18rem;
    }
    
    input:-ms-input-placeholder{  /* Internet Explorer 10-11 */
    
    color: #666;
    font-size: 0.18rem;
    
    }
    textarea::-webkit-input-placeholder{
    
    color: #666;
    font-size: 0.18rem;
    }
     
    .five2{
        position: relative;
    }
    .five2 img{
        width: 0.22rem;
        height: 0.22rem;position: absolute;
        top: 0.16rem;
        left: 0.1rem;
    }
    .five3{
        position: relative;
    }
    .five3 img{
        width: 0.22rem;
        height: 0.22rem;position: absolute;
        top: 0.12rem;
        left: 0.5rem;
    }
    .bbcenter h2{
        width: 14rem;
        height: 1.95rem;
        line-height: 1.95rem;
        font-size: 0.42rem;
        color: #fff;
        font-weight: 600;
        text-align: center;
        font-family: pb;
    }
    
    .bottom{
    width: 100%;
    height: 6.1rem;
    margin: 0 auto;
    background: url(../img/610.jpg) no-repeat;
    background-size: 100% 100%;
    font-family: p;
}
.bottomcenter{
    width: 14.5rem;
    height: 6.1rem;
    margin: 0 auto;
    position: relative;
}
.bottomlist1{
    width: 3.9rem;
    height: 1.8rem;
    float: left;
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    margin-top: 1.8rem;
}
.bottomlist1 li{
    width: 3.9rem;
     font-family: p;
    height: auto;
    font-size: 0.18rem;
    line-height: 0.36rem;
    color: #fff;
}
.btlogo{
    width: 3.05rem;
    height: 0.4rem;
    display: flex;
    justify-content: space-between;
    margin-top: 0.3rem;
    position: absolute;
    left: 0rem;
    top: 3.5rem;
}
.btlogo li{
    width: 0.4rem;
    height: 0.4rem;
    
}
.btlogo li img{
    width: 0.4rem;
    height: 0.4rem;
}
.bottomxian{
    width: 1px;
    height: 4.38rem;
    background: #3a4241;
    position: absolute;
    left: 4.2rem;
    top: 0.46rem;
}
.bttit{
    font-size: 0.26rem;
    color: #fff;
    font-family: pb;
    position: absolute;
    top: 1rem;
    left: 5rem;
}
.titlebox{
    width: 9.4rem;
    height: 2.7rem;
    position: absolute;
    left: 5rem;
    top: 1.7rem;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content: space-between;
}
.titlebox .product{
    width: 3.1rem;
    font-size: 0.18rem;
     font-family: p;
    color: #fff;
    opacity: 0.7;
    line-height: 0.48rem;
    text-align: left;
    padding-bottom: 0rem;
}