body, html,
div,p,
dl, dt, dd,
ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre, code,
form, fieldset, legend, input, button, textarea,
blockquote,
th, td { margin: 0; padding: 0; }
video {  margin: 0;  padding: 0;  border: 0;  font: inherit; vertical-align: baseline; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }
a {color: inherit; text-decoration: none; cursor: pointer; -webkit-transition: color .1s linear;
    -moz-transition: color .1s linear;
    -ms-transition: color .1s linear;
    -o-transition: color .1s linear;
    transition: color .1s linear;}
a:hover { text-decoration: none; color: #fff;}
img { border: none; }
ol, ul, li { list-style: none; }
table { border-spacing: 0; border-collapse: collapse; }
* { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
body {font: normal 16px/1 Roboto,Arial,Simsun,sans-serif; color: #313131; max-width: 1920px; margin:0 auto; background: #fff; overflow-x: hidden; }
input,textarea{ border: none; font: inherit;}
input:focus,textarea:focus{ outline: none; font: inherit;}
.wrap{ margin: 0 auto;}
.img-responsive{ display: block; max-width: 100%; height: auto; }
.text-right{ text-align: right;}
.clearfix { zoom: 1; }
.clearfix::after {content: ""; height: 0; line-height: 0; display: block; visibility: hidden; clear: both;}
.text-overflow-1{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.text-overflow-2{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.visible-xs{ display: none;}
.fl{ float: left;}
.fr{ float: right;}


.header{ padding: 15px 0; line-height: 1;}
.header ul{ margin-top: 24px;}
.header li{ float: left; font-size: 16px; }
.header li:first-child{ padding-right: 15px; margin-right: 15px; border-right: 1px solid; }
.header .tel{ font-size: 0.4rem; font-weight: 700; color: #da251d; margin-top: 10px;}
.header a:hover{ color: inherit;}

.xk-more{display: block; font-size: 32px; width: 10em; line-height: 2.5em; text-align: center; font-weight: bold; color: #fff; background: #c8000a; border-radius: 0 0 0.84em;}
.xk-more svg{ fill: #fff; width: 1.4em; height: 1.4em; position: relative; top: 0.25em; }
.xk-more span{  font-size: 1.4em; margin-right: 0.3em;}
.visible-sm{ display: none!important;}
.wrap{ width: 1560px; margin: 0 auto;}
.tit{ position: relative; font-size: 50px; text-transform: uppercase; line-height: 1.2; padding-bottom: 20px;}
.tit::before{ content: ''; position: absolute; left: 0; bottom: 0; width: 130px; height: 10px; background: #b10201;}

.pro-xk-banner{ background: #f8f8f8 url("../images/pro-xkm1-bg.png") no-repeat center bottom/100% auto; border-radius: 0 0 300px 0;}
.pro-xk-banner .txt{ position: relative; padding-top: 130px;}
.pro-xk-banner .txt h2{ position: absolute; top: 60px; left: 0; text-transform: uppercase; }
.pro-xk-banner .txt img{ display: inline-block; width: 83.3%; }
.pro-xk-banner .xk-more{ position: absolute; bottom: 0; left: 0; }
.pro-xk-banner .pp{ position: relative; padding: 100px 16.7%; font-size: 30px; line-height: 1.5; text-align: center; }
.pro-xk-banner .pp img{ position: absolute;}
.pro-xk-banner .pp .icon1{ left: 23%; top: 0.9em; width: 1.533em; }
.pro-xk-banner .pp .icon2{ right: 3%; top: 27%; width: 3.67em; }
.pro-xk-banner .pp .icon3{ left: 5%; top: 46%; width: 2.87em; }

.pro-xk{ padding-top: 100px; font-size: 30px; line-height: 1.52;}
.pro-xk h3{ margin-bottom: 60px;}

.pro-xk-shiyong li{ float: left; width: 46.1%; margin-bottom: 3em;}
.pro-xk-shiyong li + li{ margin-left: 7.8%;}
.pro-xk-shiyong .pic img{ width: 100%;}
.pro-xk-shiyong .pp{ line-height: 1.4; margin-top: 2.4em;}
.pro-xk-shiyong .pp .bt{margin-bottom: 0.7em; padding-bottom: 0.7em; border-bottom: 2px solid #000;}
.pro-xk-shiyong .bt h4{ font-size: 40px;}
.pro-xk-shiyong .p{ position: relative; }
.pro-xk-shiyong .xk-more{ width: 83%; margin: 0 auto; background: #313131; font-size: 2em; font-weight: normal; line-height: 2.8;}

.pro-xk-beijian ul{ text-align: center; margin: 0 -0.33em;}
.pro-xk-beijian li{ float: left; width: 33.33%; padding: 0 0.33em; margin-bottom: 0.5em; }
.pro-xk-beijian .xk-more{ width: 100%; margin-top: 4em;}

.pro-xk-shili{ padding-bottom: 90px; }
.pro-xk-shili .p{ padding: 0 7%; text-align: center; margin-bottom: 2em;}
.pro-xk-shili .p p{ margin-bottom: 1.3em;}
.pro-xk-shili ul{ padding: 0 7%; }
.pro-xk-shili li{ position: relative; padding-right: 20%;  margin-bottom: 1.2em;}
.pro-xk-shili li p{ position: absolute; left: 81%; top: 0; line-height: 1.2; padding-top: 1.77em;}
.pro-xk-shili li p::before{ content: ''; position: absolute; left: 0; top: 0; width: 0; height: 0; border-width: 0.567em 1em 0.567em 0; border-style: solid; border-color: transparent #c8000a transparent transparent;}

.lianxi{ padding: 60px 0 40px; background: #f0f0f0;}
.lianxi .tit{ text-align: center; margin-bottom: 1em;}
.lianxi .tit::before{ left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);}
.lx-biaodan{ width: 63%; }
.form-item{ position: relative; margin-bottom: 20px;}
.lx-biaodan .input{ width: 100%; line-height: 40px; border: 1px solid #999; padding: 0 5px 0 40px; font-size: 14px;}
.lx-biaodan textarea.input{line-height: 22px; height: 90px; padding-top: 5px; resize: none;}
.form-item span{ position: absolute; left: 15px; top: 0; width: 40px; text-align: center; line-height: 40px;}
.btn-submit{ display: block; width: 200px; margin: 0 auto; line-height: 40px; text-align: center; font-size: 18px; color: #fff; background: #c40000; border: 0;}
.lx-biaodan .LV_validation_message{ position: absolute; bottom: -16px; left: 15px; top: auto; right: 0; width: 100%; text-align: left; line-height: 1; font-size: 13px; height: 14px; font-weight: 400;  color: #c40000;}
.lx-biaodan .LV_valid{ font-size: 0;}
.lx-address{ width: 32%; margin-top: -15px; }
.lx-address p{ line-height: 50px; position: relative; padding-left: 2em; margin: 0;}
.lx-address span{ position: absolute; left: 0; top: 15px; font-size: 1.3em; }


.footer{ padding: 40px 0; font-size: 14px; color: #ddd; text-align: center; background: #3f3f3f; }
.footer .links a{ display: inline-block; margin: 0 15px 20px; text-transform: uppercase; }

.swt{ position: fixed; right: 0; bottom: 30%; z-index: 999; }
.swt a{ display: block; cursor: pointer; width: 48px; height: 48px; margin-bottom: 5px; background: url(http://chaeng.co/skin/chaeng/images/hw1_sprite.png) no-repeat 0 -512px; background-color: #0076e0; position: relative; opacity: 0.8; filter: Alpha(opacity=80); }
.swt a:hover{ background-color: #bf0303;  }
.swt .swt-kefu{  background-position: 0 -560px;  }
.swt .swt-form{ background-position: 0 -608px; }
.swt .swt-tel{ background-position: 0 -656px; }
.swt-tel-box{ display: none; position: fixed; right: 50px; bottom: 29.5%; padding: 20px 15px; font-family: Verdana, Arial, Helvetica, sans-serif; color: #333; background: #edebeb; border: #ccc 1px solid; border-radius: 10px; z-index: 999; }
.swt-tel-box h3{ font-family: Roboto,Arial, Helvetica, sans-serif; font-size: 20px; margin: 0 0 10px; }
.swt-tel-box li{  line-height: 30px; }

@media (max-width: 1759px){
    .wrap{ width: 1360px; }

    .pro-xk-banner .pp{ font-size: 26px;}

    .pro-xk{ padding-top: 85px; font-size: 26px;}
    .tit{ font-size: 45px;}

    .pro-xk-shili{ padding-bottom: 80px;}
}


@media (max-width: 1559px){
    .wrap{ width: 1160px; }

    .xk-more{ font-size: 28px;}

    .pro-xk-banner .txt{ padding-top: 110px;}
    .pro-xk-banner .txt h2{ font-size: 45px; top: 55px;}
    .pro-xk-banner .pp{ font-size: 24px;}

    .pro-xk{ padding-top: 75px; font-size: 22px;}
    .tit{ font-size: 40px;}

    .pro-xk h3{ margin-bottom: 50px;}

    .pro-xk-shiyong .pp{ margin-top: 2em;}
    .pro-xk-shiyong .bt h4{ font-size: 35px;}

    .pro-xk-shili{ padding-bottom: 70px;}

}

@media (max-width: 1359px){
    .wrap{ width: 960px; }

    .xk-more{ font-size: 24px; }

    .pro-xk-banner .txt{ padding-top: 100px;}
    .pro-xk-banner .txt h2{ font-size: 40px; top: 50px;}
    .pro-xk-banner .pp{ font-size: 22px;}

    .pro-xk{ padding-top: 60px; font-size: 20px;}
    .tit{ font-size: 40px;}

    .pro-xk h3{ margin-bottom: 40px;}


    .pro-xk-shiyong .pp{ margin-top: 2em;}
    .pro-xk-shiyong .bt h4{ font-size: 30px;}
    .pro-xk-shiyong .xk-more{ font-size: 1.5em;}

    .pro-xk-beijian .xk-more{ margin-top: 3em; }

    .pro-xk-shili{ padding-bottom: 50px;}

    .lianxi{ padding: 50px 0 30px;}

}
@media (max-width: 1159px){

    .visible-sm{ display: inline-block!important;}
    .hidden-sm{ display: none!important;}
    .xk-more{ font-size: 0.3125rem; }
    .wrap{ width: 100%; padding: 0 0.3rem;}

    .pro-xk-banner{ border-radius: 0 0 1.46rem 0;}
    .pro-xk-banner .txt{ padding-top: 0;}
    .pro-xk-banner .txt img{ width: 8.1rem; margin-right: -0.3rem; }
    .pro-xk-banner .txt h2{ font-size: 0.35rem; top: 0.4rem;}
    .pro-xk-banner .pp{ font-size: 0.3rem; text-align: left; padding: 0.7rem 0 1.5625rem 1.63rem;}
    .pro-xk-banner .pp .icon1{ top: 0.85rem; left: 0.2rem;
        -webkit-transform: rotate(-30deg);
        -moz-transform: rotate(-30deg);
        -ms-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        transform: rotate(-30deg); }
    .pro-xk-banner .pp .icon2{ top: 1.3rem; left: 0.25rem; }
    .pro-xk-banner .pp .icon3{ right: 1.8rem; bottom: 0.48rem; left: auto; top: auto; }
    .pro-xk-banner .xk-more{ bottom: 0.391rem;}

    .pro-xk{ padding-top: 1rem; font-size: 0.3rem;}
    .pro-xk .xk-box{ position: relative; padding-left: 1.63rem;}
    .pro-xk .xk-box .icon-icon1{ position: absolute; left: 0.3rem; top: 0;}
    .pro-xk .xk-box .icon-icon1 svg{ fill: #c8000a;}
    .tit{ padding-bottom: 0.2rem; margin-left: 0; font-size: 0.49rem; }
    .tit::before{ height: 0.1rem; width: 1.3rem;}
    .pro-xk h3{ margin-bottom: 1em;}

    .pro-xk-shiyong li{ width: 100%;}
    .pro-xk-shiyong li + li{ margin-left: 0;}
    .pro-xk-shiyong .pp{ margin-top: 0.59rem;;}
    .pro-xk-shiyong .pp .bt{ margin-bottom: 0.39rem;}
    .pro-xk-shiyong .bt h4{ font-size: 0.39rem;}
    .pro-xk-shiyong .xk-more{ width: 100%; background: #c8000a; font-size: 0.3125rem; line-height: 2.22;}
    .pro-xk-shiyong .xk-more svg{ top: 0.4em;}

    .pro-xk-beijian ul{ margin: 0 -0.098rem; font-size: 0.24rem;}
    .pro-xk-beijian li{ width: 50%; padding: 0 0.098rem;}
    .pro-xk-beijian li img{ width: 100%;}

    .pro-xk-shili{ padding-bottom: 0.65rem;}
    .pro-xk-shili .p{ padding: 0; text-align: left;}
    .pro-xk-shili ul{ padding: 0;}
    .pro-xk-shili li{ padding-right: 0; margin-bottom: 0.35rem;}
    .pro-xk-shili li p{ position: static; padding-top: 0.15rem; }
    .pro-xk-shili li p::before{ display: none; }

    .lx-biaodan{ width: 100%;}
    .lx-address{ width: 100%; margin-top: 0.5rem;}

}
@media (max-width: 810px){
    .xk-more{ font-size: 0.43rem;}
    .wrap{ width: 100%; padding: 0 0.4rem;}
    .hidden-xs{ display: none;}
    .visible-xs{ display: block;}

    .header{ padding: 0.2rem 0;}
    .header .logo img{ width: 3rem;}
    .header .tel{ font-size: 0.4rem; margin-top: 0.2rem;}

    .pro-xk-banner{ border-radius: 0 0 2rem 0;}
    .pro-xk-banner .txt h2{ font-size: 0.48rem; }
    .pro-xk-banner .txt img{ width: 7.51rem; margin-right: -0.4rem; }
    .pro-xk-banner .pp{ font-size: 0.4rem; padding: 1.067rem 0 1.2rem 2.1rem;}
    .pro-xk-banner .pp p + p{ margin-top: 0.13rem;}
    .pro-xk-banner .pp .icon1{ top: 1rem;  }
    .pro-xk-banner .pp .icon2{ top: 1.55rem;  }
    .pro-xk-banner .pp .icon3{ display: none; }
    .pro-xk-banner .xk-more{ bottom: -0.53rem;}

    .pro-xk{ padding-top: 1.3rem; font-size: 0.4rem;}
    .pro-xk .xk-box{ padding-left: 2.1rem;}
    .pro-xk .xk-box .icon-icon1{ left: 0.4rem;}
    .tit{ padding-bottom: 0.2rem; font-size: 0.6rem; }

    .pro-xk-shiyong li{ margin-bottom: 0.87rem;}
    .pro-xk-shiyong .pic{ width: 9rem; margin-left: -2.1rem; }
    .pro-xk-shiyong .pp{ margin-top: 0.6rem!important; }
    .pro-xk-shiyong .pp .bt{margin-bottom: 0.33rem;}
    .pro-xk-shiyong .pp .bt h4{ font-size: 0.54rem;}
    .pro-xk-shiyong .xk-more{ font-size: 0.48rem; width: 9rem; margin-left: -2.1rem; }

    .pro-xk-beijian ul{ margin: 0; font-size: 0.32rem;}
    .pro-xk-beijian li{ width: 100%; padding: 0; margin-bottom: 0.1rem;}
    .pro-xk-beijian .xk-more{ width: 9rem; margin-left: -2.1rem; margin-top: 0.7rem; }

    .pro-xk-shili{ padding-bottom: 0.6rem;}
    .pro-xk-shili ul{ width: 9rem; margin-left: -2.1rem;}
    .pro-xk-shili li{  margin-bottom: 0.4rem;}
    .pro-xk-shili li p{ padding-top: 0.267rem; font-size: 0.32rem; text-align: center; }



}




























