@charset "utf-8";
body{
	font-family:"Microsoft Yahei","SimSun";
	font-size:16px;
	color:#000;
}

a{
	color:#000;
}

a:hover{
	text-decoration: none;
	color: #d03030 !important;
}

.fw{
	color: #fff;
}

.fw a{
	color: #fff;
	transition: opacity 0.1s;
}

.fw a:hover{
	opacity: 0.8;
	color: #fff !important;
}




img{
	display:block;
	max-height: 100%;
	max-width: 100%;
}

.wrapper{
	width:100%;
	min-width:1200px;
	max-width:1920px;
	margin:0px auto;
	overflow: hidden;
}

.w1200{
	width:1200px;
	margin:0px auto;
}

h1,h2,h3,h4,h5{
	font-family:"Microsoft Yahei","SimHei";
	overflow:hidden;
}

p,li{
	overflow:hidden;
}

.photo{
	position: relative;
	overflow: hidden;
}

.photo img{
	width: 100%;
	height: 100%;
}

.photo2{
	position: relative;
	overflow: hidden;
}

.photo2 img{
	width: 100%;
	height: 100%;
	transition: transform 0.2s;
}

.photo2:hover img{
	transform: scale(1.02,1.02);
}

.topic1{
	text-align: center;
	position: relative;
}

.topic1 img{
	display: inline-block;
	vertical-align: top;
}

#footer{
	line-height: 30px;
	padding: 30px 0px;
	font-size: 14px;
	text-align: center;
	background: #d3a969;
	margin-top: 100px;
}

#header-wap,#footer-wap{
	display: none;
}

#header{
	height: 100%;
	position: relative;
	background: #c8f2fc;
}

#header video{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	object-fit: cover;
	object-position: center center;
}

#header .logo{
	position: absolute;
	width: 10.4%;
	height: 8.8%;
	left: 2.5%;
	top: 4%;
	background: url("images/header-logo.png") no-repeat center center;
	background-size: contain;
	z-index: 9;
}

#layout1{
	background: url("images/ly1-bg.png") repeat-x center top;
	padding: 37px 0px 0px 0px;
}

#layout1 .headline{
	background: url("images/ly1-headline.png") no-repeat left top;
	min-height: 95px;
	text-align: center;
	padding-left: 100px;
}

#layout1 .headline h2{
	font-size: 36px;
	line-height: 50px;
	height: 50px;
	font-weight: bold;
}

#layout1 .headline p{
	line-height: 20px;
	height: 20px;
	color: #666;
	margin-top: 20px;
	font-size: 20px;
}

#layout1 .headline p a{
	color: #666;
}

#layout1 .block2{
	margin-top: 40px;
}

#layout1 .block2 .big{
	float: left;
	width: 913px;
	height: 500px;
}

#layout1 .block2 .big .arrow1,#layout1 .block2 .big .arrow2{
	position: absolute;
	width: 86px;
	height: 90px;
	top: 50%;
	margin-top: -45px;
	cursor: pointer;
	opacity: 0.5;
	transition: opacity 0.2s;
}

#layout1 .block2 .big .arrow1{
	left: 0%;
	background: url("images/ly1-arrow1.png");
}

#layout1 .block2 .big .arrow2{
	right: 0%;
	background: url("images/ly1-arrow2.png");
}

#layout1 .block2 .big:hover .arrow1,#layout1 .block2 .big:hover .arrow2{
	opacity: 1;
}

#layout1 .block2 .small{
	float: right;
	width: 285px;
	height: 500px;
}

#layout1 .block2 p{
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 60px;
	line-height: 60px;
	text-overflow:ellipsis;
	white-space:nowrap;
	text-align: center;
	font-size: 18px;
	background-color:rgba(0,0,0,0.5);
}

#layout1 .block3 .box{
	width: 560px;
	margin-top: 45px;
}

#layout1 .block3 h3{
	line-height: 34px;
	height: 68px;
	font-size: 24px;
	font-weight: bold;
}

