@charset "utf-8";

/* CSS Document */

html{font-size:62.5%;}

body, ul, ol, dl, li, dd, h1, h2, h3, h4, h5, h6, p, form, fieldset, legend, input, textarea, select, button,table, th, td {padding: 0;margin: 0;}

body{font-family:"Microsoft YaHei";font-size:12px; line-height:24px; background-color:#FFF }

ol,ul,li{list-style:none}

ol,ul{list-style:none}

fieldset{border:0}

img {

    border: 0 none;

    height: auto;

    max-width: 100%;

    

}

a{ text-decoration:none}

table{border-collapse:collapse;border-spacing:0}

input,select,button,label{vertical-align:middle;font-size:12px}

input::-moz-focus-inner{ border:0; padding:0; margin:0; }

.clear{ clear: both;}

.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;*zoom:1;}

.left{float:left}

.right{float:right}

h1,h3,h4,h5{font-weight: 200}

.lb_hd1{ max-width: 720px; width: 95%; margin: 0 auto;}

.div-main{

    margin: 0 auto;

    max-width: 720px; min-width:320px; overflow:hidden;

	width: 100%;line-height: 250%;}

.div-main p{line-height: normal;}

.main,.main2{width: 94%;margin: 0 auto}

.banner{position: relative;min-height:320px;padding-bottom: 7%}

.banner b{ display: block;  width: 20.69%; position: absolute; top: 8%;  left: 30%; }

.banner .animate{-webkit-animation: mymove 3s infinite;  animation: mymove 2s infinite;}

@keyframes mymove

{

    from{ top: 8%; left: 0; opacity: 0  }

    to {top: 8%; left:30%; opacity: 1}

}

@-moz-keyframes mymove{

    from{ top: 8%; left: 0; opacity: 0  }

    to {top: 8%; left:30%; opacity: 1}

}

@-webkit-keyframes mymove

{

    from{ top: 8%; left: 0; opacity: 0 }

    to {top: 8%; left:30%; opacity: 1}

}

@-ms-keyframes mymove{

    from{ top: 8%; left: 0; opacity: 0  }

    to {top: 8%; left:30%; opacity: 1}

}

@-o-keyframes mymove{

    from{ top: 8%; left: 0; opacity: 0  }

    to {top: 8%; left:30%; opacity: 1}

}

@keyframes pulse {

0% {

-webkit-transform:scale(1);

-ms-transform:scale(1);

transform:scale(1)

}

50% {

-webkit-transform:scale(1.1);

-ms-transform:scale(1.1);

transform:scale(1.1)

}

100% {

-webkit-transform:scale(1);

-ms-transform:scale(1);

transform:scale(1)

}

}

