@charset "gb2312";
/* CSS Document */
html{color:#777;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%; font-family:microsoft yahei,simhei; background:url(bg.jpg) repeat; }
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {margin:0;padding:0; color:#444; font:14px "microsoft yahei";line-height:30px}
ol,ul,li {list-style:none;}
.fl,.fr {_display:inline;}
.fl{float:left;}
.fr {float:right;}
a{ color:#777; text-decoration:none;}
a:hover { color:#01b1af; text-decoration:none;}
h1,h2,h3,h4,h5 { font-family:microsoft yahei,simhei; font-weight:bold;}
img{ border:none;}
.cl { clear:both;}
.cl:after { content:"."; visibility:hidden; height:0; font-size:0; display:block; clear:both;}
.middle{ width:1000px; margin:0px auto;font: 16px "microsoft yahei";}

.sy{background:url(sy.jpg) repeat; width:1000px; height:601px; margin:0px auto;}
.sy ul{ width:240px; padding:105px 0px 0px 695px;}
.sy li{ font-size:14px; line-height:30px; height:30px}
.box{ width:988px; height:599px; background:#fff; border:1px solid #b1afaf; border-left:6px solid #b1afaf;border-right:6px solid #b1afaf;position: relative; margin:0px auto}
.tit{ width:928px; margin:0px auto;background:url(tit.jpg) repeat-x; height:8px; position:relative; margin-top:42px}
.tit h2{ font-size:36px; position:absolute; left:0; top:-25px; background:#fff; display:inline-block; color:#333; padding-right:10px; line-height:40px;}
.tit h2 span{ color:#999; font-size:14px; font-weight:normal; margin-left:6px}
.part1{ width:928px; margin:30px auto; overflow:hidden}
.part1 img{ float:left}
.part1 p{ width:576px; float:right; text-indent:26px}
.pic{ width:928px; margin:50px auto}
.pic ul{ width:944px; overflow:hidden}
.pic li{ width:220px; height:160px; float:left; margin-right:16px;}
.part2,.part3,.part4,.part5{ width:928px; margin:0px auto}
.part2 dl{ width:100%; float:left; margin:40px auto 10px auto}
.part2 dl dt{ width:229px; height:167px; float:left}
.part2 dl dd{ width:675px; float:right;}
.part2 dl dd h2{ font-size:20px; color:#333}
.part2 dl dd p{ font-size:12px; color:#777; line-height:24px; text-indent:26px}
.part3 dl{ width:100%; float:left; margin:30px auto 10px auto}
.part3 dl dt{ width:169px; height:127px; float:left}
.part3 dl dd{ width:735px; float:right;}
.part3 dl dd h2{ font-size:20px; color:#333}
.part3 dl dd p{ font-size:12px; color:#777; line-height:24px; text-indent:26px}
.part4 li{ width:928px; height:92px; float:left;margin:30px auto 10px auto}
.part4 li h2{ font-size:20px; color:#333; line-height:40px}
.part4 li h2 em{width:28px; height:28px; line-height:28px; text-align:center;background:#333; border-radius:25px; display:inline-block; color:#fff; font-size:16px; font-style:normal; margin-right:10px}
.part4 li p{ font-size:14px; color:#777; line-height:24px; text-indent:30px;}
.part5 .left{ width:230px; float:left; margin-top:38px}
.part5 .left li{ width:230px; height:72px; color:#fff; background:#b1afaf; display:inline-block; text-align:center; line-height:72px; margin-bottom:27px; cursor:pointer}
.part5 .left li.selected a{width:230px; height:72px;background:#333;display:inline-block;  }
.part5 .left li a{ color:#fff; font-size:18px;}
.part5 .right{ width:678px; height:467px; float:right; margin-top:38px; position:relative}
.part5 .right img{ width:678px; height:467px;}
.part5 .right p{ width:638px; background:url(lib.png) repeat;position:absolute; bottom:0px; left:0px;color:#fff; padding:15px 20px}
.part5 .right p b{ font-size:16px; color:#fff;}
.part5 .right p i{ font-style:normal; color:#999; font-size:12px; }
.part6{ width:928px; height:450px; margin:40px auto 0;position:relative}
.part6 dl{  background:url(lib.png) repeat;position:absolute; bottom:0px; left:0px;color:#fff; padding:25px 30px; width:828px}
.part6 dl dt{ width:66px; float:left; color:#fff; font-size:30px;}
.part6 dl dd{ width:760px; float:right}
.part6 dl dd h2{ font-size:16px; color:#fff;}
.part6 dl dt em{ color:#e00000; font-style:normal}
.part6 dl dd p{ font-size:12px; color:#999;}
.part7{ width:988px; height:599px; background:url(part7.jpg) no-repeat;}
.part7 h2{ font-size:36px; color:#333; text-align:center; padding:40px 0}
.part7 p{ font-size:16px; padding:20px 30px; text-indent:26px;color:#777}
.part7 p.cen{ text-align:center; font-size:18px; line-height:36px; color:#777}

/* Contents */
.wrapper { width:100%; height:100%; position:relative; z-index:0; overflow:hidden; margin-top:10px }
.contents { position:absolute; }
.contents .game-body { float:left; }
.contents .content { width:920px; height:620px; margin:0 auto; position:relative; padding:20px; }
.contents .content p { margin:12px 0; line-height:20px;}

/* Footer Button */
.bottom { width:100%; position:absolute; z-index:9; top:650px; height:80px; color:#fff; }
.bottom .container { height:40px; margin:0 auto; position:relative; top:3px; text-align:center;}
.bottom .container li { width:40px; height:40px; line-height:40px; text-align:center; float:left; cursor:pointer; background:#b1afaf; border-radius:25px; margin:0 10px; display:inline; position:relative; color:#FFF}
.bottom .container li.active { background-color:#4f4f4f !important; }
.bottom .container li .bubble { display:none; position:absolute; bottom:45px; left:50%;}
.bottom .container li .bubble-text { background:#4f4f4f; padding:5px 10px; border-radius:3px; display:block; height:22px; line-height:22px; white-space:nowrap;}
.bottom .container li .bubble-icon { display:block; width:15px; height:8px; background:url(text-icon.gif) no-repeat 0 0; margin:0 auto;}
/* Scroll Button */
a.scroll-left, a.scroll-right { display:block; width:60px; height:100px; position:absolute; top:50%; z-index:10;  margin:-50px 0 0; }
a.scroll-left { left:5px; }
a.scroll-right { right:5px; margin:-50px 0 0 -50px; }
a.scroll-left span, a.scroll-right span { display:block; width:60px; height:100px; }
a.scroll-left span { background:url(arrow-icon.gif) no-repeat 0 0;}
a.scroll-right span { background:url(arrow-icon.gif) no-repeat -126px 0;}
a.scroll-left:hover span { background:url(arrow-icon-hover.gif) no-repeat 0 0;}
a.scroll-right:hover span { background:url(arrow-icon-hover.gif) no-repeat -126px 0;}