@charset "utf-8";
#header{
	background: url(images/hd-bg.jpg) no-repeat center top;
}

#header .w1200{
	height: 900px;
	position: relative;
}

#header .abs{
	position: absolute;
	background-position: left center;
	filter:alpha(opacity=0);
	opacity:0;
}

#header .logo{
	width: 500px;
	height: 39px;
	left: 350px;
	top: 87px;
	background-image: url(images/hd-logo.png);
}

#header .flower1{
	width: 840px;
	height: 353px;
	left: 29px;
	top: 180px;
	background-image: url(images/hd-flower1.png);
}

#header .flower2{
	width: 214px;
	height: 257px;
	left: 92px;
	top: 190px;
}

#header .flower2 i{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background-image: url(images/hd-flower2.png);
}

#header .flower3{
	width: 105px;
	height: 109px;
	left: 550px;
	top: 517px;
}

#header .flower3 i{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background-image: url(images/hd-flower3.png);
}

#header .flower4{
	width: 250px;
	height: 262px;
	right: 27px;
	top: 165px;
}

#header .flower4 i{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background-image: url(images/hd-flower4.png);
}

#header .topic1{
	width: 142px;
	height: 72px;
	left: 265px;
	top: 230px;
	background-image: url(images/hd-topic1.png);
}

#header .topic2{
	width: 147px;
	height: 143px;
	left: 396px;
	top: 184px;
	background-image: url(images/hd-topic2.png);
}

#header .topic3{
	width: 160px;
	height: 144px;
	left: 532px;
	top: 183px;
	background-image: url(images/hd-topic3.png);
}

#header .topic4a{
	width: 317px;
	height: 442px;
	left: 620px;
	top: 124px;
	background-image: url(images/hd-topic4a.png);
}

#header .topic4b{
	width: 317px;
	height: 442px;
	right: 263px;
	top: 124px;
	background-image: url(images/hd-topic4b.png);
	background-position: right top;
}

#header .topic5{
	width: 608px;
	height: 183px;
	left: 147px;
	top: 328px;
	background-image: url(images/hd-topic5.png);
}

#header .link1,#header .link2,#header .link3,#header .link4{
	position: absolute;
	width: 250px;
	height: 108px;
	bottom: 65px;
}

#header .link1{ background-image: url(images/hd-link1.gif); left: 0px; }
#header .link2{ background-image: url(images/hd-link2.gif); left: 316px; }
#header .link3{ background-image: url(images/hd-link3.gif); left: 632px; }
#header .link4{ background-image: url(images/hd-link4.gif); left: 948px; }


#layout1 .w1200{
	filter:alpha(opacity=0);
	opacity:0;
}

