*{ font-family:"Microsoft Yahei", Arial, "Hiragino Sans GB", "Helvetica Neue", Helvetica, sans-serif; box-sizing:border-box; -webkit-box-sizing-border:border-box; -moz-box-sizing-border:border-box; -o-box-sizing-border:border-box; margin:0; padding:0;list-style-type:none;}
.nowrap,.nowrapall,.nowrapall * { white-space: nowrap;text-overflow:ellipsis; overflow:hidden; }
.break,.breakall,.breakall * { word-wrap:break-word; word-break: break-all; }
.animate , .animateall , .animateall * { transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; }
.clearfix{ clear: both;}
.clearfix:after，.clearfix:before{ content: ""; clear: both; height:0;}

body{margin: 0; padding: 0;color: #666; font-size: 12px;line-height: 20px;border: 0;}
a { text-decoration: none;color: #666; }
ul { list-style: none;margin: 0;padding: 0; }
img{ border:none;}
i{ font-style: normal; }
table { border-collapse: collapse; }
input:focus , select:focus , textarea:focus , img, * { outline: none; }


/*公共样式*/
.pd10{ padding:0 10px;}
.wrap{ width: 100%; margin: 0; clear: both;}
.wrapbox{ max-width: 1200px; margin:0 auto; display: block; position: relative;}
.hotserve { transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; }
.btn{ display:inline-block; height: 36px; line-height: 36px; color:#fff; padding:0 25px; border-radius:5px; background:#099aff;}
.fl{float:left;}
.fr{float: right; }


/* 首页 */
/*头部*/
.topbar{ background: #333; height: 90px; }
.topbar img.logo{ float: left; margin-top:15px; }
.topbar  b{ float:right; color: #009944; font-size:24px; font-weight: normal; line-height: 90px; }


/* banner */

.mybanner{ width:100%; height: auto; }
.mybanner img{ width:100%;  height: auto; }
.mybanner img.sban{ display: none;  }


/*小程序，公众二维码*/
.qrcode .code{ width: 50%; float:left; margin:80px auto; }
.qrcode .code .qrcode_text{ width:100%; padding:20px; position: relative; }
.qrcode .code .qrcode_text img{ width: 27%; height: auto; position: absolute; top:10px; left:10px; z-index: 1; }
.qrcode .code .qrcode_text .text{ padding-left:30%; line-height: 30px; color:#009944;  text-align: left; margin-top:20px;}
.qrcode .code .qrcode_text .text h3{ font-size:36px; font-weight:normal; line-height: 40px; }
.qrcode .code .qrcode_text .text span{font-size:24px;}
.qrcode .code .qrcode_text .text p{ font-size:18px; }
.qrcode .code .qrcode_pic{ display: block; width:90%; height: auto; margin:20px auto 0; }


/*关于房东网*/
.aboutus{width:100%; height: 720px; background: url(../image/aboutbg.jpg) no-repeat center; background-size:100% 100%; }
.aboutus img.logo2{ position: absolute; top:-58px; left:50%; margin-left:-58px; width: 115px;height: 115px; z-index: 1;}
.aboutus span.yellowblock{ display: block; width:20%; height: 80px; position: absolute; top:-40px; right:0; background: #f8cd44; }
.aboutus .main_tit{ width: 100%; padding:70px 0 20px; text-align: center; }
.aboutus .main_tit h2{ font-size:46px; line-height: 60px; font-weight: normal; color:#fff; }
.aboutus .main_tit h4{ font-size:24px; line-height: 30px; font-weight: normal; color:#ffea00; }
.aboutus .about_cont{ width: 100%; margin:20px auto; }
.aboutus .about_cont h3{ text-align: left; font-size:30px; line-height: 40px; font-weight: normal; color:#fff; }
.aboutus .about_cont span.line{ width: 20%; height: 2px; display: block; background:#f8cd44; margin-top:20px; float:left; }
.aboutus .about_cont .cont_text{ width: 100%; overflow: hidden; margin-top:40px; }
.aboutus .about_cont .cont_text p{ font-size: 16px; line-height: 30px; color:#fff;}

/*视频简介*/
.about_video{ position: relative; margin:100px auto; overflow: hidden; }
.about_video .video_box{ width:44%; height: 270px; margin:0 3%; float:left; background: #000; }
.about_video video{ width:100%; height: 270px; margin: 0 auto; display: block;}
.about_video .about_text{ width:50%; height: 270px; float: right; background:#f5f5f5 url(../image/line.jpg) 100% bottom no-repeat; border-radius: 5px; }
.about_video .about_text .text_cont{ display: block; height: 80%; margin:5% 20px 5%; overflow-y: auto; }
.about_video .about_text p{ font-size:14px; line-height: 26px; color:#009944; }

/*房事家事服务模块*/
.serve{position: relative;  overflow: hidden; padding:50px 0; }
.bgg{background:#efefef;}
.serve .tip{ position: absolute; top:10px; left:10%; display:block; width:72px; height: 75px; z-index: 2;}
.title{ text-align: center; margin:20px auto; }
.title h3{ font-weight:normal; position:  font-size:40px font-weight:normal; color:#fff; line-height: 50px; font-size: 36px; color:#009944; }
.title span.shortline{margin:20px auto; display: block; width:60px; height: 4px; background: #009944; position: relative;}
.title span.shortline:after{ content: ""; width: 30px; height: 4px; position: absolute; top:0; left:0; background: #f8cd44;z-index: 2; }
.serve ul{ width: 90%; overflow: hidden; margin:60px auto 0; padding: 20px 0; }
.serve ul li{ float: left; width:33.33%; text-align: center; padding:20px; }
.serve ul li div{ display: block; width:70%; height: auto; margin:0 auto; position: relative; box-shadow: 0 0 20px rgba(0,0,0,.5); }
.serve ul li img{ width: 100%; height: auto; display: block; }
.serve ul.fang li div:before{ position:absolute; content: ""; display: block; width:110px; height: 110px; top:-30px; right:-30px;  background: url('../image/tranqualug.png') no-repeat; }
.serve ul.fang li div:after{ position:absolute; content: ""; display: block; width:110px; height: 110px; bottom:-30px; left:-30px;  background: url('../image/tranqualdg.png') no-repeat; }
.serve ul.jia li div:before{ position:absolute; content: ""; display: block; width:110px; height: 110px; top:-30px; right:-30px;  background: url('../image/tranqualuw.png') no-repeat; }
.serve ul.jia li div:after{ position:absolute; content: ""; display: block; width:110px; height: 110px; bottom:-30px; left:-30px;  background: url('../image/tranqualdw.png') no-repeat; }

/*招商*/
.zhaoshang{ position: relative; width:100%; height: 420px; background: url('../image/zsbg.jpg') no-repeat; margin-top:80px;  }
.zhaoshang .wrapbox{ position: relative; }
.zhaoshang .phone{ position: absolute; top:-60px; right:3%; width:360px; height: 120px; border-radius: 5px;  padding:20px 10px; z-index: 1; }
.zhaoshang .phone span{ font-size:28px; color:#009944; line-height: 36px; display: block; }
.zhaoshang .phone span.up{ margin-left:30px; }
.zhaoshang .phone span b{ font-weight: normal; font-size:20px; }
.zhaoshang .phone:after{ content: ""; display: block; position:absolute; top:0; left:0; width:100%; height:120px; background:#f8cd44; border-radius: 10px;  z-index: -1; transform: skew(-20deg); -o-transform:skew(-20deg); -moz-transform:skew(-20deg); -webkit-transform:skew(-20deg);}
.zhaoshang .zs{ position: relative; width:80%; height: 400px;  margin:0 auto; padding:125px 0; line-height: 50px; }
.zhaoshang .zs:before{ content: ""; position: absolute; top:50px; left: 0; width:52px; height: 47px; background: url('../image/quatl.png') no-repeat; }
.zhaoshang .zs:after{ content: ""; position: absolute; bottom:50px; right: 0; width:52px; height: 47px; background: url('../image/quatr.png') no-repeat; }
.zhaoshang .zs b{ float: left; color:#fff; font-size:20px; line-height: 30px; font-weight: normal; line-height: 50px; }
.zhaoshang .zs p{ font-size:30px; color:#fff; text-align: left;  width: 100%; overflow: hidden; line-height: 60px;}
.zhaoshang .zs p.down{ text-align: right; }


/*底部*/
.footer{ background: #333; padding:20px 0; text-align: center; color:#fff; }
.footer span{ font-size:14px; }


/* 客服置顶 */
.goTop{ position: fixed; right: 0; bottom: 20px; z-index: 999; }
.goTop li{ width: 50px; height: 50px; margin-bottom: 5px; border-radius: 5px; }
.goTop li a.kicon{ display: block; width: 50px; height: 50px; border-radius: 5px; background: #f8cd44 url('../image/icons.png') -3px -11px no-repeat; line-height: 110px; overflow: hidden;  color:#fff; font-size:16px; padding:4px 9px;}
.goTop li a.kicon:hover{ background: #e3b41d; line-height: 20px; }
.goTop li .cd-top { display: inline-block;  height: 50px; width: 50px;  border-radius:5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); 
  /* image replacement properties */
  overflow: hidden; text-indent: 100%; white-space: nowrap; background: rgba(248,205,68,1) url(../image/icons.png) no-repeat -3px -62px;  visibility: hidden; opacity: 0; -webkit-transition: all 0.3s;  -moz-transition: all 0.3s;  transition: all 0.3s;}
.goTop li .cd-top.cd-is-visible { visibility: visible; opacity: 1;}
.goTop li .cd-top.cd-fade-out { opacity: 1;}
.goTop li .no-touch .cd-top:hover { background-color: #e3b41d; opacity: 1;}
.goTop li a:hover{ background-color: #e3b41d; }


/* 以下是响应 */

@media screen and (max-width:1200px){
.wrapbox{ width: 100%; padding:0 20px; }
.serve ul{ width:100%; }
.mybanner img.bban{ display: none;  }
.mybanner img.sban{ display: block;  }


@media screen and (max-width:1024px){
.qrcode .code .qrcode_text .text{ margin-top:0; }
.qrcode .code .qrcode_text .text h3{ font-size: 30px; line-height: 30px; }
.qrcode .code .qrcode_text .text p{ line-height: 26px; }
}


@media screen and (max-width:768px){
.qrcode .code{ width:100%; }
.qrcode .code .qrcode_text{ width:70%; margin:0 auto; }
.qrcode .code .qrcode_text img{ width:25%; }
.qrcode .code .qrcode_text .text{ padding-left:28%; }
.qrcode .code{ margin:80px auto 0; }
.qrcode .code .gzhpic{ margin-bottom:80px; }
.about_video{ margin:60px auto; }
.about_video .video_box{ width:100%; margin:0 auto; height: auto;}
.about_video video{ height: auto; }
.about_video .about_text{ width:100%; margin-top:30px; background-size: 100% 5px ;}
.serve ul li{ padding:0; }
.aboutus{ height:900px; }
.zhaoshang .zs{ width:90%; }
.zhaoshang .zs p.down{ text-align: left; }
.zhaoshang .zs:after{bottom:10px;}
.about_video .about_text p{ font-size:20px; line-height: 30px; }
.about_video .about_text{ height: auto; }
.about_video .about_text .text_cont{ height: auto; overflow: hidden; }
}

@media screen and (max-width:600px){
.qrcode .code .qrcode_text{ width:100%; }
.qrcode .code .qrcode_text .text{ padding-left:0; text-align: center; margin-bottom:120px; }
.qrcode .code .qrcode_text img{ top:140px; width:120px; margin-left:-60px; left:50%; }
.aboutus .about_cont h3{ font-size:24px; }
.aboutus .about_cont span.line{ width:50%; }
.aboutus{ height:950px; }
.zhaoshang .phone{ right:50%; margin-right:-180px; }
.serve .tip{ width:40px; height: auto; }
}

@media screen and (max-width:480px){
.topbar{ height: 60px; }
.topbar img.logo{ margin-top:8px; height: 44px; }
.topbar b{ font-size:18px; line-height: 60px; }
.qrcode .code{ margin:40px auto 0; }
.aboutus img.logo2{ height: 90px; width:90px; margin-left:-45px; top:-45px; }
.aboutus .main_tit{ padding:50px 0 0; }
.aboutus .main_tit h2{ font-size:36px; }
.aboutus .about_cont .cont_text p{ font-size:14px; }
.zhaoshang .zs:before,.zhaoshang .zs:after{ display: none; }
.zhaoshang .zs{ padding:70px 0; }
.zhaoshang .phone:after{ transform: skew(0deg); -o-transform:skew(0deg); -moz-transform:skew(0deg); -webkit-transform:skew(0deg); }
.serve ul.jia li div:before, .serve ul.jia li div:after, .serve ul.fang li div:before, .serve ul.fang li div:after{ display: none; }
.zhaoshang{ height: 340px; }
.zhaoshang .phone{ width:90%; margin-right:-46%; }
.zhaoshang .phone span.up{ margin-left:0; }
.zhaoshang .zs p{ font-size: 20px; line-height: 50px; }
.about_video .about_text p{ font-size:16px; line-height: 26px; }

}


@media screen and (max-width:414px){
	.qrcode .code .qrcode_text .text p{ font-size:16px; }
.aboutus{ height: 1100px; }
}


@media screen and (max-width:375px){
.qrcode .code .qrcode_text{ padding:0; }
.qrcode .code .qrcode_text .text{ padding-bottom:30px; }
.aboutus{ height: 1200px; }
.serve ul{ margin:40px auto 0; }
.serve ul li div{ width: 85%; box-shadow: 0 0 10px rgba{0,0,0,.3} }
.zhaoshang{ margin-top:40px; }
.zhaoshang .phone{ top:-50px; }
.zhaoshang .phone span{ font-size:20px; line-height: 30px; }
.zhaoshang .phone:after{ height: 100px; }

}

@media screen and (max-width:320px){
.wrapbox{ padding:0 10px; }
.aboutus{ height:1250px; }
.about_video{ margin:40px auto; }
.serve .tip{ display: none; }


	
}