/*网友热搜*/
.banner_gao{float: left; margin-top: 8rem;}
.wrap-daohang{float: left;width:100%;max-width: 720px;min-width: 320px;position:fixed;top:8rem;z-index:99999;background:rgba(0,0,0,.8);-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box; overflow: hidden;}
.wrap-daohang .step{width:21.66%;float:left;border-right: 1px solid rgba(255,255,255,0.2);padding-top:0.9rem;padding-bottom:0.8rem;font-size:2.4rem;color:#FFFFFF;text-align:center;font-weight:600;line-height:140%;}
.wrap-daohang .step a{width:100%;height:100%;display:block;color:#FFFFFF;}
.wrap-daohang .step:nth-child(1){width:12%;color:#dcc142;}
.wrap-daohang .step:nth-child(5){border-right: none;}

.banner a {

    background: #f35595;

    border-radius: .6em;

    color: #fff;

    display: block;

    font-size: 3.2rem;

    margin: -20% auto 0;

    padding: 4% 0;

    position: relative;

    text-align: center;

    width: 80%;animation: 1.5s ease 0s normal none infinite running pulse;

}

.banner a img {

    position: absolute;

    right: 17%;

    top: 36%;

    width: 4.55%;

}

hgroup{text-align: center;color: #2b3b67;}

hgroup h3{font-size: 4.8rem;font-weight: bold;}

hgroup h4{font-size: 2.4rem;margin-top: 2%}

hgroup img{width: 100%;margin-top: 2%}

.div1 .tab{overflow: hidden;margin-top: 4%;position: relative;}

.div1 .tab li{width: 21.6%;float: left;margin-left: 17%}



.div1 .tab .pic1 {

    left: 26%;

    position: absolute;

    top: 36%;

    width: 8%;

}

.div1 .tab .pic2 {

    right: 26%;

    position: absolute;

    top: 36%;

    width: 8%;

}

.div1 .tab li:first-child{margin-left: 0}

.div1 .tab li.active .pic{background:url("../picture/link.jpg") no-repeat scroll 0 0 / 100% auto;}

.div1 .tab li .pic img {

    margin: 0 auto;

    padding: 3% 0 7%;

    width: 93.2%;

}

.div1 .tab li h3{font-size: 2.6rem;color: #141414;text-align: center;margin-top: 1%}

.div1 .tab .active h3{ font-weight: 600; color:#3b508a;}

.div1 section{background: #6a7bb9;overflow: hidden; position: relative;}



.main .click a{ background: #e80052;

    color: #fff;

    border-radius: .2em;

    font-size: 2.9rem;

    padding: 3% 0;

    text-align: center;

    width: 42%;float: left;}

.padding{padding: 6% 0}

.div2 {background:#eef5fa; margin-bottom: 3%; overflow: hidden;}

.div2 .main a{width: 67%}

.div2 .main a img{width: 4%}

.div2 section{margin-top: 6%;position: relative;}

.div2 section ul{width: 100%;position: absolute;bottom: 13%;left: 0}

.div2 section ul li{font-size: 2.6rem;color: #fff;width: 45%;text-align: center;float: left;}

.div2 section ul li:last-child{float: right;}

.main a{

    background: #f35595;

    border-radius: .6em;

    color: #fff;

    display: block;

    font-size: 3.2rem;

    margin: 0 auto;

    padding: 4% 0;

    position: relative;

    width: 57%;

	text-align: center;

	/*animation: 1.5s ease 0s normal none infinite running pulse;*/

  }

.main a img {

    position: absolute;

    right: 8%;

    top: 34%;

    width: 4.55%;

}

.case {

    margin: 4% auto 0;

    overflow: hidden;

    width: 100%;

}

.case ul li{position: relative; background: #eef5fa; overflow: hidden;}

.case ul li i{ display: block; width: 90%; margin: 4% auto;}

.case ul li i img{ width: 100%;}

.case ul li a.case_btn1{ width:46%; float: left; margin: 0 2% 3% 2%; font-size: 3rem;}

.case ul li a.case_btn2{ width:46%; float: right; margin: 0 2% 3% 2%; font-size: 3rem;}

.case ul li h3{font-size: 3.6rem;color: #fff;text-align: center;position: absolute;top:0;left: 0;padding:3% 0;width: 100%}

.pagination,.pagination2{text-align: center;display:block;margin-top: 4%}

.pagination .swiper-pagination-bullet,.pagination2 .swiper-pagination-bullet{

 background: #c9c9c9;margin-left: 1%;opacity: 1;padding: 2px}



.pagination .swiper-pagination-bullet-active,.pagination2 .swiper-pagination-bullet-active{

  padding: 1px;border: none;border:2px solid #fa589a;background: none;padding: 0

}

.div4 .theme{overflow: hidden;margin-top: 6%}

.div4 .theme a.div4_btn1{ width:46%; float: left; margin: 0 2% 3% 2%; font-size: 3rem;}

.div4 .theme a.div4_btn2{ width:46%; float: right; margin: 0 2% 3% 2%; font-size: 3rem;}

.expert{position: relative;}

.expert .main2{position: absolute;width: 100%;top:4%;left: 0}

.expert .main2 hgroup{width: 94%;margin: 0 auto}

.expert .main2 hgroup h3{line-height: 120%}

.expert .title,.brand .title,.security .title{width: 50%;margin: 4% auto 0}

.expert .title .left,.brand .title .left,.security .title .left{

    background: #7692e1;

    border-radius: 0.2em;

    color: #fff;

    font-size: 7.6rem;

    padding: 9% 0;

    text-align: center;

    width: 28%;

}

.expert .title .right,.brand .title .right,.security .title .right{width: 72%;font-size: 3.2rem;color: #435a9b;line-height: 129%}

.expert .title{ margin-bottom: 3%;}

.expert .title .right{ width: 60%;}

.expert .theme2{

  position: relative;margin-top: 3%

}

.expert-left{

  width:100%;

}

.expert-right{

  width:58%;position: absolute;top:6%;right: 4%

}

.expert-right .top{position: relative;}

.expert-right .top h3{color: #f1f7fa;font-size: 12rem;}

.expert-right .top h4{position: absolute;top:32%;left: 0;font-size: 2.4rem;width: 100%;line-height: 160%;vertical-align: bottom;}

.expert-right .top h4 span{font-size: 4.5rem;font-weight: bold;padding-right: 2%;vertical-align: bottom;line-height: 140%}

.expert-right .top img {

    left: 36%;

    position: absolute;

    top: 59%;

    width: 9%;

}

.expert-right h5{font-size: 3.4rem;color: #575b9b;margin-top: 12%}

.expert-right p{font-size: 2.4rem;color: #333333;margin-top: 4%}

.expert-right aside {

    background:url("../picture/span.png") no-repeat scroll 0 0 / 100% auto;

    color: #fff;

    font-size: 3.2rem;

    margin-top: 6%;

    padding: 1.5% 0;

    text-align: center;

    width: 40%;

}

.expert-right section{font-size: 2.4rem;color: #333333;margin-top: 4%}

.expert a {

    background: #fff none repeat scroll 0 0;

    border: 1px solid #f8e61b;

    border-radius: 0.7em;

    bottom: 4%;

    color: #232323;

    display: block;

    font-size: 2.4rem;

    padding: 2.5% 0;

    position: absolute;

    right: 12%;

    text-align: center;

    width: 29%;

}

.expert a img {

    bottom: 0;

    position: absolute;

    right: 19%;

    width: 13%;animation: 1.5s ease 1s normal none infinite running rotate;

}

.theme2 article {

   overflow: hidden;margin-top: 6%

}

.theme2 article .left {

    background: #333333;

    border-radius: 0.5em;

    color: #fff;

    font-size: 2.8rem;

    padding: 2%;

    text-align: center;

    width: 15%;

}

.theme2 article .right {

    color: #333333;

    font-size: 2.4rem;

    margin-top: 2%;

    width: 79%;

}

.theme2 .pagination2{margin-top: 6%}

.expert-right ul li{

  float: left;

  width:45.6%;

  margin-left:3%;

}

.expert-right ul li:first-child{

  margin-left:0;

}

.expert-right ul li p{

  text-align: center;

  font-size: 2.4rem;

  color: #333333;

  line-height:150%;

}



.brand .title .left{padding: 7.5% 0;width: 23%}

.security .title .left{padding: 7.5% 0;width: 21%}

.brand .title .right,.security .title .right{width: 75%}

.brand .title{width: 68%;margin-top: 6%}

.security .title{width: 78%;}

.brand .pic{margin-top: 6%}

.brand  p{font-size: 2.4rem;color: #2e2e2e;text-indent: 2em;width: 94%;margin: 3% auto 6%}

.brand  p span{color: #f55697}

.brand ul{overflow: hidden;margin-bottom: 6%}

.brand ul li{float: left;width: 31.2%;position: relative;margin-left: 2%}

.brand ul li aside{position: absolute;top:65%;width: 100%;left: 0;text-align: center;font-size: 2.4rem;color: #0d0d0d;}

.brand ul li:first-child{margin-left: 0}

.brand ul li:last-child aside{top: 70%}

/*.brand .main a{padding-left: 12%}*/

.brand .main a img{

    right: 16%;

    top: 35%;

    width: 4%;

}

.security {background: #eef5fa;margin-top: 6%;padding-bottom: 4%}

.security .theme{margin-top: 6%;overflow: hidden;border-radius: 1em;background: #fff;padding-bottom: 6%;box-shadow:0 2px 5px rgb(221, 224, 234)}

.security .top{position: relative;width: 94%;margin: 0 auto}

.security .top h3{font-size: 3.4rem;color: #7893e1;width: 100%;top:43%;left: 0;color: #7893e1;position: absolute;text-align: center;

font-weight: bold;

}

.security .top aside{width: 12%;font-size: 2.8rem;color: #fff;position: absolute;left:0;top:12%;text-align: center;}

.security section{margin: 6% auto 0;overflow: hidden;width: 94%}

.security section .pic{width: 48%;float: left;position: relative;}

.security section .pic:nth-child(even){float: right;}

.security section .pic:nth-child(3),.security section .pic:nth-child(4){margin-top: 3%}

.security section .pic h3{font-size: 2.4rem;color: #fff;text-align: center;padding: 4% 0;position: absolute;bottom: 0;left: 0;width: 99%;

background:rgba(0,0,0,0.55)

}

.security ol{width: 94%;margin: 6% auto 0;overflow: hidden;}

.security ol li{width: 18%;font-size: 2.4rem;color: #435a9b;border:1px dashed #435a9b;margin-left:1.5%;float: left;

 padding: 2% 0;text-align: center;border-radius: .5em

}

.security ol .odd{padding: 4.3% 0}

.security ol li:first-child{margin-left: 0}

.security ul li a.security_btn1{ width:46%; float: left; margin: 3% 2%; font-size: 3rem;}

.security ul li a.security_btn2{ width:46%; float: right; margin: 3% 2%; font-size: 3rem;}

.understand {

  background: url("../picture/bj_06.jpg") no-repeat scroll 0 0 / 100% auto;

    padding-bottom: 87%;

    position: relative;

}

.understand hgroup{padding-top: 8%}

.understand hgroup img{margin-top: 3%}

.understand section a {

    display: block;

    position: absolute;

}

.understand section a:first-child {

    animation: 2s ease 0s normal none infinite running rotate;

    left: 5%;

    top: 30%;

    width: 23%;

}

.understand section a:first-child h3 {

    left: 0;

    top: 29%;

}

.news_tx_mk1{ width:100%;}

.news_tx_mk2{ width:100%; background:#ededed; overflow:hidden; padding-bottom:1rem;}

.news_tx_mkh3{text-align:center; line-height:6rem; font-size:4rem;}

.news_tx_mkh3s{ font-weight:bold; text-align:center; line-height:6rem; font-size:4rem;color: #2b3b67;}

.news_tx_mk1ul{ width:98%; margin-left:1%; margin-right:1%; padding-bottom:1rem; float:left;}

.news_tx_mk1ul li{ width:48%; margin-left:1%; margin-right:1%; float:left; margin-top:0.5rem; margin-bottom:0.5rem;}

.news_tx_mk1ul li p{ width:100%; float:left; font-size:2.4rem; text-align:center; background:#dfdfdf; line-height:5rem;border-radius:1rem;}

.news_tx_mk1ul li.style_wrc1 p{ background:#ff9900;}

.news_tx_mk1ul li.style_wrc1 p a{ color:#FFFFFF;}

.news_tx_mk1ul li p a{ color:#000000;}



@keyframes rotate {

0% {

    transform: translateY(-2px);

}

50% {

    transform: translateY(2px);

}

100% {

    transform: translateY(-2px);

}

}

.understand section a:nth-child(2) {

    animation: 1.5s ease 1s normal none infinite running rotate;

    left: 47%;

    top: 22%;

    width: 28%;

}

.understand section a:nth-child(2) h3 {

    left: 0;

    top: 33%;

}

.understand section a:nth-child(3) {

    animation: 1.8s ease 2s normal none infinite running rotate;

    left: 29%;

    top: 45%;

    width: 27%;

}

.understand section a:nth-child(3) h3 {

    left: 0;

    top: 26%;

}

.understand section a:nth-child(4) {

    animation: 1.8s ease 0.4s normal none infinite running rotate;

    left: 71%;

    top: 50%;

    width: 23%;

}

.understand section a:nth-child(4) h3 {

    left: 0;

    top: 21%;

}

.understand section a:nth-child(5) {

    animation: 2s ease 0.5s normal none infinite running rotate;

    left: 11%;

    top: 70%;

    width: 23%;

}

.understand section a:nth-child(5) h3 {

    left: 0;

    top: 31%;

}

.understand section a:nth-child(6) {

    animation: 1.3s ease 1s normal none infinite running rotate;

    left: 56%;

    top: 73%;

    width: 21%;

}

.understand section a:nth-child(6) h3 {

    left: 0;

    top: 30%;

}

.understand section a h3 {

    color: #fff;

    font-size: 2.4rem;

    position: absolute;

    text-align: center;

    width: 100%;

    line-height: 150%;

}

/*热门问题*/

.rmwt_bibu {padding:1.5% 0; clear: both;}

.rmwt_bibu h3 { margin:3% 0;font-size: 4.8rem;font-weight:600;color:#2b3b67;text-align:center;}

.rmwt_bibu ul { padding:0 1%;overflow:hidden;}

.rmwt_bibu ul li {float:left;width:47%;padding:2.5% 0;margin:2.5% 1%; border-radius: 3rem;background:#f35595;}

.rmwt_bibu ul li a {display:block;font-size: 3.2rem;color:#FFF;text-align:center;}

/*热门问题-END*/

@media only screen and (min-width:320px) and (max-width:348px){

html{font-size: 30%}

.div-main{line-height: 120%}

.guarantee ul li dl dt,.guarantee ul li dl dd{font-size: 2.2rem}

.div2 ul li a{font-size: 2.4rem}

.div3 .tab2 li,.technology .top p,.technology .top a{font-size: 2.2rem}

.expert-right .intro p{font-size: 2.2rem}

hgroup h3{font-size: 4.3rem}

.why section a{margin-top: 3%;}

.ask section a{font-size: 2.3rem}

.ask .main2 h3{font-size: 3.8rem}

.theme2 article .click a{font-size: 2.6rem}

}

@media only screen and (min-width:349px) and (max-width:370px){

html{font-size: 31.5%}

.div-main{line-height: 115%}
}

@media only screen and (min-width:371px) and (max-width:480px){

html{font-size: 32.5%}

.div-main{line-height: 140%}
}