@charset "utf-8";

/* Reset 2.5
-----------------------------------------------------------------------------------------------------------*/
body, h1, h2, h3, p, ul, ol, form, textarea { margin: 0; }
ul, ol, input { padding: 0; }
ul { list-style: none; }
ol { list-style: inside decimal; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus { outline: none; }
em, strong, i { font-style: normal; }
img { vertical-align: top; border: 0; }
input, textarea { outline: none; }
table { border-collapse: collapse; }
section, article, aside, header, footer, nav { display: block; }

/* font */
body, a, input, textarea { font-family: \5FAE\8F6F\96C5\9ED1, Tahoma, Geneva, sans-serif; color: #333; }
body { font-size: 14px; line-height: 1.8; }
input, select, textarea { font-size: inherit; }
h1, h2, h3 { font-weight: 400; font-size: 1em; }

/* parts */
.pr { position: relative; }
.pa { position: absolute; }
.fl { float: left; _display: inline; }
.fr { float: right; _display: inline; }
.bc { margin-left: auto; margin-right: auto; }
.tc { text-align: center; }
.vm { vertical-align: middle; }
.nt { text-indent: -38888px; outline: none; }

.fill { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAMAAAAoyzS7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRF////AAAAVcLTfgAAAAF0Uk5TAEDm2GYAAAAMSURBVHjaYmAACDAAAAIAAU9tWeEAAAAASUVORK5CYII=) repeat 0 0; }

.ellipsis { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

.clearfix:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; }
.clearfix { *zoom: 1; }

/* Layout
-----------------------------------------------------------------------------------------------------------*/
html { background-color: #1e1c2a; }

.container { *position: relative; min-width: 1000px; overflow: hidden; }
.wrap { position: relative; width: 1000px; height: 996px; margin: 0 auto; }

.part, .part .wrap { background-repeat: no-repeat; background-position: center 0; }
.part { display: none; position: absolute; top: 0; left: -450px; width: 1900px; }

.logo { z-index: 1; position: absolute; top: 4px; left: -148px; }
.logo img { width: 138px; }

.nav, .nav a { background: url(nav.png) no-repeat 0 0; }
.nav { z-index: 1; display: none; position: absolute; top: 812px; left: -46px; width: 1085px; height: 145px; background-position: 0 -290px; }
.nav ul { padding: 4px 0 0 204px; }
.nav li { float: left; margin-right: 49px; }
.nav a { display: block; width: 137px; height: 137px; }
.nav .m1 { background-position: -204px -4px; }
.nav .m2 { background-position: -390px -4px; }
.nav .m3 { background-position: -576px -4px; }
.nav .m4 { background-position: -762px -4px; }
.nav .current .m1 { background-position: -204px -149px; }
.nav .current .m2 { background-position: -390px -149px; }
.nav .current .m3 { background-position: -576px -149px; }
.nav .current .m4 { background-position: -762px -149px; }

.btn a { display: block; background: url(btn.png) no-repeat 0 0; }

/* footer */
.footer, .footer a { color: #5f5f64; }
.footer { width: 1000px; margin: 0 auto; padding: 1.6em 0; font-size: 12px; }

/*
 ** content
 */
 
 /* part1 */
.part1, .part1 .wrap { background-image: url(part1-bg.jpg); }
.part1 .btn { padding: 674px 0 0 172px; }
.part1 .btn a { width: 291px; height: 67px; background-position: 0 0; }
.part1 .btn a:hover { background-position: -291px 0; }
 
 /* part2 */
.part2 { z-index: 2; }
.part2 .logo { display: none; top: -64px; left: 246px; width: 502px; height: 350px; }
.part2 .logo img  { width: 100%; height: 100%; }
.part2 .btn { position: absolute; top: 0; height: 407px; padding-top: 589px; background-image: url(part2-bg.jpg); }
.part2 .btn a { width: 188px; height: 43px; }
.part2 .feature { left: -1249px; width: 705px; padding-left: 244px; background-position: 0 0; }
.part2 .feature a { background-position: 0 -67px; }
.part2 .feature a:hover { background-position: -188px -67px; }
.part2 .movie { right: -1251px; width: 415px; padding-left: 536px; background-position: -949px 0; }
.part2 .movie a { background-position: 0 -110px; }
.part2 .movie a:hover { background-position: -188px -110px; }
.part2 .video { display: none; position: absolute; top: 1067px; left: 190px; width: 618px; height: 351px; background: url(video.png) no-repeat 0 0; }
.part2 .video a, .part2 .video object { position: absolute; top: 52px; left: 27px; width: 564px; height: 293px; }
 
 /* part3 */
.part3, .part3 .wrap { background-image: url(part3-bg.jpg); }
.part3 li a:hover, .layer i { background: url(part3-el.png) no-repeat 0 0; }

.part3 h2 { height: 292px; }
.part3 li { float: left; margin-left: 93px; }
.part3 li a { display: block; width: 63px; height: 372px; }
.part3 .l1 { margin-left: 79px; }
.part3 .l1 a:hover { background-position: 0 0; }
.part3 .l2 a:hover { background-position: -63px 0; }
.part3 .l3 a:hover { background-position: -126px 0; }
.part3 .l4 a:hover { background-position: -189px 0; }
.part3 .l5 a:hover { background-position: -252px 0; }
.part3 .l6 a:hover { background-position: -315px 0; }
 
 /* part4 */
.part4, .part4 .wrap { background-image: url(part4-bg.jpg); }
.part4 h2 { height: 275px; }
.part4 ul { height: 333px; margin-left: 129px; }
.part4 li { position: relative; float: left; margin-right: 22px; }
.part4 li, .part4 li a { width: 240px; height: 240px; }
.part4 li a { position: absolute; top: 0; left: 0; background: url(part4-el.png) no-repeat 0 0; }
.part4 li a.m1 { background-position: 0 0; }
.part4 li a.m2 { background-position: -262px 0; }
.part4 li a.m3 { background-position: -529px 0; }
.part4 li a.m1:hover, .part4 .current a.m1 { background-position: 0 -240px; }
.part4 li a.m2:hover, .part4 .current a.m2 { background-position: -262px -240px; }
.part4 li a.m3:hover, .part4 .current a.m3 { background-position: -529px -240px; }
.part4 li object { display: none; }
.part4 .current object { display: block; }
.part4 div { padding: 0 142px; color: #d9d9d9; }
 
 /* part5 */
.part5, .part5 .wrap { background-image: url(part5-bg.jpg); }
.part5 p { position: absolute; top: 80px; }
.part5 .tiger { right: -303px; }
.part5 .dragon { left: -318px; }

/*
 ** layer
 */
.layer { width: 847px; height: 472px; }
.layer i { z-index: 1; position: absolute; top: 0; width: 63px; height: 472px; background-position: -413px 0; }
.layer i.left { left: 0; }
.layer i.right { left: 63px; }
.layer i.close { display: none; top: 42px; right: -43px; width: 35px; height: 102px; background-position: -378px 0; cursor: pointer; }
.layer i.close:hover { background-position: -378px -102px; }
.layer p { position: absolute; top: 1px; left: 63px; width: 0; height: 431px; overflow: hidden; }
.layer p img { width: 721px; height: 431px; }