.xj-cont{ background: url("images/xiangjiao-bg.jpg") repeat;}

.xj-intro{ position: relative; padding: 100px 110px 150px; background: #fff; border-radius: 30px; margin-top: -230px;
    -webkit-box-shadow: 1px 0 10px rgba(0,0,0,.1);
    -moz-box-shadow: 1px 0 10px rgba(0,0,0,.1);
    box-shadow: 1px 0 10px rgba(0,0,0,.1);}
.xj-intro .xj-bt{ font-size: 90px; margin-bottom: 1em; text-align: center;}
.xj-intro h2{ font-size: 1em; margin-bottom: 0.4em; }
.xj-intro h3{ font-size: 0.5em; }
.xj-intro .pic{ width: 45.3%;}
.xj-intro .txt{ width: 50%; margin-top: -8px;}
.xj-intro .btn-more{ margin-top: 1.8em;}

.xj-chanpin{ padding: 160px 0 90px;}
.xj-chanpin .fw-txt{ width: 33.33%; padding-right: 10px; margin-bottom: 160px;}
.xj-cp-pro{ position: relative;}
.xj-cp-pro .pro-hot{ position: absolute; width: 58%; top: -360px; right: 0; }
.pro-hot .txt{ position: absolute; right: 7.5%; bottom: 500px; width: 44%; padding: 45px 35px; background: #fff; border-radius: 30px;
    -webkit-box-shadow: 1px 0 10px rgba(0,0,0,.1);
    -moz-box-shadow: 1px 0 10px rgba(0,0,0,.1);
    box-shadow: 1px 0 10px rgba(0,0,0,.1);}
.xj-cp-pro ul{ margin: 0 -10px;}
.pro-hot .txt p{ text-align: left; }
.pro-hot .txt p + p{ margin-top: 10px;}
.xj-cp-pro li{ float: left; width: 33.33%; padding: 0 10px;}
.xj-cp-pro li:first-child{ margin-right: 50%;}
.xj-cp-pro img + p{ font-size: 12px; line-height: 1; padding: 10px 0 20px; text-align: center;}

.fw-banner{ background-image: url("images/xiangjiao-fuwu-bg1.jpg");}
.yj-kehu{ background-image: url("images/xiangjiao-kehu-bg1.jpg");}


@media (max-width: 1759px){
    .xj-intro{ padding: 90px 100px 130px}
    .xj-intro .xj-bt{ font-size: 84px;}
    .xj-intro .btn-more{ margin-top: 1.1em; font-size: 26px;}

    .xj-chanpin{ padding: 130px 0 80px;}
    .xj-cp-pro .pro-hot{ top: -317px;}
    .pro-hot .txt{ width: 50%; bottom: 410px;}
}
@media (max-width: 1559px){
    .xj-intro{ padding: 80px 80px 100px; margin-top: -210px;}
    .xj-intro .xj-bt{ font-size: 70px;}
    .xj-intro .txt p{ font-size: 15px;}
    .xj-intro .btn-more{ font-size: 20px;}

    .xj-chanpin{ padding: 110px 0 65px;}
    .xj-chanpin .fw-txt{ margin-bottom: 130px;}
    .xj-cp-pro .pro-hot{ top: -270px;}
    .pro-hot .txt{ width: 70%; padding: 35px 25px; bottom: 360px;}
}
@media (max-width: 1359px){
    .xj-intro{ padding: 60px 50px 60px; margin-top: -180px;}
    .xj-intro .xj-bt{ font-size: 56px;}
    .xj-intro .txt p{ font-size: 14px;}

    .xj-chanpin{ padding: 90px 0 60px;}
    .xj-chanpin .fw-txt{ margin-bottom: 100px;}
    .xj-chanpin .fw-txt h3{ font-size: 38px;}
    .xj-cp-pro .pro-hot{ top: -222px;}
    .pro-hot .txt{ width: 70%; padding: 30px 25px; bottom: 290px; border-radius: 15px; }
    .pro-hot .txt p{font-size: 14px; line-height: 1.8; }
    .pro-hot .txt p + p{ margin-top: 8px;}
    .xj-cp-pro ul{ margin: 0 -5px;}
    .xj-cp-pro li{ padding: 0 5px;}
    .xj-cp-pro img + p{ padding: 6px 0 10px;}

}
@media (max-width: 1024px){
    .xj-intro{ padding: 0.7rem 0.3rem; margin-top: -4rem; border-radius: 0.3rem;}
    .xj-intro .xj-bt{ font-size: 0.84rem; line-height: 1.2;}
    .xj-intro .pic{ width: 100%;}
    .xj-intro .pic img{ width: 100%;}
    .xj-intro .txt{ width: 100%; margin-top: 0.4rem;}
    .xj-intro .txt p{ font-size: 0.25rem;}
    .xj-intro .btn-more,
    .xj-chanpin .btn-more{ width: 100%; font-size: 0.32rem; margin-top: 1.5em;}

    .xj-chanpin{ position: relative; padding: 1.2rem 0 2.5rem; }
    .xj-chanpin .fw-txt{ width: 100%; margin-bottom: 0.4rem;}
    .xj-chanpin .fw-txt h3{ font-size: 0.68rem;}
    .xj-chanpin .fw-txt h3::before{ width: 7.3rem;}
    .xj-chanpin .fw-txt p{ font-size: 0.25rem;}
    .xj-cp-pro .pro-hot{ position: relative; top: auto; width: 100%;}
    .xj-cp-pro img + p,
    .pro-hot .txt p{ font-size: 0.25rem;}
    .pro-hot .pic{ padding-right: 1.4rem; position: relative;}
    .pro-hot .pic p{ position: absolute; top: 1rem; width: 1.4rem; right: 0; padding: 0;}
    .pro-hot .txt{position: relative; bottom: auto; right: auto; width: 90%; margin: -1.95rem 0 0 10%; padding: 0.49rem 0.78rem; border-radius: 0.3rem; }
    .pro-hot .txt p{ line-height: 2; }
    .xj-cp-pro ul{ margin: 0.6rem -0.15rem 0;}
    .xj-cp-pro li{ padding: 0 0.15rem;}
    .xj-cp-pro li p{ padding: 0.2rem 0 0.3rem;}
    .xj-cp-pro li:first-child{ margin-right: 0;}

    .fw-banner{ background-image: url("images/xiangjiao-fuwu-bg2.jpg");}


}
@media (max-width: 750px){
    .xj-intro{ margin-top: -3.5rem; padding: 0.7rem 0.4rem 1.2rem; border-radius: 0.4rem;}
    .xj-intro .xj-bt{ font-size: 0.78rem; }
    .xj-intro p{ font-size: 0.4rem!important;}
    .xj-intro .btn-more{ width: 86%; font-size: 0.48rem; margin: 1.5em auto 0;}

    .xj-chanpin .fw-txt p{ font-size: 0.39rem;}
    .pro-hot .txt p{ font-size: 0.4rem;}
    .xj-cp-pro li{ width: 50%;}
    .xj-cp-pro li p{ font-size: 0.32rem;}
}