#layout1 .block3 ul{
	border-top: 1px solid #d6e9f0;
	margin-top: 25px;
	padding-top: 20px;
}

#layout1 .block3 li{
	line-height: 48px;
	height: 48px;
	background: url("http://www.subaoxw.com/statics/subao/css/list-dot1.png") no-repeat left center;
	padding-left: 20px;
	font-size: 18px;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#layout1 .block4 ul{
	margin-left: -30px;
}

#layout1 .block4 li{
	float: left;
	margin: 50px 0px 0px 30px;
	width: 380px;
}

#layout1 .block4 .photo{
	height: 210px;
}

#layout1 .block4 .photo .play{
	position: absolute;
	width: 44px;
	height: 44px;
	background: url("images/ly1-play.png");
	left: 20px;
	bottom: 20px;
}

#layout1 .block4 p{
	line-height: 30px;
	height: 60px;
	font-size: 18px;
	margin-top: 15px;
}

#layout2{
	margin-top: 90px;
}

#layout2 .topic1{
	margin-bottom: 45px;
}

#layout2 .block{
	height: 840px;
	overflow: hidden;
	background-position: center top;
	background-repeat: no-repeat;
}

#ly2-city1{ background-image: url("images/ly2-bg1.jpg"); }
#ly2-city2{ background-image: url("images/ly2-bg2.jpg"); }
#ly2-city3{ background-image: url("images/ly2-bg3.jpg"); }
#ly2-city4{ background-image: url("images/ly2-bg4.jpg"); }

#layout2 .block .w1200{
	padding-top: 17px;
}

#layout2 .block .headline{
	height: 82px;
	position: relative;
	text-align: center;
	padding: 39px 0px 0px 140px;
}

#layout2 .block .headline .tag{
	position: absolute;
	left: 0px;
	top: 0px;
}

#ly2-city4 .headline .tag{
	left: -8px !important;
}

#layout2 .block .headline h3{
	position: relative;
	z-index: 8;
	font-size: 36px;
	height: 50px;
	line-height: 50px;
	font-weight: bold;
}

#layout2 .block .headline .more{
	position: absolute;
	right: 0px;
	bottom: 0px;
	width: 68px;
	height: 22px;
	line-height: 22px;
	border-radius: 12px;
	font-size: 14px;
	border: 1px solid rgba(255,255,255,0.5);
}

#layout2 .block .media{
	width: 640px;
	margin-top: 30px;
}

#ly2-city1 .media,#ly2-city3 .media{
	float: left;
}

#ly2-city2 .media,#ly2-city4 .media{
	float: right;
}

#layout2 .block .media .focus{
	height: 350px;
}

#layout2 .block .media .focus a{
	display: block;
	width: 100%;
	height: 100%;
}

#layout2 .block .media .focus table{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background-color:rgba(0,0,0,0.5);
	text-align: center;
	font-size: 24px;
	line-height: 34px;
	opacity: 0;
	transition: opacity 0.2s;
	color: #fff !important;
}

#layout2 .block .media .focus table td{
	padding: 0px 25px;
}

#layout2 .block .media .focus:hover table{
	opacity: 1;
	color: #fff !important;
}

#layout2 .block .media .focus .point{
	position: absolute;
	bottom: 20px;
	right: 30px;
	z-index: 10;
}

#layout2 .block .media .focus .point span{
	float: left;
	width: 10px;
	height: 10px;
	margin-left: 5px;
	cursor: pointer;
	border-radius: 50%;
	background: rgba(255,255,255,0.5);
}

#layout2 .block .media .focus .point .current{
	background: rgba(255,255,255,1);
}

#layout2 .block .media .small{
	width: 315px;
	margin-top: 15px;
}

#layout2 .block .media .small .photo{
	height: 175px;
}

#layout2 .block .media .small .photo .play{
	position: absolute;
	width: 37px;
	height: 37px;
	background: url("images/ly2-play.png");
	left: 15px;
	bottom: 15px;
}

#layout2 .block .media .small p{
	line-height: 26px;
	margin-top: 10px;
}

#layout2 .block .text{
	width: 515px;
	margin-top: 30px;
}

