html, body, span, div, p, a, table, tbody, td, h1, h2, h3, h4, h5, h6, img, form, font, strong, b, i, dl, dt, dd, ol, ul, li, dl, dd, dt, iframe, label, blockquote, input, button { padding: 0; margin: 0; list-style: none }
body { font-family: 'Microsoft YaHei', '黑体', arial; color: #278ed5; font-size: 12px; background: #fff; overflow: hidden }
div, li, dt, dd, span { font-family: 'Microsoft YaHei', '黑体' }
li { list-style-type: none }
a, a:active { text-decoration: none; font-family: 'Microsoft YaHei'; outline: none }
img { border: none }
* html, * html body { background-image: url(about:blank); background-attachment: fixed }
* html .menulist { position: absolute; bottom: auto;  top: expression(eval(document.documentElement.scrollTop))}
html, body { _height: 100% }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: ""; clear: both; height: 0 }
.clearfix { zoom: 1 }
.menulist { padding: 0; margin: 0; margin-top: -190px; top: 50%; right: 0; position: fixed; _position: absolute; z-index: 120; _margin-top: 200px; display: block; width: 123px; height: 410px; background: #000; background: rgba(0, 0, 0, .4); border-radius: 3px 0 0 3px; filter: alpha(opacity=60) }
.menulist ul { float: right; margin: 20px 20px 0 0; padding: 30px 0; background: url(../images/menu_line.png) right repeat-y }
.menulist a { display: block; width: 60px; height: 22px; padding: 8px 34px 8px 0; line-height: 22px; text-align: right; font-size: 14px; color: rgba(229, 229, 229, .5);  *color: #e5e5e5;
filter: alpha(opacity=50) }
.menulist a:hover { color: #ffe032 }
.menulist .sel a { color: #ffe032; background: url(../images/menu_on.png) right center no-repeat }
.menulist .tips { width: 109px; height: 36px; padding: 16px 0 0 13px }
.menulist .keyboard { display: inline-block; width: 68px; height: 36px; background-image: url(../images/keyboard.png); background-position: -1px 0; background-repeat: no-repeat }
.menulist .up { background-position: -121px 0 }
.menulist .down { background-position: -191px 0 }
.menulist .mouse { display: inline-block; width: 26px; height: 36px; background: url(../images/keyboard.png) -72px 0 no-repeat }
.menulist #bdshare { background: 0 0; text-align: right !important }
.menulist #bdshare em { position: absolute; top: -6px; right: 0; width: 100%; height: 100%; font-size: 14px !important; background: none !important }

.cont { overflow: hidden; position: relative }
.resp0 { zoom: .8; height: 950px; -moz-transform: scale(0.8); -moz-transform-origin: center 0 }
.resp1 { zoom: .65; height: 950px; z-index: 1; -moz-transform: scale(0.65); -moz-transform-origin: center 0 }
.resp0 .popwin, .resp1 .popwin { top: 0 }

.list-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: .1; filter: alpha(opacity=10) }
.list-bg li { float: left; width: 16.66%; height: 300px }
.list-bg li { background-position: center top; background-repeat: no-repeat; background-size: cover }
.list-bg .m-01 { background-image: url(../images/p0/man01.jpg) }
.list-bg .m-02 { background-image: url(../images/p0/man02.jpg) }
.list-bg .m-03 { background-image: url(../images/p0/man03.jpg) }
.list-bg .m-04 { background-image: url(../images/p0/man04.jpg) }
.list-bg .m-05 { background-image: url(../images/p0/man05.jpg) }
.list-bg .m-06 { background-image: url(../images/p0/man06.jpg) }
.list-bg .m-07 { background-image: url(../images/p0/man07.jpg) }
.list-bg .m-08 { background-image: url(../images/p0/man08.jpg) }
.list-bg .m-09 { background-image: url(../images/p0/man09.jpg) }
.list-bg .m-10 { background-image: url(../images/p0/man10.jpg) }
.list-bg .m-11 { background-image: url(../images/p0/man11.jpg) }
.list-bg .m-12 { background-image: url(../images/p0/man12.jpg) }
.list-bg .m-13 { background-image: url(../images/p0/man13.jpg) }
.list-bg .m-14 { background-image: url(../images/p0/man14.jpg) }
.list-bg .m-15 { background-image: url(../images/p0/man15.jpg) }
.list-bg .m-16 { background-image: url(../images/p0/man16.jpg) }
.list-bg .m-17 { background-image: url(../images/p0/man17.jpg) }
.list-bg .m-18 { background-image: url(../images/p0/man18.jpg) }


#page0.cont_1 .logo1 { position: absolute; top: 50px; left: 50%; width: 170px; height: 50px; transform-style: preserve-3d; margin: 0px 0 0 -500px; background-image: url(../images/p0/logo1.png); }
#page0.cont_1 .logo1 { transform-style: preserve-3d; transition: all .5s ease; -webkit-animation: ani-people .4s ease 1 both; }

@-webkit-keyframes ani-people {  
0% {
 margin: -50px 0 0 -500px;
 opacity: 0
}
 100% {
 margin: 0 0 0 -500px;
 opacity: 1
}
}
#page0 .line-t-l { position: absolute; top: 50%; left: 50%; width: 160px; height: 160px; margin: -310px 0 0 -290px; }
#page0 .line-t-l { transform-style: preserve-3d; transition: all .3s ease; }
#page0.cont_0 .line-t-l { margin: -620px 0 0 0px; opacity: 0 }


#page0 .logo2 { position: absolute; top: 50%; left: 50%; width: 1000px; height: 400px; margin: -250px 0 0 -500px; background-image: url(../images/p0/logo2.png); background-repeat: no-repeat; }
#page0 .logo2 { transform-style: preserve-3d; transition: all .5s ease; }
#page0.cont_0 .logo2 { margin-top: -280px; opacity: 0 }

#page0 .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../images/p0/bg.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; }
#page0 .enter { background-image: url(../images/erweima_w.png); background-repeat: no-repeat; }
#page0 .logo3 { position: absolute; top: 50%; left: 50%; width: 1000px; height: 150px; margin-top: 150px; margin-left: -500px; background-image: url(../images/p0/logo3.png); background-repeat: no-repeat; }
#page0 .logo3 { transform-style: preserve-3d; transition: all .5s ease; }
#page0.cont_0 .logo3, #page0.cont_2 .logo3 { margin-top:200px; opacity: 0 }


#page1 { background-color: #f4695c; background-image: url(../images/p1/bg.jpg); background-size: cover; }
#page1 .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../images/p1/bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }
#page1 .logo {background-image: url(../images/p1/logo.png); background-repeat: no-repeat; }
#page1 .enter { background-image: url(../images/erweima_b.png); background-repeat: no-repeat; }
#page1 .txt1 { background: url(../images/p1/txt.png); }
#page1 .txt2 { color: #e7020f; }
#page1 .txt { color: #ffffff; background: #333333; }

#page2 { background-color: #f4695c; background-image: url(../images/p2/bg.jpg); background-size: cover; }
#page2 .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../images/p2/bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }
#page2 .logo {background-image: url(../images/p2/logo.png); background-repeat: no-repeat; }
#page2 .enter { background-image: url(../images/erweima_w.png); background-repeat: no-repeat; }
#page2 .txt1 { background: url(../images/p2/txt.png); }
#page2 .txt2 { color: #fff; }
#page2 .txt { color: #e04f42; background: #fff; }

#page3 { background-color: #f4695c; background-image: url(../images/p3/bg.jpg); background-size: cover; }
#page3 .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../images/p3/bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }
#page3 .logo {background-image: url(../images/p3/logo.png); background-repeat: no-repeat; }
#page3 .enter { background-image: url(../images/erweima_b.png); background-repeat: no-repeat; }
#page3 .txt1 { background: url(../images/p3/txt.png); }
#page3 .txt2 { color: #f3584a; }
#page3 .txt { color: #fff; background: #f3584a; }

#page4 { background-color: #f4695c; background-image: url(../images/p4/bg.jpg); background-size: cover; }
#page4 .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../images/p4/bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }
#page4 .logo {background-image: url(../images/p4/logo.png); background-repeat: no-repeat; }
#page4 .enter { background-image: url(../images/erweima_w.png); background-repeat: no-repeat; }
#page4 .txt1 { background: url(../images/p4/txt.png); }
#page4 .txt2 { color: #fff; }
#page4 .txt { color: #2aa29d; background: #fff; }

#page5 { background-color: #f4695c; background-image: url(../images/p5/bg.jpg); background-size: cover; }
#page5 .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../images/p5/bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }
#page5 .logo {background-image: url(../images/p5/logo.png); background-repeat: no-repeat; }
#page5 .enter { background-image: url(../images/erweima_b.png); background-repeat: no-repeat; }
#page5 .txt1 { background: url(../images/p5/txt.png); }
#page5 .txt2 { color: #32b7b2; }
#page5 .txt { color: #fff; background: #32b7b2; }

#page6 { background-color: #ffd400; }
#page6 .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../images/p6/bg.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; }
#page6 .logo { position: absolute; top: 50%; left: 50%; width: 600px; height: 240px; margin: -300px 0 0 -300px; background-image: url(../images/p6/txt.png); background-repeat: no-repeat;}
#page6 .logo { transform-style: preserve-3d; transition: all .5s ease;}
#page6.cont_0 .logo, #page6.cont_2 .logo { margin-top:-400px; opacity: 0 }

#page6 .enter { position: absolute; top: 50%; left: 50%; width: 160px; height: 200px; margin: 70px 0 0 -80px;  opacity: 1; cursor: pointer; }
#page6 .enter { background-image: url(../images/erweima_b.png); background-repeat: no-repeat; }
#page6 .enter { transform-style: preserve-3d; transition: all 1.5s ease; }
#page6.cont_0 .enter, #page6.cont_2 .enter { margin-top: 0px; opacity: 0 }

#page6 .txt { position: absolute; top: 50%; left: 50%; width: 800px; height: 200px; margin: -50px 0 0 -400px; text-align: center; transform-style: preserve-3d; transition: all 1s ease }
#page6.cont_0 .txt, #page6.cont_2 .txt { margin-top: 50px; opacity: 0 }
#page6 .t1 { font-size: 25px; line-height: 30px; color: #333333; width: 100%; text-align: center; }
#page6 .t2 { margin-top: 20px; font-size: 14px; line-height: 24px; color: #000; }

#page6 .tatter { position: absolute; top: 50%; left: 50%; width: 994px; height: 647px; margin: -270px 0 0 -470px; background: url(../images/p6/tatter.png); transform-style: preserve-3d; transition: all 1s ease }
#page6.cont_0 .tatter, #page6.cont_2 .tatter { margin-top: -220px; opacity: 0 }
#page6 .foot { position: absolute; left: 0px; width: 100%; height: 100px; transform-style: preserve-3d; transition: all 1s ease; background-image: url(../images/p6/foot_100.png); background-repeat: repeat-x; bottom: 0px; background-position: center; }
#page6.cont_0 .foot, #page6.cont_2 .foot { margin-bottom: -100px; opacity: 0 }


.animation_public .logo { position: absolute; top: 40px; left: 50%; width: 300px; height: 50px; margin-left: -150px; }
.animation_public .logo { transform-style: preserve-3d; transition: all .5s ease;}
.animation_public.cont_0 .logo, .animation_public.cont_2 .logo { top: -20px; opacity: 0 }
.animation_public .enter { position: absolute; top: 50px; left: 50px; width: 160px; height: 200px; text-align: center; opacity: 1; cursor: pointer; }
.animation_public .enter { transform-style: preserve-3d; transition: all .5s ease; }
.animation_public.cont_0 .enter, .animation_public.cont_2 .enter { top: -100px; opacity: 0 }

.animation .box_left { position: absolute; top: 50%; left: 50%; width: 500px; height: 533px; margin: -250px 0 0 -500px; }
.animation .box_left { transform-style: preserve-3d; transition: all .6s ease }
.animation.cont_0 .box_left, .animation.cont_2 .box_left { margin-left: -600px; opacity: 0 }
.animation .box_right { width: 500px; position: absolute; top: 50%; left: 50%; margin-left: 50px; }

.animation.cont_0 .txt1, .animation.cont_2 .txt1 { margin-left: 100px; opacity: 0 }
.animation.cont_0 .txt2, .animation.cont_2 .txt2 { margin-left: 140px; opacity: 0 }
.animation.cont_0 .txt3, .animation.cont_2 .txt3 { margin-left: 180px; opacity: 0 }
.animation.cont_0 .txt4, .animation.cont_2 .txt4 { margin-left: 220px; opacity: 0 }
.animation.cont_0 .txt5, .animation.cont_2 .txt5 { margin-left: 260px; opacity: 0 }

.animation2 .box_right { position: absolute; top: 50%; left: 50%; width: 500px; height: 533px; margin: -250px 0 0 50px; }
.animation2 .box_right { transform-style: preserve-3d; transition: all .6s ease }
.animation2.cont_0 .box_right, .animation2.cont_2 .box_right { margin-left: 150px; opacity: 0 }
.animation2 .box_left { width: 500px; position: absolute; top: 50%; left: 50%; margin-left: -500px; }

.animation_public .txt_box { width: 500px; }
.animation_public .txt1 { width: 500px; height: 150px; margin-top: -200px; text-indent: -9999px; }
.animation_public .txt2 { width: 500px; height: 40px; font-family: 'Microsoft YaHei', '黑体'; font-size: 40px; line-height: 40px; padding-top: 10px; padding-bottom: 40px; }
.animation_public .txt { float: left; font-family: 'Microsoft YaHei', '黑体'; font-size: 14px; line-height: 20px; width: 460px; margin-bottom: 10px; padding-top: 15px; padding-right: 20px; padding-bottom: 15px; padding-left: 20px; }
.animation_public .txt1 { transform-style: preserve-3d; transition: all .3s ease;}
.animation_public .txt2 { transform-style: preserve-3d; transition: all .4s ease;}
.animation_public .txt3 { transform-style: preserve-3d; transition: all .5s ease;}
.animation_public .txt4 { transform-style: preserve-3d; transition: all .6s ease;}
.animation_public .txt5 { transform-style: preserve-3d; transition: all .7s ease;}

.animation2.cont_0 .txt1, .animation2.cont_2 .txt1 { margin-left: -100px; opacity: 0 }
.animation2.cont_0 .txt2, .animation2.cont_2 .txt2 { margin-left: -140px; opacity: 0 }
.animation2.cont_0 .txt3, .animation2.cont_2 .txt3 { margin-left: -180px; opacity: 0 }
.animation2.cont_0 .txt4, .animation2.cont_2 .txt4 { margin-left: -220px; opacity: 0 }
.animation2.cont_0 .txt5, .animation2.cont_2 .txt5 { margin-left: -260px; opacity: 0 }



/* 界面截图切换box */
.featured-area{ height: 533px; width: 500px; }
.roundabout-holder{list-style:none;width:300px;height:533px;margin:0px auto;}
.roundabout-moveable-item{font-size:12px!important;height:533px;width:300px;cursor:pointer;-webkit-border-radius:5px;-moz-border-radius:5px;background:#f9f9f9;}
.roundabout-moveable-item img{height:100%;width:100%;background-color:#FFFFFF;margin:0;}
.roundabout-in-focus{cursor:auto;}
.roundabout-holder span{ display: block; position: absolute; bottom: 0px; color: #FFFFFF; z-index: 999; background-color: #333333; font-size: 12px; line-height: 37px; left: 0px; text-align: center; width: 100%; }
.roundabout a:active, .roundabout a:focus, .roundabout a:visited{outline:none;text-decoration:none;}
.roundabout li{margin:0}

.featured-area .tip { height: 60px; width: 200px; position: absolute; left: 50px; top: -50px; }
.featured-area .tip img{ height: 60px; width: 200px; }

.floadbox{ width: 1200px; height: 100px; position: relative; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; }
.floadbox .txt_box{ width: 910px; height: 40px; position: absolute; left: 290px; float: left; top: 30px; line-height: 40px; }
.floadbox .txt_box a{ color: #FFFFFF; margin-right: 20px; float: left; }
.floadbox .txt_box a:hover{ color: #FFD940; }
.floadbox .txt_box .p_1{ float: left; color: #fff; font-size: 14px; }
.floadbox .txt_box .p_2{ float: right; color: #fff; font-size: 14px; padding-top: 3px; }

#page44 { background: #242424 url(../images/p4/bg.png) center; background-size: cover }
#page44 .enter { position: absolute; top: 40px; left: 75px; width: 180px; height: 42px; font-size: 16px; color: #222; line-height: 42px; text-align: center; border: 2px #222 solid; opacity: 1; cursor: pointer; transform-style: preserve-3d; transition: all .4s .4s ease }
#page44 .enter a{ color: #000000;}
#page44 .enter:hover { opacity: .6 }
#page44 .enter em { display: inline-block; width: 16px; height: 16px; margin-right: 8px; background: url(../images/back_arrow.png) 0 -72px no-repeat; vertical-align: middle }
#page44 .logo { position: absolute; top: 40px; left: 50%; width: 259px; height: 34px; margin: 0 0 0 -130px; background: url(../images/p4/logo.png); transform-style: preserve-3d; transition: all .5s ease }
#page44.cont_0 .enter, #page44.cont_2 .enter, #page44.cont_0 .logo, #page44.cont_2 .logo { top: -20px; opacity: 0 }
#page44 .bgline { position: absolute; top: 0; left: 50%; width: 755px; height: 923px; margin: 0 0 0 -40px; background: url(../images/p4/bg_line.png) }
#page44 .houxuan { position: absolute; bottom: 0; left: 50%; width: 647px; height: 829px; margin: 0 0 0 -630px; background: url(../images/p4/houxuan.png); transform-style: preserve-3d; transition: all .8s ease }
#page44.cont_2 .houxuan { margin-left: -900px; opacity: 0 }
#page44 .txt1 { position: absolute; top: 50%; left: 50%; width: 414px; height: 170px; margin: -310px 0 0 120px; background: url(../images/p4/txt1.png); transform-style: preserve-3d; transition: all .4s ease }
#page44.cont_2 .txt1 { margin-left: 220px; opacity: 0 }
#page44 .txt2 { position: absolute; top: 50%; left: 50%; width: 298px; height: 37px; margin: -135px 0 0 126px; font: 18px/37px 'Microsoft YaHei', '黑体'; color: #000; text-align: center; letter-spacing: 1px; background: #ffc03a; transform-style: preserve-3d; transition: all .8s ease }
#page44.cont_2 .txt2 { margin-left: 260px; opacity: 0 }
#page44 .txt3 { position: absolute; top: 50%; left: 50%; width: 296px; height: 64px; margin: -70px 0 0 128px; background: url(../images/p4/txt2.png?2); transform-style: preserve-3d; transition: all 1.0s ease }
#page44.cont_2 .txt3 { margin-left: 280px; opacity: 0 }
#page44 .music { position: absolute; top: 50%; left: 50%; width: 425px; height: 260px; margin: -20px 0 0 128px; background: #ffc03a; transform-style: preserve-3d; transition: all 1.2s ease }
#page44 .mv { position: absolute; top: 50%; left: 50%; margin: 20px 0 0 128px; transform-style: preserve-3d; transition: all 1.2s ease }
#page44 .mv img { width: 420px; height: 235px; border: 3px #ffc03a solid; cursor: pointer; }
#page44.cont_2 .music, #page44.cont_2 .mv { margin-left: 360px; opacity: 0 }
#page44 .music .captionbg { position: relative; width: 421px; height: 190px; margin: 2px; padding: 20px 0 10px; text-align: center; line-height: 22px; font-size: 14px; letter-spacing: 1px; background: #000; overflow: hidden }
#page44 .music .caption { position: absolute; top: 0; left: 0; width: 100%; height: 600px; color: #b5b5b5; opacity: .3 }
#page44 .music .txtmask { position: absolute; bottom: 0; left: 0; width: 100%; height: 50px; background: -webkit-gradient(linear, 0 0%, 0 100%, from(rgba(0, 0, 0, .1)), to(#000)) }
#page44 .music .captionbg em { position: absolute; top: 60px; left: 170px; display: block; width: 77px; height: 85px; background: url(../images/p4/music.png) }
#page44 .music .operator { height: 22px; padding-top: 7px; color: #000 }
#page44 .music .operator span { display: inline-block; vertical-align: middle }
#page44 .music .playOrPause { width: 48px; height: 22px; cursor: pointer }
#page44 .music .audio-stop { background: url(../images/p4/btn_play.png) 13px 0 no-repeat }
#page44 .music .audio-play { background: url(../images/p4/btn_play.png) 13px -26px no-repeat }
#page44 .music .play-progress { width: 320px; height: 5px; margin-right: 10px; background: #d0920e; overflow: hidden }
#page44 .music .play-pointer { display: inline-block; width: 0; height: 20px; background: #000 }

.shirt_updown
{
position:relative;
animation:shirt_updown 1s linear 0s infinite alternate;
/* Firefox: */
-moz-animation:shirt_updown 1s linear 0s infinite alternate;
/* Safari and Chrome: */
-webkit-animation:shirt_updown 1s linear 0s infinite alternate;
/* Opera: */
-o-animation:shirt_updown 1s linear 0s infinite alternate;
}

@keyframes shirt_updown
{
0%   {padding: 0px 0 0 0;}
25%  {padding: 10px 0 0 0;}
50%  {padding: 20px 0 0 0;}
75%  {padding: 10px 0 0 0;}
100% {padding: 0px 0 0 0;}
}

@-moz-keyframes shirt_updown /* Firefox */
{
0%   {padding: 0px 0 0 0;}
25%  {padding: 10px 0 0 0;}
50%  {padding: 20px 0 0 0;}
75%  {padding: 10px 0 0 0;}
100% {padding: 0px 0 0 0;}
}

@-webkit-keyframes shirt_updown /* Safari and Chrome */
{
0%   {padding: 0px 0 0 0;}
25%  {padding: 10px 0 0 0;}
50%  {padding: 20px 0 0 0;}
75%  {padding: 10px 0 0 0;}
100% {padding: 0px 0 0 0;}
}

@-o-keyframes shirt_updown /* Opera */
{
0%   {padding: 0px 0 0 0;}
25%  {padding: 10px 0 0 0;}
50%  {padding: 20px 0 0 0;}
75%  {padding: 10px 0 0 0;}
100% {padding: 0px 0 0 0;}
}