﻿/* ========== */
/* = BANNER = */
/* ========== */
.banner { position: relative;}
.banner .slick-slide{ position: relative;}
.banner .swiper-button-prev,
.banner .swiper-button-next{ width: 60px; height: 60px; border-radius: 0;}
.banner .swiper-button-prev{ left:4%; background-image:url(../images/sy-6.png);}
.banner .swiper-button-next{ right:4%; background-image: url(../images/sy-7.png);}
.banner .swiper-pagination { bottom: 72px;}
.banner .swiper-pagination .swiper-pagination-bullet { border:1px solid rgba(255,255,255,0);}
.banner .swiper-pagination .swiper-pagination-bullet:before{ background: #FFFFFF;}
.banner .swiper-pagination .swiper-pagination-bullet-active {border:1px solid #ffffff;}
.banner .swiper-pagination .swiper-pagination-bullet-active:before{background: #ffffff;}
.banner .prev-num,
.banner .next-num{ position: absolute; display: block; top: 50%; margin-top: 50px;  margin-top:50px; width: 123px; height: 47px; margin-top: -23px; color: #FFFFFF;}
.banner .prev-num{ left:4%; padding-left: 27px;}
.banner .next-num{ right: 4%; text-align: right; padding-right: 27px;}
.banner-text{ position: absolute; top:50%; margin-top: -70px; left:0; width: 100%; text-align: center; color: #FFFFFF;}
.banner-text span.h2{ font-size: 48px; letter-spacing: 10px;}
.banner-text .cn{ margin-top: 5px; font-size: 18px; letter-spacing: 5px;}
.banner-text .en{ margin-top: 5px; font-size: 14px; text-transform: uppercase; letter-spacing:3px;}
.banner-more{ margin-top:40px; display: inline-block; padding: 12px 50px; letter-spacing:2px; text-transform: uppercase; font-size: 12px; background: rgba(255,255,255,.2); border: 1px solid rgba(255,255,255,.6); color: #FFFFFF;}
.banner-more:hover{ background: rgba(255,255,255,.4);}


/* ========== */
/* = HOME-POINT = */
/* ========== */
.home-point{ position: relative; z-index:1;}
.home-point li{ float: left; width: 20%; border-right: 1px solid #999; text-align: center; }
.home-point li a{ display: block;padding: 22px 10px; min-height: 110px; }
.home-point li:nth-child(5){ border-right: none;}
.home-point li .item{ display: inline-block;}
.home-point li .item img{ float: left; margin-top:3%}
.home-point li .item div{ margin-left: 70px; text-align: left; padding-top:8px;}
.home-point li .item div span{ font-size:36px; line-height: 22px; color: #b48b62;}
.home-point li .item div p{ color: #000; font-size:16px;}
.home-point li:hover img{ animation: tada 1s; -webkit-animation: tada 1s;}


/* ========== */
/* = HOME-TIT = */
/* ========== */
.home-tit{ text-align: center;}
.home-tit .tit{ height: 187px; background: url(../images/home_tit_png.png) top no-repeat; padding-top: 80px;}
.home-tit .tit span{ display: block; font-size:25px; line-height: 30px; color: #000; font-weight:lighter; letter-spacing: 2px; text-transform: uppercase;}
.home-tit .tit p{ font-size: 30px; color: #000; letter-spacing:3px;}
.home-tit .tit h2{ font-size: 30px; color: #000; letter-spacing:3px; font-weight:normal}
.home-tit .des{ margin-top:20px; font-size: 20px; color: #664d02; letter-spacing:3px; font-weight:lighter;}
.home-tit .des span{ position: relative; }
.home-tit .des span:before,
.home-tit .des span:after{ position:absolute; top:50%; content: ""; width: 60px; height: 1px; background: #000;}
.home-tit .des span:before{ left:-75px;}
.home-tit .des span:after{ right:-75px;}
.home-tit .tip{ margin-top: 5px; color: #664d02; letter-spacing:4px; opacity: .8; font-size:14px}

.home-tab { text-align: center; margin:5% 0 3% -2%}
.home-tab span{display: inline-block; margin-left:2%; width:9.111%; line-height: 37px; border: 1px solid #0a2444; color: #0a2444;  cursor:pointer;}
.home-tab span.active{ background: #0a2444; color: #FFFFFF;}


.home-more{ margin: 0 auto; display: block; width: 180px; text-align: center; height: 46px; line-height: 46px; background: #0a2444; color: #FFFFFF; font-size: 12px; letter-spacing: 1px;}
.home-more:hover{ background: #0d3970;}


/* ========== */
/* = HOME-WHOLEHOUSE = */
/* ========== */
.home-wholehouse{  padding:5% 0; background-image: url(../images/whole_house_bg.jpg);}
.home-wholehouse-ul{ margin: 0 -18px 100px;  padding-bottom: 75px; border-bottom: 1px solid #dcdcdc; }
.home-wholehouse-ul li{ margin-top: 30px; padding: 0 18px; float: left; width: 33.333333333%;}
.home-wholehouse-ul li .img{ overflow: hidden;}
.home-wholehouse-ul li span{ margin-top: 40px; display: block; font-size: 18px; color:#000000; letter-spacing: 2px;}
.home-wholehouse-ul li p{ margin-top: 10px; font-size:12px; color: #999999; }
.home-wholehouse-ul li:hover img{ transform: scale(1.05); -webkit-transform: scale(1.05);}
.home-wholehouse-ul li:hover span{ color: #c38e59;}


/* ========== */
/* = HOME-CASE = */
/* ========== */
.home-case{ padding:5% 0 0; background-image:url(../images/sy1-3.jpg)}
.home-case .home-tit .tit p{  color: #FFFFFF;}
.home-case .home-tab span,
.home-case .home-tab a{ border: 1px solid #b48b62; color:#333; font-size:20px}
.home-case .home-tab span.active,.home-case .home-tab span.bjd-3{ background: #b48b62; color:#fff}
.home-case .js-tab-con{ display: none;}
.home-case .js-tab-con.active{ display: block;}

.home-case-list{ margin-left:-2%; margin-top:-2%}
.home-case-list li{ float: left; width:31.333%; margin-left:2%; margin-top:2%}
.home-case-list .item{ display: block; background: #FFFFFF;}
.home-case-list .item .img{ position: relative; overflow: hidden; display: block;}
.home-case-list .item .img-vertical i{ padding-bottom: 67.021277%;}
.home-case-list .item .pop{ position: absolute; bottom:0; left:0; width: 100%; height:0; background: rgba(12,16,33,.8); text-align: center; overflow: hidden;}
.home-case-list .item .pop .con{ display: inline-block; vertical-align: middle; padding:0 20px;}
.home-case-list .item .pop i{ display: inline-block; vertical-align: middle; height: 100%;}
.home-case-list .item .pop p{ margin:0 auto 20px;  max-width: 340px; color: #ffffff; font-size: 12px; line-height: 28px; max-height:84px; overflow: hidden;}
.home-case-list .item .pop span{ display: inline-block; width: 48px; height: 48px; background: url(../images/ico_search.png);}
.home-case-list .item .text{ padding: 15px 32px 25px;}
.home-case-list .item .tit{ padding-right: 90px; position: relative;}
.home-case-list .item .tit span{ display: block; color: #101b26; line-height:26px; font-size: 24px;}
.home-case-list .item .tit i{position: absolute; top:0; right:0; line-height:26px;  background: url(../images/ico_heart.png) no-repeat left; padding-left: 22px; color: #101b26; font-size: 16px; font-style: normal; cursor: pointer;}
.home-case-list .item .des{ margin-top:11%; font-size: 14px;}
.home-case-list .item .des span{ margin: 0 5px;}
.home-case-list .item:hover .img img{ transform: scale(1.05); -webkit-transform: scale(1.05);}
.home-case-list .item:hover .pop{ height: 100%;}
.home-case-list .item:hover .tit span{ color: #b48b62;}
.home-case-list .item:hover .tit i,
.home-case-list .item .tit i.active{ background: url(../images/ico_heart_h.png) left no-repeat; color: #b48b62;}
.home-case-list .item .text1 .tit a{ font-size:18px; color:#333; text-align:center; display:block}
.home-case-list .item .text1 .tit{ padding-right:0; margin-top:3%}
.home-case-list .item .text1{ padding:0}
.home-case1 .home-case-list{ margin-left:-1.5%}
.home-case1 .home-case-list li{ width:23.5%; margin-left:1.5%}

/* ========== */
/* = HOME-ADD = */
/* ========== */
.home-add{ height: 220px; background-image: url(../images/home_add_bg.jpg); padding-top: 82px;}
.home-add img{ margin: 0;}
.home-add .tit{ float: left; width:25.5%; font-size: 24px; line-height: 30px; color: #c8c8c8; font-weight: lighter; letter-spacing: 5px; padding-bottom: 7px; border-bottom: 2px solid #b48b62; text-align: right; padding-bottom: 10px;}
.home-add .tit span{ display: block; text-transform: uppercase;}
.home-add .text{ margin-left:40px; float: left;}
.home-add .text p{ font-size: 18px;  line-height: 30px; letter-spacing:10px; margin-bottom: 10px; color: #c8c8c8;}
.home-add ul{ float: right; width:40%;}
.home-add ul li{ margin-bottom: 20px; float: left; width:50%; text-align: right;}
.home-add ul li a{ display: inline-block; text-align: left; background: url(../images/ico_right.png) left 7px no-repeat; padding-left: 28px; color:#c8c8c8;}
.home-add ul li p{ margin-bottom: 5px; display: block; font-size: 16px;}

/* ========== */
/* = HOME-NEWS = */
/* ========== */
.home-news{ padding:6% 0 0;}
.home-news .home-tab{ margin-top:25px;}
.home-news .js-tab-box{ margin-top:6%;}
.home-news .js-tab-con{ display:none;}
.home-news .js-tab-con.active{ display: block;}
.home-news .content .left{ float: left; width: 580px; background:#F0F0F0}
.home-news .content .left .img{ overflow: hidden; position: relative;}
.home-news .content .left .img img{ position: absolute; top:0;  left:0; width: 100%}
.home-news .content .left .img i{  display: inline-block; padding-bottom: 58.62%; }
.home-news .content .left .text{ padding:4%;}
.home-news .content .left span{ margin-bottom:2.5%; display:block; font-size: 16px; color: #666;}
.home-news .content .tit{ font-size: 18px; color: #222222;}
.home-news .content .des{ margin-top:2%; font-size: 14px; color: #666; padding-right: 70px; position: relative;}
.home-news .content .des em{ position: absolute; top:0; right:0; color: #b48b62; font-size:12px}
.home-news .content .left a:hover .img img{ transform:scale(1.05); -webkit-transform: scale(1.05);}
.home-news .content .left a:hover .tit{color: #b48b62;}
.home-news ul{  margin-left: 630px;}
.home-news li{ border-bottom:1px solid #e5e5e5; }
.home-news li a{ display: block; position:relative; padding:22px 20px 22px 154px; position: relative;}
.home-news li a:after{ content: ""; position: absolute; bottom:-1px; left:0; width: 0; height: 2px; background: #b48b62; -webkit-transition: all ease .4s; -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s;  transition: all ease .4s;}
.home-news li .date{ position: absolute; top:18px; left:30px; height:55px; width:105px; border-right:1px dotted #b48b62;}
.home-news li .date span{ display: block; font-size: 24px; color:#000}
.home-news li .date p{ margin-top: 5px; font-size: 16px; color: #666;}
.home-news li a:hover{ background:#f0f0f0}
.home-news li a:hover:after{ width: 100%;}
.home-news li a:hover .tit,.home-news li a:hover .date span{ color: #b48b62;}

@media (max-width:1600px) {
	.home-point li .item div span{ font-size: 14px;}
	.home-point li .item div{ margin-left: 65px;}
}

.sy1 p img{ width:100%}
.sy1{ margin:6% 0 0}
.home-case-list{ overflow:hidden}
.home-case-list1{ margin-left:-3%; margin-top:-3%}
.home-case-list1 li{ width:30.333%; padding:0; margin-left:3%; margin-top:3%}
.home-case-list1 .item .tit{ padding-right:0}
.home-case-list1 .item .text{ padding:0; margin-top:3%; text-align:center}
.home-case-list1 .item .tit span{ font-size:18px}
.home-case .js-tab-box{ border-bottom:#333 1px solid}
.js-tab-box{ padding-bottom:6%}
.home-case1{ background:url(../images/sy1-18.jpg) no-repeat center; background-attachment:fixed}
.home-tit1 .tit{ background:url(../images/0.jpg) no-repeat center}
.home-tit1 .tit span{ color:#b48b62}
.home-tit1 .tit h2{ color:#fff}
.home-tit1 .des{ color:#fff}
.home-tit1 .des span:before, .home-tit1 .des span:after{ background:#fff}
.home-tit1{ margin-bottom:6%}
.home-case1 .js-tab-box{ padding-bottom:5%}
.home-profile{ padding-top:5%; overflow:hidden; background:url(../images/sy1-32.jpg) no-repeat center}
.left{ float:left}
.right{ float:right}
.clear{ clear:both}
.sy6{ background:url(../images/sy1-35.jpg) no-repeat left top 5px}
.sy6{ margin:5% 0}
.sy6 h1{ font-size:36px; font-weight:normal; padding-left:10%}
.sy6 h1 span{ font-size:18px; color:#666; display:block}
.sy6 ul{ overflow:hidden; margin-left:-4%; margin-top:2%}
.sy6 ul li{ float:left; width:16%; margin-left:4%; margin-top:3%;max-height:120px; border:#ccc 1px solid; border-radius:5px;overflow:hidden;}
.sy6 ul li img{ width:100%;height:100%;}
.sy6 ul li a{ display:block}
/* .sy6 ul li a:hover img{ border:#0a2444 1px solid;} */
.sy7{ overflow:hidden; margin-top:5%}
.sy7 p{ line-height:30px}
.sy7 .left{ width:10%; font-size:22px; color:#ccc}
.sy7 .right{ width:90%;}
.sy7 .right,.sy7 .right a{ font-size:15px; color:#ccc}
.pc-footer{ overflow:hidden}
.home-vr{ margin-top:5%}
.home-case .js-tab-box2{ border:0}

.flexslider{position:relative;overflow:hidden;}
.slides{position:relative;z-index:1;}
.slides li a{ display:block;}
.flex-control-nav{ display:none}
.slides li img{ width:100%}
.flex-direction-nav{position:absolute;z-index:3;width:100%;top:46%;}
.flex-direction-nav li a{display:block;width:60px;height:61px;overflow:hidden;cursor:pointer;position:absolute;}
.flex-direction-nav li a.flex-prev{left:5%;background:url(../images/sy-6.png) center center no-repeat;}
.flex-direction-nav li a.flex-next{right:5%;background:url(../images/sy-7.png) center center no-repeat;}

.sy8{ position:fixed; bottom:0; left:0; width:100%; height: 157px; background-color: rgba(51,51,51, 0.9); padding:1.5% 6%; z-index:9999}
.sy8 .left{ width:36%}
.sy8 .left h1 img{ width:100%}
.sy8 .right{ width:60%; overflow:hidden; margin-top:1%}
.sy8 .right p,.sy8 .right h2{ float:left; width:30.333%; border-radius:5px;}
.sy8 .right p{ overflow:hidden; font-size:20px; color:#333; line-height:40px; padding:0 1%; background:#fff; margin-right:4%; overflow:hidden}
.sy8 .right p input{ height:40px; line-height:40px; /* color:#fff; */ width:60%; display:block; background:none; border:0; border-bottom:#fff 1px solid}
.sy8 .right h2 input{ border-radius:5px; width:100%; font-size:22px; background:#FF6600; color:#fff; text-align:center; line-height:40px; height:40px;}
.sy8 .right p span{ width:auto; float:left}
.pc-footer{ padding-bottom:7%}
@media (max-width:1400px){
.sy8 .right p,.sy8 .right h2 input{ font-size:16px;}
.sy8 .right p span{ width:auto}
.sy8 .right p input{ width:56%}
}
.sy8 .close-r-top {
	position: absolute;
	right: 10px;
	top: 10px;
	cursor: pointer;
}

.foot{
	padding: 50px 0 30px;
	background: #0a2444;
}
.foot-top{
	padding-bottom: 30px;
}
.foot-top h2{
	font-size: 40px;
	color: #fff;
}
.foot-top form div{
	background: #fff;
	border-radius: 30px;
	padding: 15px;
	margin-right: 40px;
}
.foot-top form div label{
	margin: 0;
}
.foot-top form div:last-child{
	background: #000;
}
.foot-top form div button{
	width: 100%;
	background: none;
	outline: none;
	color: #fff;
}
.foot-bottom{
	padding-top: 30px;
	color: #fff;
	font-size: 16px;
}
.advisory img{
	width: 30px;
	height: 30px;
	display: inline-block;
}
.foot-bottom ul{
	list-style: none;
	padding-top: 50px;
}
.ercode img{
	width: 50%;
	margin: 0 auto;
}
.ercode {
	text-align: center;
}
.tel-advisory{
	width: 13%;
	padding: 85px 0;
	border-right: 1px solid #fff;
	margin-right: 20px;
}
.copyright{
	padding: 30px 0 30px 0;
	text-align: center;
	color: #fff;
}
.footfloat{
	width: 100%;
	height: 267px;
	position: fixed;
	bottom: 0;
	left: 0;
	background: #042033 url("../images/footfloat.png") no-repeat;
	background-size: 100% 267px;
}
.footfloat form{
	width: 55%;
	margin: 0 auto;
	position: relative;
	left: 370px;
	top: -10px;
}
.footfloat form div {

	padding: 8px 15px;
}
.footfloat form div:last-child{
	background: #f39800;
}.foot{
	padding: 50px 0 30px;
	background: #0a2444;
}
.foot-top{
	padding-bottom: 30px;
}
.foot-top h2{
	font-size: 40px;
	color: #fff;
}
.foot-top form div{
	background: #fff;
	border-radius: 30px;
	padding: 15px;
	margin-right: 40px;
}
.foot-top form div label{
	margin: 0;
}
.foot-top form div:last-child{
	background: #000;
}
.foot-top form div button{
	width: 100%;
	background: none;
	outline: none;
	color: #fff;
}
.foot-bottom{
	padding-top: 30px;
	color: #fff;
	font-size: 16px;
}
.advisory img{
	width: 30px;
	height: 30px;
	display: inline-block;
}
.foot-bottom ul{
	list-style: none;
	padding-top: 50px;
}
.ercode img{
	width: 50%;
	margin: 0 auto;
}
.ercode {
	text-align: center;
}
.tel-advisory{
	width: 13%;
	padding: 85px 0;
	border-right: 1px solid #fff;
	margin-right: 20px;
}
.copyright{
	padding: 30px 0 30px 0;
	text-align: center;
	color: #fff;
}
.footfloat{
	width: 100%;
	height: 267px;
	position: fixed;
	bottom: 0;
	left: 0;
	background: #042033 url("../images/footfloat.png") no-repeat;
	background-size: 100% 267px;
}
.footfloat form{
	width: 55%;
	margin: 0 auto;
	position: relative;
	left: 370px;
	top: -10px;
}
.footfloat form div {

	padding: 8px 15px;
}
.footfloat form div:last-child{
	background: #f39800;
}
.youshi { margin: 30px 0;overflow: hidden; }
.youshi .title { margin-bottom: 40px; }
.youshi .title .h3 { font-size: 38px;font-weight: 700; }
.youshi .title .sub { font-size: 20px;color: #666666; }
.youshi .list li { border: 1px solid #D4D4D4;height: 291px;width: 100%;margin-bottom: 10px;overflow: hidden; }
.youshi .list li .text { width: 50%;display: inline-block;float: left;position: relative;padding: 30px;color: #0A2544; }
.youshi .list li .text .h4 { font-size: 30px;font-weight: 700;line-height: 70px;margin-top: 50px; }
.youshi .list li .text .h5 { font-size: 20px;color:#666666 }

.youshi .list li .text .biao {background-image:url(/static/index/page/images/ysbg.png);background-repeat:no-repeat;background-size:80px 62px;width:80px;height:62px;color:#fff;text-align:center;line-height:52px;font-size:34px;font-weight:700;position:absolute;top:0;left:0;}
.youshi .list li.right .text .biao {left:-2px;}
.youshi .list li .image{ width: calc(50% - 1px);display: inline-block;float: right; }
.youshi .list li .image img{ width: 100%;height: 100%;min-height: 291px; }
.youshi .list li.right .text { width: calc(50% - 1px);display: inline-block;float: right; }
.youshi .list li .image{ width: calc(50% - 1px);display: inline-block;float: left; }
@media screen and ( max-width:768px){
    .youshi .list li { height: auto; }
    .youshi .title { margin-bottom: 2rem; }
    .youshi .title .h3 { font-size: 1.3rem;font-weight: 700; }
    .youshi .title .sub { font-size: .8rem;color: #666666; }
    .youshi .list li .text { width: 100%;display: block;position: relative;padding: 30px;color: #0A2544; }
    .youshi .list li.right .text { width: 100%;display: block;position: relative;padding: 30px;color: #0A2544; }
    .youshi .list li .text .h4 { font-size: 1.3rem;font-weight: 700;line-height: 1.8rem;margin-top: 2.4rem; }
    .youshi .list li .text .h5 { font-size: .9rem;color:#666666 }
    .youshi .list li .image{ width: 100%;display:block; }
    .youshi .list li .image img{ width: 100%;height: 100%;min-height: auto; }
}