@charset "utf-8";
/* CSS Document */


/*common*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, textarea, select, p, th, td {margin: 0; padding: 0;}
body, td, th {color: #444; font-family: "微软雅黑"; font-size: 14px;}
h1, h2, h3, h4, h5, h6 {font-size: 100%; font-weight: normal;}
li, dt, dd {list-style: none;}
a {color:inherit; text-decoration:none; transition:all 0.5s ease-in-out; -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out;}
a:hover { color:inherit; /*color:#2c88d8;*/ text-decoration:none;}
img {border:0; vertical-align:middle;}
.clear {clear:both;}
.hide {display:none;}
.f-fl{float: left;}
.f-fr{float: right;}
.c_mp{ padding: 0 !important; margin: 0 !important;}




/*body*/
body {background:#ffffff; }

/*头部样式*/

.header_hover {height:80px; width:100%; min-width:1200px; background:#ffffff; -moz-box-shadow:0px 0px 8px rgba(0,0,0,0.2); -webkit-box-shadow:0px 0px 8px rgba(0,0,0,0.2); box-shadow:0px 0px 8px rgba(0,0,0,0.2); z-index:99999; overflow:hidden; position:fixed; left:0; top:0;}
    .header_hover .header_Panel {height:80px; width:1200px; margin:0 auto;}
    .header_hover .header_Panel .logo { margin-top:28px; width:397px; height:24px; background:url(ratuo_logo.png) 0 0 no-repeat; display: inline-block; float:left; text-indent:-10000px;}
		.header_hover .header_Panel a.logo:before {content:"";position:absolute;width:80px;height:350px;top:0;left:0px;overflow:hidden;background:-moz-linear-gradient(left,rgba(255,255,255,0)0,rgba(255,255,255,.2)50%,rgba(255,255,255,0)100%);background:-webkit-gradient(linear,left top,right top,color-stop(0%,rgba(255,255,255,0)),color-stop(50%,rgba(255,255,255,.2)),color-stop(100%,rgba(255,255,255,0)));background:-webkit-linear-gradient(left,rgba(255,255,255,0)0,rgba(255,255,255,.2)50%,rgba(255,255,255,0)100%);background:-o-linear-gradient(left,rgba(255,255,255,0)0,rgba(255,255,255,.2)50%,rgba(255,255,255,0)100%);-webkit-transform:skewX(-25deg);-moz-transform:skewX(-25deg)}
	    .header_hover .header_Panel a.logo:hover::before{-webkit-transition:left 2s;-moz-transition:left 2s;transition:left 2s;left:500px;}
	.header_hover .header_Panel .tel {margin-top:28px; height:24px; line-height:24px; font-size:24px; color:#6bc22b; padding-left: 24px; background:url(tel.png) left center no-repeat; display:inline-block; font-family:Arial; float:right;}
	.header_hover .header_Panel .nav { height:70px; line-height:60px; float:left; margin-left:50px; overflow:hidden;}
		.header_hover .nav li {height:70px; width:64px; text-align:center; margin-left:10px; float:left;}
			.header_hover .nav li a {height:60px; width:64px; padding-top:10px; color:#333333; font-size:16px; display:inline-block; background:url(nav_bg.jpg) 0 -70px no-repeat;}
				.header_hover .nav li a:hover, .header_hover .nav li a.hover { color:#ffffff; background:url(nav_bg.jpg) 0 0 no-repeat;}
			.header_hover .nav li:nth-of-type(1) {margin-left:0 !important;}
			


/*首页样式*/
.banner { height:760px; width:100%; min-width:1200px; overflow:hidden; z-index:auto; position: fixed; top:0; left:0;}
.banner .m_mn{position: relative; height: 760px;}
.subbanner {height:320px; width:100%; min-width:1200px; overflow:hidden; z-index:1; margin:100px auto 0 auto;}
    .subbanner .subnav { height:54px; margin:266px auto 0 auto; width:1200px; overflow:hidden; text-align:center;}
	    .subnav a { width:140px; line-height:44px; height:44px; display:inline-block; background:rgba(0,0,0,0.4); margin:10px 0 0 1px; -webkit-border-top-left-radius:6px; -webkit-border-top-right-radius:6px; -webkit-border-bottom-right-radius:0px; -webkit-border-bottom-left-radius:0px; -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px; -moz-border-radius-bottomright:0px; -moz-border-radius-bottomleft:0px; border-top-left-radius:6px; border-top-right-radius:6px; border-bottom-right-radius:0px; border-bottom-left-radius:0px; overflow:hidden; font-size:16px; color:#ffffff; transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out;}
		.subnav a:hover, .subnav a.hover { margin:0 0 0 1px; height:54px; line-height:54px; background:#3fac81;}
			
.swiper-container {width: 100%; height: 100%;}
   .swiper-banner .swiper-slide {text-align: center;font-size: 18px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; background-repeat:no-repeat; background-position:center center; position: relative; overflow: hidden;}
   .swiper-banner .swiper-slide a { display:block; height:100%; width: 100%;}

.swiper-banner .swiper-slide .ads_left div,.swiper-banner .swiper-slide .ads_right div{position: absolute;}
.swiper-banner .swiper-slide .ads_left div img,.swiper-banner .swiper-slide .ads_right div img{max-height: 100%;}
.swiper-banner .swiper-slide .ads_left div:nth-child(1){  left: 165px; top: 210px; }
.swiper-banner .swiper-slide .ads_left div:nth-child(2){ left: -650px; top: -320px;  }
.swiper-banner .swiper-slide .ads_left div:nth-child(2) img{   -moz-animation:rotate 20s infinite linear;  -webkit-animation:rotate 20s infinite linear;  animation:rotate 20s infinite linear;  }
.swiper-banner .swiper-slide .ads_left div:nth-child(3){ left: 0px; top: 250px;}
.swiper-banner .swiper-slide .ads_left div:nth-child(4){ left: 145px; top: 210px;}
.swiper-banner .swiper-slide .ads_left div:nth-child(5){ left: 0px; top: 355px;}
.swiper-banner .swiper-slide .ads_left div:nth-child(6){ left: 0px; top: 510px;}
.swiper-banner .swiper-slide .ads_left div:nth-child(7){ left: 148px; top: 510px;}
.swiper-banner .swiper-slide .ads_left div:nth-child(8){ left: 295px; top: 510px;}
.swiper-banner .swiper-slide .ads_left div:nth-child(9){ left: 170px; top: 375px;}
.swiper-banner .swiper-slide .ads_right div:nth-child(1){left: 880px; top: 130px; }
.swiper-banner .swiper-slide .ads_right div:nth-child(2){left: 790px; top: 280px; }
.swiper-banner .swiper-slide .ads_right div:nth-child(3){left: 865px; top: 430px;}
.swiper-banner .swiper-slide .ads_right div:nth-child(4){left: 740px; top: 555px; }
@-moz-keyframes rotate{ 0%{  -moz-transform:rotate(0deg);  } 100%{  -moz-transform:rotate(360deg);  } }
@-webkit-keyframes rotate{ 0%{  -webkit-transform:rotate(0deg);  } 100%{  -webkit-transform:rotate(360deg);  } }
@keyframes rotate{ 0%{  transform:rotate(0deg);  } 100%{  transform:rotate(360deg);  } }

.banner .ads2{ color: #ffffff;  font-size: 18px;}
.banner .ads2 .tt{line-height: 50px; padding-top: 140px;}
.banner .ads2 .g_img div{position: absolute;}
.banner .ads2 .g_img div:nth-child(1){ left: 950px; bottom: 80px;  z-index: 3; }
.banner .ads2 .g_img div:nth-child(2){ left: 760px; bottom: 90px; z-index: 2; }
.banner .ads2 .g_img div:nth-child(3){ left: 80px; bottom: 50px; z-index: 3; }
.banner .ads2 .g_img div:nth-child(4){ left: 330px; bottom: 70px; }
.banner .ads2 .g_img div:nth-child(5){ left: 170px; bottom: 95px;z-index: 2; }
.banner .ads2 .g_img div:nth-child(6){ left: 510px; bottom: 115px; }
.banner .ads2 .g_img div:nth-child(7){ left: 560px; bottom: 320px; }

.banner .ads3{ color: #ffffff;  font-size: 18px; text-align: left; }
.banner .ads3 .g_img div,.banner .ads3 .ico,.banner .ads3 .tt{position: absolute;}
.banner .ads3 .tt{ left: 30px; top: 190px; line-height: 36px; }
.banner .ads3 .tt img{margin-bottom: 30px;}
.banner .ads3 .ico{ left: -20px; bottom: 120px; }
.banner .ads3 .ico div{display: inline-block; }
.banner .ads3 .g_img div:nth-child(1){  right: -33px; top: 180px; }
.banner .ads3 .g_img div:nth-child(2){  right: 65px; top: 180px; }
.banner .ads3 .g_img div:nth-child(3){  right: 155px; top: 150px; }
.banner .ads3 .g_img div:nth-child(4){  right: 220px; top: 120px; }

.banner .ads4{ color: #ffffff;  }
.banner .ads4 .g_img div,.banner .ads4 .ico,.banner .ads4 .tt{position: absolute;}
.banner .ads4 .tt{ width: 100%; text-align: center; top: 120px; z-index: 11; }
.banner .ads4 .ico{text-align: center;  width: 100%; bottom: 60px; font-size: 14px;}
.banner .ads4 .ico div{ display: inline-block; margin: 0 20px 20px;  }
.banner .ads4 .g_img div:nth-child(1){  width: 100%; text-align: center; top: 205px;}
.banner .ads4 .g_img div:nth-child(2){  left: 693px; top: 469px; }
.banner .ads4 .g_img div:nth-child(3){  left: 307px; top: 370px; }
.banner .ads4 .g_img div:nth-child(4){  left: 742px; top: 315px; }
.banner .ads4 .g_img div:nth-child(5){  left: 335px; top: 245px; }
.banner .ads4 .g_img div:nth-child(6){  width: 100%; text-align: center; line-height: 735px; z-index: 1; font-weight: bold; font-size: 22px; }
.banner .ads4 .g_img .img_rotate,.g_img .img_rotate{  -moz-animation:rotate 15s infinite linear;  -webkit-animation:rotate 15s infinite linear;  animation:rotate 15s infinite linear; }
.g_img .img_rotate1{  -moz-animation:rotate 20s infinite linear;  -webkit-animation:rotate 20s infinite linear;  animation:rotate 20s infinite linear; }



/*内页共用样式*/
.m_mn{ width: 1200px; margin: 0 auto;}
.m_xn{ width: 1000px; margin: 0 auto; }
/*.m_ads{ height:460px; width:100%; min-width:1200px; overflow:hidden; z-index:-1; position: fixed; top:0; left:0;}*/
.m_ads{ height:380px; width:100%; min-width:1200px; overflow:hidden; z-index:-1; position: fixed; top:0; left:0;}
.m_ads.h_280{height: 280px;}
.m_ads.h_280 .text{ padding-top: 127px; }
.m_ads.h_300{height: 300px;}
.m_ads.h_300 .text{ padding-top: 147px; }
.m_ads.h_580{height: 580px;}
.m_ads.h_580 .text{ padding-top: 140px; }
.m_ads .text{ text-align: center; padding-top: 170px;}
.m_ads .text span{font-size: 40px; color: #ffffff; margin: 0 10px; text-transform: uppercase; -webkit-text-shadow:0px 0px 10px rgba(0,0,0,0.5); -moz-text-shadow:0px 0px 10px rgba(0,0,0,0.5);  text-shadow:0px 0px 10px rgba(0,0,0,0.5);   }
.m_ads .text .xt{ height: 1px; width: 145px; margin: 15px auto 0; border-bottom: 1px solid rgba(255,255,255,0.5);  }

/*.m_main{width:100%; min-width:1200px; background:#f5f5f5; margin:460px auto 0 auto; }*/
.m_main{width:100%; min-width:1500px; background:#f5f5f5; margin:380px auto 0 auto; height: 1120px;}
.m_main2{width:100%; min-width:1500px; height:520px;  margin:250px auto 0 auto; background: url(case_top_bj.png) repeat-x left center; }
.m_main3{width:100%; min-width:1500px;  background:#ffffff;  overflow: hidden;  position: relative;  }
.m_main4{width:100%; min-width:1500px;  background:#f5f5f5;  margin:280px auto 0 auto;  position: relative;  }
.m_main5{width:100%; min-width:1500px; background:#ffffff; margin:0; }
.m_main6,.m_main7{width:100%; min-width:1500px;  color:#ffffff; margin:0;}

.m_subtopic{ height: 70px; width: 100%; border-bottom: 1px solid #E7E7E7; background-color: #ffffff;  }
.m_subtopic .subtopic_list{ font-size: 0; color: #666666; overflow: hidden; height: 70px;  text-align: center; }
.m_subtopic .subtopic_list li{display: inline-block; height: 70px; line-height: 70px; padding: 0 20px; background: url(side_bjx.png) no-repeat right center; font-size: 18px; }
.m_subtopic .subtopic_list li:last-child{background: none;}
.m_subtopic .subtopic_list li a{display: block; padding: 0 20px; height: 70px; border-bottom: 2px solid #ffffff; }
.m_subtopic .subtopic_list li a.on::before{ width: 100%; }
.m_subtopic .subtopic_list li a:hover,.m_subtopic .subtopic_list li a.on{color: #3784D2;}
.m_subtopic .subtopic_list li a.hvr-underline-from-left:before{height: 2px; background: #3784D2; -webkit-transition-duration: .5s;  transition-duration: .5s;  }

.m_subtopic1{height: 60px; width: 100%; border-bottom: 1px solid #E7E7E7; background-color: #ffffff; }
.m_subtopic1 .subtopic_list{ font-size: 16px; color: #333333;  }
.m_subtopic1 .subtopic_list li{float: left; margin-right: 40px; height: 60px; line-height: 60px; }
.m_subtopic1 .subtopic_list li dl{ max-height: 60px; overflow: hidden; position: relative; z-index: 111; transition:max-height 0.5s ease-in-out; -webkit-transition:max-height 0.5s ease-in-out;  }
.m_subtopic1 .subtopic_list li dl:hover{ max-height: 300px; background-color: #ffffff; color: #333333;}
.m_subtopic1 .subtopic_list li dl dt{  background: url( blog_ico1.png) no-repeat 50px center; padding-right: 20px; cursor: pointer; }
.m_subtopic1 .subtopic_list li dl dd{ height: 40px; line-height: 40px; padding: 0 10px;background-color: #ffffff;   }

.m_crm{ height: 50px; line-height: 50px; color: #888888; background: url(news_ico2.png) no-repeat left 17px; text-indent: 25px;}
.m_crm1{ height: 50px; border-bottom: 1px solid #E7E7E7; line-height: 50px; color: #888888; }
.m_crm1.on{background-color: #ffffff; }
.m_crm1 .m_xn,.m_crm1 .m_mn{background: url(news_ico2.png) no-repeat left 17px; text-indent: 25px;}
.m_crm a.on,.m_crm a:hover,.m_crm1 a.on,.m_crm1 a:hover{color: #666666;}

.share span{line-height: 20px !important; float: left; margin-right: 10px;}
.n_mn .m_text .article_tt{ color: #333333; font-size: 24px; font-weight: bold; margin-bottom: 18px; margin-top: -5px;  }
.n_mn .m_text .g_attr span{ display: inline-block;  margin-right: 25px; color: #888888;}
.n_mn .m_text .g_attr span.on a{display: inline-block; border: 1px solid #cccccc; margin-right: 5px; border-radius: 5px; font-size: 12px; width: 18px; height: 18px; line-height: 18px; text-align: center;}
.n_mn .m_text .g_attr span.on a:hover{ background-color: #2c88d8; color: #ffffff; border: 1px solid #2c88d8; }
.n_mn .m_text .g_attr span a:hover{color: #2c88d8;}
.n_mn .m_text .text{padding: 30px 0 ; font-size: 14px; color: #666666; line-height: 28px; overflow: hidden; }
.n_mn .m_text .text img{ max-width: 100%;}
.n_mn .m_aside{ padding: 25px 0 30px; line-height: 26px; overflow: hidden; border-top: 1px dotted #C7C7C7; color: #888888;}

/*关于我们*/
.n_about{ padding: 60px 0 0; background-color: #ffffff;}
.n_about .m_tt{ text-align: center; }
.n_about .about .g_text{ color: #666666; line-height: 28px; width: 1000px; margin: 15px auto 80px;}
.n_about .team{ background:#f6f6f6 url(about_img1.png) no-repeat center top; height: 520px; width: 100%;  }
.n_about .team .g_text{padding-top: 160px; padding-left: 20px; color: #ffffff; line-height: 28px; width: 540px; }
.n_about .team .g_text .g_tt{margin-bottom: 35px;}
.n_about .culture{background-color: #f6f6f6;  height: 485px; padding-top: 85px; width: 100%;  }
.n_about .culture .culture_list{overflow: hidden; width: 1200px; margin: 60px auto 0;font-size: 0;  }
.n_about .culture .culture_list li{ display: inline-block;  width: 270px; margin-right: 40px; text-align: center;   }
.n_about .culture .culture_list li .g-img{ width: 185px; height: 185px; line-height: 185px; text-align: center; margin: 0 auto; border: 1px dashed #B9BABA; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;     }
.n_about .culture .culture_list li .g-img img{ width: 170px; height: 170px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; }
.n_about .culture .culture_list li .text .tt{ color: #333333; font-size: 20px; margin: 30px 0 5px; }
.n_about .culture .culture_list li .text .info{ color: #666666; font-size: 14px; line-height: 28px;  }

.n_about .design{ padding-top: 90px; height: 560px; }
.n_about .design .g-text{ padding-left: 20px; width: 550px; overflow: hidden; }
.n_about .design .g-text .tt{ color: #f29e1c; font-size: 36px; font-weight: bold; margin: 80px 0 15px; }
.n_about .design .g-text .info{ color: #cccccc; font-size: 16px; margin-bottom: 45px;  line-height: 20px;  text-transform: uppercase; }
.n_about .design .g-text .txt{ color: #666666; line-height: 28px; }

.n_about .fz{background-color: #f6f6f6;  height: 475px; padding-top: 85px; width: 100%;  }
.n_about .fz .g-img{margin-top: 75px; text-align: center;}

.n_about .service{ padding: 80px 0 20px; }
.n_about .service .g-img{  text-align: center; margin-top: 65px; }
.n_about .service .list{ font-size: 0; position: relative; margin-top: -113px; }
.n_about .service .list li{ width: 395px; display: inline-block; height: 340px;  font-size: 14px; color: #cccccc; text-align: center; text-transform: uppercase; }
.n_about .service .list li div{ height: 240px; width: 100%; background: url(about_ico1.png) no-repeat ;}
.n_about .service .list li .tt{  color: #666666; font-size: 22px; margin-bottom: 5px;}
.n_about .service .list li div.ico1{ background-position: 158px 140px; }
.n_about .service .list li div.ico2{ background-position: -220px 140px; }
.n_about .service .list li div.ico3{ background-position: -604px 140px; }


/*联系我们*/
.n_contact{ padding: 5px 0;}
.n_contact .s_side{height: 12px; text-align: center; }
.n_contact .s_side a{  display: inline-block; height: 50px; font-size: 16px; line-height: 50px; color: #666666; width: 200px; border: 1px solid #dedede; background-color: #ffffff; border-radius: 30px; margin: 0 10px; }
.n_contact .s_side .hvr-bounce-to-right:before{  border-radius: 30px;background: #2c88d8;border-color: #2c88d8;  }
.n_contact .s_side a:hover{  color: #ffffff;}
.n_contact .s_side a.on{ background: #2c88d8; color: #ffffff;}
.n_contact .s_side a.on:before{background: none;}
.n_contact .g_content .allmap{ margin-bottom: 0px; padding: 10px; background-color: #ffffff; position: relative;  -moz-box-shadow:0px 0px 20px rgba(127,128,130,0.2); -webkit-box-shadow:0px 0px 20px rgba(127,128,130,0.2); box-shadow:0px 0px 20px rgba(127,128,130,0.2);  height: 500px; }
.n_contact .g_content .allmap .text{position: absolute; background-color: rgba(255,255,255,0.9); padding: 40px 30px; width: 265px; top: 90px; left: 0; -moz-box-shadow:10px 0px 20px rgba(127,128,130,0.4); -webkit-box-shadow:10px 0px 20px rgba(127,128,130,0.4); box-shadow:10px 0px 20px rgba(127,128,130,0.4);}
.n_contact .g_content .allmap .text .tt{ color: #2c88d8; font-size: 24px; background: url(contact_ico1.png) no-repeat -5px -85px; padding-left: 15px; height: 35px; margin-bottom: 20px; }
.n_contact .g_content .allmap .text .dt,.n_contact .g_content .allmap .text .gj{ color: #333333; font-size: 18px; background: url(contact_ico1.png) no-repeat left -181px; padding-left: 30px; margin-bottom: 10px; }
.n_contact .g_content .allmap .text .gj{ background: url(contact_ico1.png) no-repeat left 1px; }
.n_contact .g_content .allmap .text .xt{ border-bottom: 1px dashed #CACACA; width: 100%; height: 1px; margin: 20px 0; }
.n_contact .g_content .allmap .text .route{ color: #666666; line-height: 28px; }
.n_contact .g_content .g-text{ padding: 60px 0; width: 100%; height: 205px;  }
.n_contact .g_content .g-text .left{ width: 599px; border-right: 1px solid #DCDCDC; height: 205px;float: left; }
.n_contact .g_content .g-text .left .g-img{ line-height: 205px; height: 205px; width: 75px; margin-left: 10px;}
.n_contact .g_content .g-text .left .text{height: 205px;color: #333333; width: 500px; }
.n_contact .g_content .g-text .left .text .tt{ font-size: 24px; margin-top: 30px;}
.n_contact .g_content .g-text .left .text .address{ font-size: 16px;margin-top: 10px; padding-left: 25px; background: url(contact_ico2.png) no-repeat left -353px;  }
.n_contact .g_content .g-text .left .text .info{ color: #666666; font-size: 14px; margin-top: 40px; }
.n_contact .g_content .g-text .left .text .info span{ display: inline-block; height: 25px; padding-left: 25px; background: url(contact_ico2.png) no-repeat left -265px; margin-bottom: 20px; width: 190px;}
.n_contact .g_content .g-text .left .text .info span:nth-child(2){ background-position: left -86px; }
.n_contact .g_content .g-text .left .text .info span:nth-child(3){ background-position: left -176px; }
.n_contact .g_content .g-text .left .text .info span:nth-child(4){ background-position: left 5px; }

.n_contact .g_content .g-text .right{ width: 600px; padding-left: 80px;  height: 205px;float: left; }
.n_contact .g_content .g-text .right .text{ height: 215px; float: left; width: 400px;}
.n_contact .g_content .g-text .right .text .tt{ color: #888888; font-size: 18px; margin-top: 30px;  }
.n_contact .g_content .g-text .right .text .tel{ color: #2c88d8; font-size: 46px; font-weight: bold; margin-top: -5px; margin-bottom: 20px;  }
.n_contact .g_content .g-text .right .text .info{ color: #666666; margin-top: 14px;}
.n_contact .g_content .g-text .right .text .info span{display: inline-block;padding-left: 25px; height: 25px; width:160px; margin-bottom: 20px; margin-right: 15px; background: url(contact_ico2.png) no-repeat left -445px; }
.n_contact .g_content .g-text .right .g-img{ float: right;  height: 205px; width: 140px; }
.n_contact .g_content .g-text .right .g-img .code{background-color: #ffffff; text-align: center; margin-top: 25px; -moz-box-shadow:0px 0px 20px rgba(127,128,130,0.4); -webkit-box-shadow:0px 0px 20px rgba(127,128,130,0.4); box-shadow:0px 0px 20px rgba(127,128,130,0.4); }
.n_contact .g_content .g-text .right .g-img .code p{padding: 0 0 10px ; color: #666666;}