/* CSS Document */

.hos .tit h1,
.hos .tit .guide a,
.hos .left .leftTop,
.hos .left .leftCon .infoItem .icon,
.hos .right .rtit .t2,
.contrastList .con .info span,
.hos .mapWalk h4,
.hos .mapWalk dt b,.hos .rbox .contrastList .con .info .i a
{ background-image: url(../images/img_icon_hos.gif); background-repeat: no-repeat; }

.hos{ padding: 24px 0; font: 12px/1.5 'Microsoft YaHei';}
.hos .tit{ background: #F9F9F9; padding: 24px 0 0;}
.hos .tit h1{ font:30px/1.5 'Microsoft YaHei'; _font-weight: bold; padding: 0 52px 12px; background-position: 16px 10px; *background-position: 16px 8px; border-bottom: #F873A1 2px solid; color: #333;}
.hos .tit .guide{ padding: 8px 0 6px; font: 16px/1.5 'Microsoft YaHei'; text-align: right;}
.hos .tit .guide a{ display: inline-block; vertical-align: top; padding: 0 18px; color: #333; background-position: 0 -49px; _background-position: 0 -51px;}
.hos .tit .guide .now{  color: #e34e83;}
.hos .tit .guide .index{ background: none; }
.hos .left{ float: left; width: 286px; display: inline; margin: 36px 40px 0 0; box-shadow: 1px 1px 1px #EDEDED;}
.hos .left .leftTop{ height: 18px; overflow: hidden; background-position: 0 -77px; background-color: #F9F9F9;}
.hos .left .leftCon{ background-color: #F9F9F9; border-left: #EDEDED 1px solid; padding: 0 16px;}
.hos .left .leftCon .pic{ padding: 12px 0 0;}
.hos .left .leftCon .pic img{ width: 130px; height: 130px;}
.hos .left .leftCon .type{ padding: 27px 0 0;}
.hos .left .leftCon .type img{ margin: 0 10px 0 0;}
.hos .left .leftCon .info{ padding: 25px 0 18px; border-bottom: #DCDCDC 1px solid; line-height: 2;}
.hos .left .leftCon .infoItem{ padding: 0 0 6px;}
.hos .left .leftCon .infoItem .icon{ float: left; width:24px; height: 24px; overflow:hidden; display: inline; margin-top: 3px;}
.hos .left .leftCon .infoItem .i1{ background-position: 0 -94px;}
.hos .left .leftCon .infoItem .i2{ background-position: 0 -118px;}
.hos .left .leftCon .infoItem .i3{ background-position: 0 -142px;}
.hos .left .leftCon .infoItem .i4{ background-position: 0 -166px;}
.hos .left .leftCon .infoItem .i5{ background-position: 0 -190px;}
.hos .left .leftCon .infoItem p{ padding: 0 0 0 24px; font-size: 14px;}
.hos .left .leftCon .infoItem p b{ font-weight: normal; font-size: 14px;}
.hos .left .leftCon .infoItem p b cite{ color: #76a3de;}
.hos .left .leftCon .infoItem p a{ color: #999;}
.hos .left .leftCon .grade{ padding: 25px 0 32px; border-bottom: #DCDCDC 1px solid;}
.hos .left .leftCon .grade dt{ font-size: 16px; color: #333;}
.hos .left .leftCon .grade dt span{ float: right; font-size: 12px; color: #999; line-height: 2;}
.hos .left .leftCon .grade dt span a{ color: #92c637; margin: 0 3px;}
.hos .left .leftCon .grade dd{ font-size: 14px; padding: 8px 0 0;}
.hos .left .leftCon .grade dd p{ padding: 10px 0 0;}
.hos .left .leftCon .grade dd p i{ color: #f39800; margin: 0 3px 0 0; font-style: normal;}
.hos .left .leftCon .grade .gradeBar{ width: 100px; display: inline-block; overflow: hidden; vertical-align: top; height: 18px; font-size: 12px; background: url(../images/img_hos_star.gif) 0 0 repeat-x; margin: 1px 32px 0 4px;}
.hos .left .leftCon .grade .gradeNow{ background: url(../images/img_hos_star.gif) 0 -18px repeat-x; display: inline-block; overflow: hidden; vertical-align: top; height: 18px; font-size: 12px; }
.hos .left .leftCon .btn{ padding: 32px 0;}
.hos .left .leftCon .btn a{ display: block; height: 40px; border-radius: 3px; font: 16px/40px 'Microsoft YaHei'; color: #FFF;text-align: center; background: #76A3DE; cursor: pointer;}
.hos .left .leftCon .btn a:hover{ color:#FFF !important; text-decoration:none; opacity:0.75; filter:alpha(opacity=75);}
.hos .left .leftCon .adbtn{ padding: 0;}
.hos .left .leftCon .adbtn a {background:#76A3DE url(http://image.39.net/zx/case/images/ggw_03.png) 60px center no-repeat;}

.hos .right{ float: left; width: 674px;}
.hos .right .rbox{ padding: 24px 0 0;}
.hos .right .rtit{ height: 40px; border-bottom: #DDDDDD 2px solid;}
.hos .right .rtit h2{ float: left; display:inline; font: 20px/38px 'Microsoft YaHei'; border-bottom: #E34E83 2px solid; font-weight: normal; _font-weight: bold; color: #333; padding: 0 9px 0 3px; margin: 2px 12px 0 0; _position: relative; _top: 2px;}
.hos .right .rtit .t1{ float: left; display: inline; color: #999; margin: 14px 0 0;}
.hos .right .rtit .t1 a{ margin: 0 3px;}
.hos .right .rtit .t1 .a1{ color: #76a3de;}
.hos .right .rtit .t1 .a2{ color: #e34e83;}
.hos .right .rtit .t2{ float: right; display: inline; padding: 0 0 0 18px; background-position: 0 -217px; margin: 12px 0 0;}
.hos .right .rtit .t2 a{ color: #999;}
.hos .right .rtit .t3{ float: right; display: inline; color: #999; margin: 12px 0 0;}
.hos .right .rtit .t3 a{ color: #e34e83;}
.hos .right .rbox .intro { font-size: 14px; line-height: 26px; padding: 15px 0;}
.hos .right .rbox .team{ padding: 0 0 15px;}
.hos .right .rbox .team dl{ float: left; display: inline; width: 224px; height: 100px; overflow:hidden; padding: 30px 0 0;}
.hos .right .rbox .team dl dt{ float: left; display: inline;}
.hos .right .rbox .team dl dt img{ width: 100px; height: 100px;}
.hos .right .rbox .team dl dd{ line-height: 2; padding: 0 0 0 110px; color: #333;}
.hos .right .rbox .team dl dd a{ font-size: 14px;}
.hos .right .rbox .team dl dd img{ vertical-align: -1px; _vertical-align: 1px; _margin: 6px 0 8px;}
.hos .right .rbox .cost{ padding: 0 0 15px; margin: 20px 0 0; position: relative;}
.hos .right .rbox .cost dl{ position: relative; padding: 0 0 0 110px; border-bottom: #D9D9D9 1px dashed;}
.hos .right .rbox .cost dl dt{position: absolute; left: 0; top: 0; width: 110px; height: 100%; background: #F9F9F9;}
.hos .right .rbox .cost dl dt strong{ position: absolute; left: 0; top: 50%; margin: -12px 0 0; width: 100%; text-align: center; font-size: 16px; color: #333;}
.hos .right .rbox .cost dd{ font-size: 14px; padding: 6px 0;}
.hos .right .rbox .cost dd span{ display: inline; float: left; padding: 6px 0 6px 36px; width: 150px;}
.hos .right .rbox .cost dd span a{ color: #666;}
.hos .right .rbox .cost dd span cite{ display: inline-block; vertical-align: top; margin: 2px 0 0 4px; _margin: -2px 0 0 4px; height: 18px; width: 18px; background:url(../images/icon/hos_icon_cost.gif) center center no-repeat;}
.hos .right .rbox .cost .costBox{ position: absolute; z-index: 1; top: 0; left: 0; width: 195px; height: 66px; display: none; background: #fff; _margin-top: -4px;}
.hos .right .rbox .cost .costBg{ background:url(../images/bg_hos_cost.gif) 0 0 no-repeat; height: 66px;}
.hos .right .rbox .cost .costBg p{ color: #333; line-height: 2; padding: 8px 0 0 12px;}
.hos .right .rbox .cost .costBg p cite{ color: #999;}
.hos .right .rbox .cost .costBg p cite b{ color: #F60; font-weight: normal;}
.hos .rbox .serve{ width: 100%; overflow:hidden; padding: 20px 0 15px;}
.hos .rbox .serve ul{ width: 800px;}
.hos .rbox .serve ul li{ float: left; display:inline; width:300px; padding: 0 74px 0 0;}
.hos .rbox .serve ul li img{ width:300px; display:block; height: 170px;}
.hos .rbox .serve ul li p{ line-height: 30px; background:#F7F7F7; padding: 0 8px; height: 30px; overflow:hidden;}
.hos .rbox .serve ul li p a{ color: #666;}
.hos .rbox .contrast{ width: 100%; overflow:hidden; padding: 20px 0 15px;}
.hos .rbox .contrast ul{ width: 800px;}
.hos .rbox .contrast ul li{ float: left; display:inline; width:252px;}
.hos .rbox .contrast ul li .pic{ padding: 0;}
.hos .rbox .contrast ul li p{ padding: 5px 10px 0 0; font-size: 14px; clear: left;}
.hos .rbox .contrast ul li p .name{ font-size:16px; color: #666;}
.hos .rbox .contrast ul li p img{ vertical-align: -3px; _margin: 3px 0;}
.hos .rbox .serveList{}
.hos .rbox .serveList li{ border-bottom:#E8E8E8 1px dashed;}
.hos .rbox .serveList .pic{ padding: 24px 0;}
.hos .rbox .serveList .con{ padding: 20px 0 16px 200px;}
.hos .rbox .serveList .con h3{ font: 18px/1.5 'Microsoft YaHei';}
.hos .rbox .serveList .con h3 a{ color: #333;}
.hos .rbox .serveList .con .p1{ line-height: 2; padding: 20px 0 18px;}
.hos .rbox .serveList .con .p2{ line-height: 2;}
.hos .rbox .serveList .con .p2 b{ font-weight: normal; color: #76a3de;}
.hos .rbox .serveList .con .p2 span{ float: right;}
.hos .rbox .serveList .con .p2 span a{ color: #e34e83;}
.hos .rbox .contrastList{ padding: 0 0 24px;}
.hos .rbox .contrastList li{ border-bottom:#E8E8E8 1px dashed;}
.hos .rbox .pic{ float: left; display:inline; width:192px; padding: 27px 0;}
.hos .rbox .pic dl{ float:left; display:inline; width:86px; margin:0 10px 0 0;}
.hos .rbox .pic dt{border: 1px #EEE solid; text-align:center; height:112px; line-height: 112px;}
.hos .rbox .pic dt img{ max-height: 112px; max-width: 84px; _width: expression(this.offsetWidth>84?'84px':true); vertical-align: middle; display: inline-block;}
.hos .rbox .pic dd{ text-align:center; padding: 3px 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background:#FA9DBD; color: #FFF;}
.hos .rbox .pic dd a{ color:#FFF;}
.hos .rbox .pic dd a:hover{ color:#FFF !important;}


/*.hos .rbox .contrastList .pic img{ width:200px; display:block; height: 130px;}*/
.hos .rbox .contrastList .con{ padding: 27px 0 16px 196px;}
.hos .rbox .contrastList .con .caption{ color: #999; height: 24px;}
.hos .rbox .contrastList .con .caption .doc{ float: right; margin: 2px 0 0;}
.hos .rbox .contrastList .con .caption .doc a{ font-size: 14px; margin: 2px 0 0;}
.hos .rbox .contrastList .con .caption .name{ font-size:16px;}
.hos .rbox .contrastList .con .caption .name a{ color: #666;}
.hos .rbox .contrastList .con .caption .name img{ vertical-align: -3px; _vertical-align: 0;}
.hos .rbox .contrastList .con .caption .price{ float: left; display: inline; color: #f39800; font-size:16px;}
.hos .rbox .contrastList .con h3{ font: 18px/1.5 'Microsoft YaHei';}
.hos .rbox .contrastList .con h3 a{ color: #333;}
.hos .rbox .contrastList .con p{ line-height: 2; padding: 13px 0 9px;}
.hos .rbox .contrastList .con .info{ height: 18px; overflow: hidden; color: #999;}
.hos .rbox .contrastList .con .info span{ padding: 0 0 0 18px; margin: 0 0 0 32px;}
.hos .rbox .contrastList .con .info .date{ padding: 0; margin: 0; background: none;
}
.hos .rbox .contrastList .con .info .price{ background-position: 0 -347px; margin: 0 0 0 7px; padding: 0 0 0 8px; color: #f39800;
}
.hos .rbox .contrastList .con .info .doc{ background-position: 0 -347px; margin: 0 0 0 7px; padding: 0 0 0 8px;}
.hos .rbox .contrastList .con .info .i{ background: none; float: right;
 margin: 0;}
.hos .rbox .contrastList .con .info .i a{ padding: 0 0 0 18px; margin: 0 0 0 16px; color: #999;}
.hos .rbox .contrastList .con .info .i1{ background-position: 0 -241px;}
.hos .rbox .contrastList .con .info .i2{ background-position: 0 -266px;}
.reviewPrev, .reviewNext{ float:left; width:20px; display:inline; height:120px;  background:url(../images/img_sp.gif) 0 -56px no-repeat;}
.reviewNext{ background-position: -42px -56px;}
.reviewPrev:hover, .reviewNext:hover{ opacity:0.75; filter:alpha(opacity=100);}
.review{ float:left; width: 608px; height:120px; display:inline; overflow:hidden; margin: 0 13px;}
.review ul{ width:9999px;}
.review li{ float:left; width:120px; padding:0 16px; display:inline; }
.review li img{ display:block; width:120px; height:120px;}

/*20140529c*/
.review li span{ display:none;padding:10px;border:1px solid #ccc;background:#fff; position:absolute;z-index:1000}
.review li span img{max-width:600px;width:auto;height:auto; }
/*20140529c  end*/
.hos .introPic{ padding: 15px 0 0;}
.hos .map{ padding: 30px 0 0;}
.hos .mapapi{ float: right; display: inline; width: 320px; height: 260px; overflow: hidden;}
.hos .map p{ padding: 0 350px 0 0; font-size: 14px;}
.hos .map p b{ color: #333; font-size:16px; font-weight: normal;}
.hos .map p span{ font-size: 16px;}
.hos .map p cite{ color: #76a3de;}
.hos .mapWalk{ padding: 36px 0 0; color: #333;}
.hos .mapWalk h4{ font-size: 18px; padding: 0 0 0 25px; background-position: 0 -291px;}
.hos .mapWalk dl{ padding: 24px 0 0; border-bottom: #B2B2B2 1px dashed;}
.hos .mapWalk dt b{ display: inline-block; line-height: 22px; font-size: 14px; padding: 0 15px 0 5px; background-position: right -322px; background-color: #F9F9F9; font-weight: normal;}
.hos .mapWalk dd p{ padding: 14px 0 20px; text-indent:2em; line-height: 26px;}
.gradeBig{ padding: 26px 0 0;}
.gradeBig .btn{ float: right; display: inline; height: 40px; width: 165px; border-radius: 3px; font: 16px/40px 'Microsoft YaHei'; color: #FFF;text-align: center; background: #76A3DE; cursor: pointer; margin: 4px 0 0;}
.gradeBig .btn:hover{ color:#FFF !important; text-decoration:none; opacity:0.75; filter:alpha(opacity=75);}
.gradeBig p{ padding: 0 0 16px; font-size: 18px;}
.gradeBig p i{ color: #f39800; margin: 0 3px 0 0; font-style: normal;}
.gradeBig .gradeBar{ width: 150px; display: inline-block; overflow: hidden; vertical-align: top; height: 20px; font-size: 12px; background: url(../images/img_hos_star2.gif) 0 0 repeat-x; margin: 2px 32px 0 4px; margin: -2px 32px 0 4px;}
.gradeBig .gradeNow{ background: url(../images/img_hos_star2.gif) 0 -20px repeat-x; display: inline-block; overflow: hidden; vertical-align: top; height: 20px; font-size: 12px; }
.hos .gradeList{}
.hos .gradeList li{ padding: 24px 0; border-bottom: #DADADA 1px solid;}
.hos .gradeList li dl{ float: left; display: inline; width: 75px; margin: 3px 0 0;}
.hos .gradeList li dt img{ width: 60px; height:60px;}
.hos .gradeList li dd{ padding: 4px 0 0;}
.hos .gradeList li dd a{ color: #333;}
.hos .gradeList .con{ padding: 0 0 0 85px;}
.hos .gradeList .con .name span{ float: right; color: #999; font-size: 12px;}
.hos .gradeList .con .name a{ color: #333; font-size: 16px;}
.hos .gradeList .con .point{ font-size: 14px;}
.hos .gradeList .con .point span{ margin: 0 32px 0 0;}
.hos .gradeList .con .point b{ font-weight: normal; color: #333;}
.hos .gradeList .con .point i{ color: #f39800; font-style: normal; margin: 0 3px 0 0;}
.hos .gradeList .con p{ line-height: 20px; padding: 12px 0 0;}

.gradeBox{background:rgba(0,0,0,0.15); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26000000,endColorstr=#26000000); padding:4px;  width:560px; border-radius:4px; font: 12px/1.5 'Microsoft YaHei';}
.gradeBox .con{ background:#fff; border-radius:0 0 3px 3px ;}
.gradeBox .pop-tit{ background:#72A5DE; font: 16px/35px 'Microsoft YaHei'; padding:0 0 0 10px; color:#FFF; border-radius:3px 3px 0 0;}
.gradeBox .pop-tit .close-btn{ color:#fff;font-size:20px;  float:right; margin-right:15px; display:inline; font-family:Verdana, Geneva, sans-seri; line-height: 32px;}
.gradeBox .pop-tit .close-btn:hover{ color:#CAE7F7 !important; text-decoration:none;}
.gradeBox .pop-con{ background:#fff; padding:10px 48px 40px; border-radius:0 0 3px 3px ;}
.gradeBox .gradeText{ margin: 10px 0 0; border-top: #DADADA 1px dashed;}
.gradeBox .gradeText dt{ padding: 26px 0 0; font-size: 16px;}
.gradeBox .gradeText dt span{ float: right; font-size: 12px; margin: 4px 0 0;}
.gradeBox .gradeText .text{ padding: 12px 0 0;}
.gradeBox .gradeText .text textarea{ border: #FDDCE8 1px solid; border-radius: 2px; color: #999; padding: 8px; height: 144px; font: 12px/1.5 'Microsoft YaHei'; overflow: auto; width: 444px;}
.gradeBox .gradeText .btn{ padding: 30px 0 0; text-align:center;}
.gradeBox .gradeText .btn a{ display: inline-block; height: 30px; width: 105px; border-radius: 3px; font: 16px/30px 'Microsoft YaHei'; color: #FFF;text-align: center; background: #76A3DE; cursor: pointer; margin: 0 10px;}
.gradeBox .gradeText .btn a:hover{ color:#FFF !important; text-decoration:none; opacity:0.75; filter:alpha(opacity=75);}
.gradeBox .gradeText .btn .cancel{ background-color: #DCDCDC;}
.gradeBox .gradeText .red{ color: #F30;}

.caselist{ padding: 0 0 45px; width: 100%; overflow: hidden;}
.caselist ul{ width: 800px;}
.caselist li{ float:left; width:246px;}
.caselist span{ display: block; clear: left; font-size:16px; padding: 6px 0 0;}
.caselist span a{ color: #666;}
.caselist span img{ vertical-align: -3px; _vertical-align: 0;}
.hos .caselist .pic{ padding: 30px 0 0;}


.error{ font: 24px/1.5 'Microsoft YaHei'; color: #999;}
.error .e1{ padding: 0 0 0 88px; background:url(../images/img_error_case1.gif) 0 center no-repeat; display: inline-block;}
.error .e1 a{ display: inline-block; font:14px/30px 'Microsoft YaHei'; height:30px; background:#76A3DE; border-radius:3px; color:#fff; text-align:center; width:172px;}
.error .e1 a:hover{ opacity:0.75; filter:alpha(opacity=75); color:#FFF !important; text-decoration:none;}
.error .e2{ padding:0 0 0 44px; background:url(../images/img_error_case2.gif) 0 center no-repeat;}

.advk{padding-top:26px; border-top:1px dashed #eee; margin-top:-25px;}
.advk img,.advk iframe{max-width: 100%; display: block; margin: 0 auto;  padding-bottom:45px; }