#ly2-city1 .text,#ly2-city3 .text{
	float: right;
}

#ly2-city2 .text,#ly2-city4 .text{
	float: left;
}

#layout2 .block .text{
	overflow: hidden;
}

#layout2 .block .text ul{
	margin-top: -67px;
}

#layout2 .block .text li{
	border-top: 1px dashed rgba(255,255,255,0.6);
	padding-top: 33px;
	margin-top: 33px;
}

#layout2 .block .text h4{
	font-size: 24px;
	height: 30px;
	line-height: 30px;
	font-weight: normal;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#layout2 .block .text p{
	line-height: 24px;
	height: 48px;
	font-size: 14px;
	margin-top: 15px;
}

#layout3{
	margin-bottom:45px;
	margin-top: 90px;
}

#layout3 .topic1{
	position: relative;
	z-index: 9;
}

#layout3 .topic1 .more{
	width: 68px;
	height: 22px;
	border-radius: 12px;
	line-height: 22px;
	text-align: center;
	font-size: 14px;
	display: block;
	color: #161515;
	border: 1px solid rgba(204,204,204,0.5);
	margin: 25px auto 0px auto;
}

#layout3 .main{
	height: 585px;
	position: relative;
	margin-top: -82px;
}

#layout3 .main .arrow1,#layout3 .main .arrow2{
	position: absolute;
	width: 39px;
	height: 22px;
	cursor: pointer;
	bottom: 42px;
	transition: background 0.2s;
	z-index: 9;
}

#layout3 .main .arrow1{
	right: 160px;
	background: url("images/ly3-arrow1a.png");
}

#layout3 .main .arrow2{
	right: 78px;
	background: url("images/ly3-arrow2a.png");
}

#layout3 .main .arrow1:hover{
	background: url("images/ly3-arrow1b.png");
}

#layout3 .main .arrow2:hover{
	background: url("images/ly3-arrow2b.png");
}

#layout3 .main ul{
	margin-left: -16px;
}

#layout3 .main li{
	float: left;
	width: 288px;
	height: 470px;
	margin-left: 16px;
}

#layout3 .main .pic2,#layout3 .main .pic3{
	margin-top: 115px;
}

#layout3 .main table{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background: rgba(0,0,0,0.5);
	text-align: center;
	font-size: 24px;
	line-height: 34px;
	opacity: 0;
	transition: opacity 0.2s;
	color: #fff !important;
}

#layout3 .main table td{
	padding: 0px 15px;

}

#layout3 .main table td a{

	color: #fff !important;
}


#layout3 .main li:hover table{
	opacity: 1;
	color: #fff !important;
}

#layout4{
	margin-top: 90px;
}

#layout4 .topic1 .more{
	position: absolute;
	right: 0px;
	bottom: 0px;
	width: 68px;
	height: 22px;
	border-radius: 12px;
	line-height: 22px;
	text-align: center;
	font-size: 14px;
	display: block;
	color: #ccc;
	border: 1px solid rgba(204,204,204,0.5);
}

#layout4 .main{
	margin-top: 50px;
}

#layout4 .main ul{
	margin-left: -60px;
	margin-top: -12px;
}

#layout4 .main li{
	float: left;
	border: 5px solid #efefef;
	background: #f8f8f8;
	height: 105px;
	width: 460px;
	margin: 12px 0px 0px 60px;
	padding: 20px 20px 0px 80px;
	position: relative;
	overflow: visible;
}

#layout4 .main .tag{
	position: absolute;
	left: -5px;
	top: 50%;
	margin-top: -33px;
	width: 66px;
	height: 66px;
	line-height: 66px;
	text-align: center;
	color: #fff;
	border-radius: 5px;
	background: #de323c;
	font-size: 40px;
	font-weight: bold;
}

#layout4 .main h3{
	font-size: 22px;
	line-height: 30px;
	height: 30px;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#layout4 .main p{
	line-height: 24px;
	height: 48px;
	margin-top: 10px;
	font-size: 14px;
	color: #666;
}