@charset "utf-8";
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,table,td,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,caption,tbody,tfoot,thead,tr,th,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video,textarea,input{margin:0;padding:0;border:0;outline:none 0;vertical-align:baseline; font-weight:normal; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{vertical-align:baseline;text-decoration: none;color:#404040; background: transparent; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s;}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select,img{vertical-align:middle;}
button, input, select, textarea { font-family: inherit; font-size: 100%;}
/* a,img { -webkit-touch-callout: none;}*/
strong,b { font-weight: bold;}
i,em { font-style: normal;}
ul,ol,li,dl,dt,dd { list-style-type: none;}
img{ max-width: 100%; box-sizing: border-box; height:auto; border:none;}
html {height:100%;font-family:"Microsoft YaHei","Helvetica","Helvetica Neue",sans-serif; line-height: 1; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;}
body{min-height:100%; font-size: 16px; color:#505050; letter-spacing: 1px;}
p{ line-height: 1.5;}

/* 清除浮动 */
.clearfix:after { display:block;clear:both;content:"";visibility:hidden;height:0}
.clearfix { *zoom:1;}
q:before,q:after{content: ""}
.clear { clear:both;}
.none{ display:none;}

/* 省略号 */
.ellipsis{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/*重置*/
input,select,textarea{-webkit-appearance:none;outline:none;}
input[type='checkbox']{ -webkit-appearance:checkbox;}
input[type='radio']{ -webkit-appearance:radio;}
:-moz-placeholder { color: #c8c8c8;}
::-webkit-input-placeholder { color:#c8c8c8;}
:-ms-input-placeholder{ color: #c8c8c8;}
input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{-webkit-appearance: none;appearance: none;-moz-appearance:none;margin: 0;}
input[type="number"]::-moz-outer-spin-button,input[type="number"]::-moz-inner-spin-button{-webkit-appearance: none;appearance: none;-moz-appearance:none;margin: 0;}
input[type="number"]::outer-spin-button,input[type="number"]::inner-spin-button{-webkit-appearance: none;appearance: none;-moz-appearance:none;margin: 0;}
input::-webkit-search-cancel-button {display: none;}
input::search-cancel-button {display: none;}
input::-moz-search-cancel-button {display: none;}

/*公共*/
.rel{ position:relative;}
.pr{ position:absolute; right:0; top:0;}
.pl{ position:absolute; left:0; top:0;}
.pd0{padding:0;}
.fs0{ font-size: 0;}
.tc{ text-align: center;}
.tl{ text-align: left;}
.tr{ text-align: right;}
.cn{ font-family:"Microsoft YaHei","Helvetica","Helvetica Neue";}/*"STHeiTi",*/
.en{ font-family:"Helvetica Neue","Helvetica";}
.fl{ float:left;}
.fr{ float:right;}
.main{ position: relative; width: 1180px; margin: 0 auto;}
.animate{ -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s;}
@media screen and (max-width: 1200px){
    .main{ width: 820px;}
}
@media screen and (max-width: 820px){
    .main{ width: 90%;}
}

.logo{ width: 200px;}

/*头部*/
#header{ height: 100px; box-shadow: 0px 4px 24px 0 rgba(67, 57, 49, 0.1); line-height: 100px; overflow: hidden;}
#nav ul{ margin-left: 40px; font-size: 0;}
#nav ul li{ display: inline-block; margin: 0 16px;}
#nav ul li a{ font-size: 16px;}
#nav ul li a:hover,
#nav ul li.cur a{ color: #c1a18d;}
#header .search{ height: 20px; margin-top: 40px; font-size: 14px; border-left: 2px solid #ebebeb;}
#header .search-box{ opacity: 0; width: 0; height: 22px; line-height: 22px; color: #34495e;}
#header .search.cur .search-box{ opacity: 1; width: 144px; padding-left: 16px;}
#header .search .search-icon{ width: 22px; height: 22px; margin-left: 16px; background: url("./images/search.png") no-repeat center; background-size: 100%; cursor: pointer;}
#header .search .cancel{ display: none;}

@media screen and (max-width: 1200px) {
    #header .main{ width: 90%;}
    #nav{ opacity: 0; visibility: hidden; float: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; height: 0; z-index: 1200; overflow: hidden;}
    #header.cur #nav,
    #header.cur .search{ opacity: 1; visibility: visible;}
    #header.cur #nav{ height: 100%;}
    #header .nav-icon{ width: 40px; height: 40px; margin-top: 30px; background: url("./images/nav-icon.png") no-repeat center; background-size: 100%; cursor: pointer;}
    #nav ul{ padding: 5% 0; text-align: center; position: absolute; left: 0; top: 0; z-index: 10; width: 100%; height: 100%; margin: 0; background-color: #fff;}
    #nav ul li{ opacity: 0; display: block; margin: 0; line-height: 50px; -webkit-transform: translate(80px); transform: translate(80px);}
    #header.cur #nav ul li{ opacity: 1; -webkit-transition: all .6s; transition: all .6s; -webkit-transform: translate(0); transform: translate(0);}
    #header .search{ opacity: 0; visibility: hidden; position: fixed; bottom: 30%; left: 0; right: 0; z-index: 1200; width: 200px; margin: 0 auto; border: 0; line-height: normal;}
    #header .search-box{ width: 144px; margin-left: 5px; padding-left: 5px; opacity: 1; border-bottom: 1px solid #c1a18d;}
    #header .search.cur .search-box{ width: 144px; padding-left: 5px;}
    #header .search .search-icon{ float: left; margin-left: 0;}
    #header .close{ position: absolute; left: 0; top: 0; z-index: 10; width: 65px; height: 65px; background: url("./images/close.png") no-repeat center; background-size: 45%; cursor: pointer;}
}
@media screen and (max-width: 1200px) {
    #header{ text-align: center;}
    #header .logo{ float: none; display: inline-block;}
    #header .nav-icon{ position: absolute; top: 0; left: 0;}
    #header .search{ position: absolute; top: 0; left: 100%; z-index: 0; opacity: 1; visibility: visible; width: 100%; height: 100px; line-height: 100px; font-size: 18px; background-color: #fff; -webkit-transition: all .3s; transition: all .3s; -webkit-transform: translate(-36px); transform: translate(-36px);}
    #header .search.cur{ left: 0; -webkit-transform: translate(0); transform: translate(0);}
    #header .search .search-icon,
    #header .search-box{ margin-top: 32px;}
    #header .search .search-icon{ width: 36px; height: 36px;}
    #header .search-box{ width: 0; height: 32px; margin-left: 0; padding: 0;}
    #header .search.cur .search-box{ width: 76%; margin-left: 5px; -webkit-transition: none; transition: none;}
    #header .search .cancel{ display: none; color: #c1a18d; cursor: pointer;}
    #header .search.cur .cancel{ display: block;}
}
@media screen and (max-width: 640px) {
    #header{ height: 60px; line-height: 60px;}
    .logo{ width: 180px;}
    #header .nav-icon{ width: 30px; height: 30px; margin-top: 15px;}
    #header .search{ height: 60px; line-height: 60px; font-size: 14px; -webkit-transform: translate(-22px); transform: translate(-22px);}
    #header .search .search-icon,
    #header .search-box{ margin-top: 18px;}
    #header .search .search-icon{ width: 22px; height: 22px;}
    #header .search-box{ height: 20px;}
}

/*主体*/
.com-more{ display: inline-block; position: relative; padding-bottom: 6px; font-size: 14px; color: #2bb9d2;}
.com-more:after{ content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: #2bb9d2;}
.com-more:hover:after{ -webkit-animation: line .6s; -moz-animation: line .6s; animation: line .6s;}
@-webkit-keyframes line {
    10%{ width: 0;}
    100%{ width: 100%;}
}
@-moz-keyframes line {
    10%{ width: 0;}
    100%{ width: 100%;}
}
@keyframes line {
    10%{ width: 0;}
    100%{ width: 100%;}
}
/*banner*/
#banner{ position: relative; overflow: hidden;}
#banner img{ width: 100%;}
#banner ul,
#banner ul li{ position: relative; float: left; height: 100% !important;}
#banner .swiper-pagination{ position: absolute; left: 0; bottom: 4%; width: 100%; font-size: 0; text-align: center;}
#banner .swiper-pagination-bullet,
#banner .swiper-pagination-switch{ display: inline-block; width: 30px; height: 5px; margin: 0 5px; border-radius: 0; opacity: 0.5; background-color: #f4f0ed; cursor: pointer; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s;}
#banner .swiper-pagination-bullet-active,
#banner .swiper-active-switch{ opacity: 1;}
#banner .ctrl{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: 0 auto;}
#banner .prev,
#banner .next{ opacity: .7; position: absolute; top: auto; bottom: 54.67%; width: 30px; height: 50px; margin: 0; background-size: 100%; cursor: pointer;}
#banner .prev:hover,
#banner .next:hover{ opacity: 1;}
#banner .prev{ left: 0; background: url("./images/index/prev.png") no-repeat center;}
#banner .next{ right: 0; background: url("./images/index/next.png") no-repeat center;}
/*房产信息*/
.house-info ul.item-cont{ text-align: center; font-size: 0; letter-spacing: normal;}
.house-info ul.item-cont li{ position: relative; display: inline-block; width: 560px; margin: 45px 60px 45px 0; box-sizing: border-box; padding: 0 16px 20px; border: 3px solid #f4f0ed; letter-spacing: 1px; vertical-align: top;}
.house-info ul.item-cont li:nth-of-type(even){ margin-right: 0;}
.house-info ul.item-cont li:before{ content: ''; position: absolute; left: 8px; top: -3px; width: 43.75%; height: 3px; background-color: #fff; z-index: 0;}
.house-info .image{ position: relative; width: 42%; height: 200px; margin: -8% 4% 0 0; overflow: hidden; box-shadow: 4px 4px 0 0 #c1a18d; z-index: 10;}
.house-info .image a{ display: block; font-size: 0;}
.house-info .image img{ width: 100%;}
.house-info .image:hover a{ -webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1);}
.house-info .text{ overflow: hidden;}
.house-info .text h3{ padding-top: 20px; font-size: 22px; font-weight: bold; text-align: left;}
.house-info .text h3 a{ display: block; color: #000;}
.house-info .text h3 a:hover{ color: #bda08d;}
.house-info .text .info{ padding-top: 10px; font-size: 0; text-align: left;}
.house-info .text .info span{ display: inline-block; padding: 10px 28px 0 0; font-size: 16px; color: #404040;}
.house-info .text .info span:last-of-type{ padding-right: 0;}
.house-info .text .tags{ padding-top: 20px; font-size: 0; text-align: left;}
.house-info .text .tags span{ display: inline-block; max-width: 60px; margin-right: 10px; padding: 0 6px; font-size: 14px; color: #c1a18d; line-height: 20px; border: 1px solid #c1a18d;}
.house-info .text .tags span:last-of-type{ margin-right: 0;}

@media screen and (max-width: 1200px) {
    .house-info ul.item-cont li{ margin: 30px 0;}
}
@media screen and (max-width: 640px) {
    .house-info ul.item-cont li{ display: block; width: auto; margin: 60px 0;}
    .house-info .image{ height: auto;}
    .house-info .text h3{ font-size: 20px;}
    .house-info .text .info span{ font-size: 14px;}
    .house-info .text .tags span{ font-size: 12px;}
}
@media screen and (max-width: 520px) {
    .house-info ul.item-cont li{ margin: 20px 0; padding: 0 4% 5%;}
    .house-info ul.item-cont li:before{ display: none;}
    .house-info .image{ float: none; width: auto; margin: 5% 0 0 0; box-shadow: none;}
}

/*尾部*/
#footer{ padding: 60px 0 10px; border-top: 15px solid #f4f0ed;}
#footer h2{ font-size: 16px; color: #43403d;}
#footer p{ line-height: 1.7;}
#footer .item{ float: left; margin-right: 100px; font-size: 14px; color: #78919b;}
#footer .item a{ color: #78919b;}
#footer .item a:hover{ color: #000;}
#footer .item:first-of-type{ width: 300px;}
#footer .item:last-of-type{ width: 375px; margin-right: 0;}
#footer .introduce{ padding-top: 30px;}
#footer .protect{ margin: 32px 0 16px;}
#footer .protect p{ width: 195px; padding-top: 10px;}
#footer ul{ padding-top: 35px;}
#footer ul li{ padding-bottom: 20px;}
#footer .item:last-of-type p{ padding-top: 30px;}
#footer .item:last-of-type .mail{ display: inline-block; margin-top: 35px; font-size: 18px; color: #00bcd5;}
#footer .item:last-of-type .mail:hover{ text-decoration: underline;}
#footer .return-top{ display: none; position: fixed; bottom: 100px; right: 100px; z-index: 1000; width: 60px; height: 60px; box-shadow: 0 0 10px rgba(0,0,0,.3); border-radius: 100%; background: url("./images/return_top.png") no-repeat center #fff; cursor: pointer;}
#footer .return-top:hover{ box-shadow: 0 0 15px rgba(0,0,0,.3);}
#footer .icp-info{ padding-top: 60px; text-align: center;}
#footer .icp-info p{ line-height: 18px; font-size: 12px; color: #999;}
#footer .icp-info p a{ color: #999;}
#footer .icp-info p a:hover{ color: #333;}
#footer .icp-info p.gongan a{ padding-left: 20px; background: url(./images/record.jpg) no-repeat 0 center; background-size: 18px;}

@media screen and (max-width: 1200px) {
    #footer{ padding: 8% 0 2%;}
    #footer .return-top{ right: 4%;}
    #footer .item:last-of-type p{ padding-top: 10px;}
}
@media screen and (max-width: 820px) {
    #footer .item{ margin-right: 10%;}
}
@media screen and (min-width: 640px) and (max-width: 820px) {
    #footer .item{ height: 250px;}
}
@media screen and (max-width: 640px) {
    #footer .protect{ margin: 24px 0 16px;}
    #footer ul{ padding-top: 20px;}
    #footer .item:first-of-type,
    #footer .item:last-of-type{ width: auto;}
    #footer .item:first-of-type{ margin-right: 0;}
    #footer .icp-info p{ font-size: 10px;}
    #footer .return-top{ bottom: 40px; width: 40px; height: 40px; background-size: 36%;}
}