@-ms-keyframes topic1{
	from{ width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-moz-keyframes topic1{
	from{ width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-o-keyframes topic1{
	from{ width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-webkit-keyframes topic1{
	from{ width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@keyframes topic1{
	from{ width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}

#header .topic1{
	animation:'topic1' 0.6s ease-in-out 0s forwards;
	-ms-animation:topic1 0.6s ease-in-out 0s forwards;
	-moz-animation:topic1 0.6s ease-in-out 0s forwards;
	-o-animation:'topic1' 0.6s ease-in-out 0s forwards;
	-webkit-animation:'topic1' 0.6s ease-in-out 0s forwards;
}

#header .topic2{
	animation:'topic1' 0.6s ease-in-out 0.4s forwards;
	-ms-animation:topic1 0.6s ease-in-out 0.4s forwards;
	-moz-animation:topic1 0.6s ease-in-out 0.4s forwards;
	-o-animation:'topic1' 0.6s ease-in-out 0.4s forwards;
	-webkit-animation:'topic1' 0.6s ease-in-out 0.4s forwards;
}

#header .topic3{
	animation:'topic1' 0.6s ease-in-out 0.8s forwards;
	-ms-animation:topic1 0.6s ease-in-out 0.8s forwards;
	-moz-animation:topic1 0.6s ease-in-out 0.8s forwards;
	-o-animation:'topic1' 0.6s ease-in-out 0.8s forwards;
	-webkit-animation:'topic1' 0.6s ease-in-out 0.8s forwards;
}

#header .topic4a{
	animation:'topic1' 1.0s ease-in-out 1.1s forwards;
	-ms-animation:topic1 1.0s ease-in-out 1.1s forwards;
	-moz-animation:topic1 1.0s ease-in-out 1.1s forwards;
	-o-animation:'topic1' 1.0s ease-in-out 1.1s forwards;
	-webkit-animation:'topic1' 1.0s ease-in-out 1.1s forwards;
}

@-ms-keyframes topic4b{
	from{ height: 0px; width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-moz-keyframes topic4b{
	from{ height: 0px; width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-o-keyframes topic4b{
	from{ height: 0px; width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-webkit-keyframes topic4b{
	from{ height: 0px; width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@keyframes topic4b{
	from{ height: 0px; width: 0px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}

#header .topic4b{
	animation:'topic4b' 0.8s ease-in 1.5s forwards;
	-ms-animation:topic4b 0.8s ease-in 1.5s forwards;
	-moz-animation:topic4b 0.8s ease-in 1.5s forwards;
	-o-animation:'topic4b' 0.8s ease-in 1.5s forwards;
	-webkit-animation:'topic4b' 0.8s ease-in 1.5s forwards;
}

@-ms-keyframes logo{
	from{ top: 37px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-moz-keyframes logo{
	from{ top: 37px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-o-keyframes logo{
	from{ top: 37px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-webkit-keyframes logo{
	from{ top: 37px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@keyframes logo{
	from{ top: 37px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}

#header .logo{
	animation:'logo' 0.5s ease-in-out 2.1s forwards;
	-ms-animation:logo 0.5s ease-in-out 2.1s forwards;
	-moz-animation:logo 0.5s ease-in-out 2.1s forwards;
	-o-animation:'logo' 0.5s ease-in-out 2.1s forwards;
	-webkit-animation:'logo' 0.5s ease-in-out 2.1s forwards;
}

@-ms-keyframes topic5{
	from{ top: 378px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-moz-keyframes topic5{
	from{ top: 378px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-o-keyframes topic5{
	from{ top: 378px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-webkit-keyframes topic5{
	from{ top: 378px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@keyframes topic5{
	from{ top: 378px; }
	to{ filter:alpha(opacity=100); opacity:1; }
}

#header .topic5{
	animation:'topic5' 0.5s ease-in-out 2.1s forwards;
	-ms-animation:topic5 0.5s ease-in-out 2.1s forwards;
	-moz-animation:topic5 0.5s ease-in-out 2.1s forwards;
	-o-animation:'topic5' 0.5s ease-in-out 2.1s forwards;
	-webkit-animation:'topic5' 0.5s ease-in-out 2.1s forwards;
}

@-ms-keyframes flower1{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-moz-keyframes flower1{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-o-keyframes flower1{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-webkit-keyframes flower1{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@keyframes flower1{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}

#header .flower1,#header .flower2,#header .flower3,#header .flower4{
	animation:'flower1' 0.5s ease-in-out 2.5s forwards;
	-ms-animation:flower1 0.5s ease-in-out 2.5s forwards;
	-moz-animation:flower1 0.5s ease-in-out 2.5s forwards;
	-o-animation:'flower1' 0.5s ease-in-out 2.5s forwards;
	-webkit-animation:'flower1' 0.5s ease-in-out 2.5s forwards;
}

@-ms-keyframes nav{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-moz-keyframes nav{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-o-keyframes nav{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@-webkit-keyframes nav{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}
@keyframes nav{
	from{ }
	to{ filter:alpha(opacity=100); opacity:1; }
}

#header .link1,#header .link2,#header .link3,#header .link4,#layout1 .w1200{
	animation:'nav' 0.5s ease-in-out 2.9s forwards;
	-ms-animation:nav 0.5s ease-in-out 2.9s forwards;
	-moz-animation:nav 0.5s ease-in-out 2.9s forwards;
	-o-animation:'nav' 0.5s ease-in-out 2.9s forwards;
	-webkit-animation:'nav' 0.5s ease-in-out 2.9s forwards;
}

@-ms-keyframes flower2{
	from{ }
	50%{ left: 10px; }
	to{ }
}
@-moz-keyframes flower2{
	from{ }
	50%{ left: 10px; }
	to{ }
}
@-o-keyframes flower2{
	from{ }
	50%{ left: 10px; }
	to{ }
}
@-webkit-keyframes flower2{
	from{ }
	50%{ left: 10px; }
	to{ }
}
@keyframes flower2{
	from{ }
	50%{ left: 10px; }
	to{ }
}

#header .flower2 i{
	animation:'flower2' 3.0s ease-in-out 0s infinite;
	-ms-animation:flower2 3.0s ease-in-out 0s infinite;
	-moz-animation:flower2 3.0s ease-in-out 0s infinite;
	-o-animation:'flower2' 3.0s ease-in-out 0s infinite;
	-webkit-animation:'flower2' 3.0s ease-in-out 0s infinite;
}

@-ms-keyframes flower3{
	from{ }
	50%{ left: 10px; top: -10px; }
	to{ }
}
@-moz-keyframes flower3{
	from{ }
	50%{ left: 10px; top: -10px; }
	to{ }
}
@-o-keyframes flower3{
	from{ }
	50%{ left: 10px; top: -10px; }
	to{ }
}
@-webkit-keyframes flower3{
	from{ }
	50%{ left: 10px; top: -10px; }
	to{ }
}
@keyframes flower3{
	from{ }
	50%{ left: 10px; top: -10px; }
	to{ }
}

#header .flower3 i{
	animation:'flower3' 3.0s ease-in-out -0.33s infinite;
	-ms-animation:flower3 3.0s ease-in-out -0.33s infinite;
	-moz-animation:flower3 3.0s ease-in-out -0.33s infinite;
	-o-animation:'flower3' 3.0s ease-in-out -0.33s infinite;
	-webkit-animation:'flower3' 3.0s ease-in-out -0.33s infinite;
}

@-ms-keyframes flower4{
	from{ }
	50%{ left: 2px; top: -10px; }
	to{ }
}
@-moz-keyframes flower4{
	from{ }
	50%{ left: 2px; top: -10px; }
	to{ }
}
@-o-keyframes flower4{
	from{ }
	50%{ left: 2px; top: -10px; }
	to{ }
}
@-webkit-keyframes flower4{
	from{ }
	50%{ left: 2px; top: -10px; }
	to{ }
}
@keyframes flower4{
	from{ }
	50%{ left: 2px; top: -10px; }
	to{ }
}

#header .flower4 i{
	animation:'flower4' 3.0s ease-in-out -0.66s infinite;
	-ms-animation:flower4 3.0s ease-in-out -0.66s infinite;
	-moz-animation:flower4 3.0s ease-in-out -0.66s infinite;
	-o-animation:'flower4' 3.0s ease-in-out -0.66s infinite;
	-webkit-animation:'flower4' 3.0s ease-in-out -0.66s infinite;
}
