/* CSS Document*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, blockquote{margin: 0; padding: 0;}
body{font-family: "Microsoft YaHei",Helvetica,Georgia,Arial,sans-serif;}
p, h1, h2, h3, h4, h5, h6{font-weight: normal; font-size: 100%; margin: 0}
address, caption, cite, code, dfn, em, th, var, optgroup{font-style: inherit;}
a:link{text-decoration: none;}
a:visited{text-decoration: none;}
a:hover{text-decoration: none;}
img{vertical-align: top; border: none;}
ol, ul, li{list-style: none;}
table{border-collapse: collapse;}
.clearit{clear: both; *display: inline;}
/*a:focus{-moz-outline-style: none;}*/
.h_20{width: 100%; height: 20px}
.h_30{width: 100%; height: 30px}
.h_40{width: 100%; height: 40px}
.h_50{width: 100%; height: 50px}
.h_60{width: 100%; height: 60px}
.h_70{width: 100%; height: 70px}
.fl{float: left;}
.fr{float: right;}
i, em{font-style: normal;}
iframe{border: 0; padding: 0; margin: 0;}
ul{margin: 0; padding: 0;}
/*overflow:hidden;text-overflow:ellipsis;white-space:nowrap;*/
.wrap{width: 100%; height: auto; max-width: 1920px; min-width: 1280px; margin: 0 auto; position: relative; overflow: hidden; display: none}
.mouse-tip{position: fixed; background: url("../image/mouse-tip.png") no-repeat center top; width: 66px; height: 161px; bottom: 50px; right: 100px; animation: nst 1.5s .2s infinite; -ms-animation: nst 1.5s .2s infinite; -webkit-animation: nst 1.5s .2s infinite;}
.wrap1{width: 100%; height: 1049px; background: url("../image/bg-zhan.jpg") no-repeat center top; position: relative; transition: all .4s ease-out; -moz-transition: all .4s ease-out; -ms-transition: all .4s ease-out; -webkit-transition: all .4s ease-out; -o-transition: all .4s ease-out;}
.logo{position: absolute; top: 10px; left: 20px; z-index: 10;}
.guide{position: absolute; top: 0; right: 50px; width: 644px; height: 86px; z-index: 10; background: url("../image/guide.png") no-repeat center top;}
.guide-main{float: left; width: 260px; height: 100%; margin-left: 87px;}
.guide1{float: left; width: 45px; height: 50px; margin: 0 0 0 50px;}
.guide2, .guide3{float: left; width: 45px; height: 50px; margin: 0 0 0 10px;}
.wrapper1{width: 1280px; height: 1049px; margin: 0 auto; position: relative;}
.mov{position: absolute; top: 108px; right: 310px; width: 94px; height: 95px; background: url("../image/mov.png") no-repeat center top;}
.zhiye-tab{position: absolute; top: 613px; right: 145px; width: 237px; height: 230px; background: url("../image/biao-zhan.png") no-repeat center top; transition: all .4s ease-out; -moz-transition: all .4s ease-out; -ms-transition: all .4s ease-out; -webkit-transition: all .4s ease-out; -o-transition: all .4s ease-out;}
.text-tip{position: absolute; top: 631px; right: 401px; width: 254px; height: 331px; background: url("../image/txt-tip.png") no-repeat center top;}
.line-tab{position: absolute; top: 800px; left: 50%; /*width: 550px;*/ height: 90px; padding-left: 5px; margin-left: -650px; background: url("../image/img-line.png") no-repeat left top;} .line-tab a{float: left; width: 50px; height: 70px; font-size: 18px; color: #ffffff; line-height: 100px; text-align: center; font-weight: bold; text-shadow: 1px 2px 8px #000000; margin-right: 32px; background: url("../image/dian1.png") no-repeat center top;} .line-tab a:hover, .line-tab a.on{background: url("../image/dian1-fang.png") no-repeat center top;}
.wrap2{width: 100%; height: 851px; position: relative; background: url("../image/wrapbg.jpg") no-repeat center top;}
.wrapper2{width: 1280px; height: 849px; margin: 0 auto; position: relative; padding-top: 2px;}
.tab-box{width: 100%; height: 106px; padding-top: 13px; text-align: center;}
.tab{display: inline-block; width: 108px; height: 106px; margin: 0 25px;}
.tab6{width: 162px; margin: 0 20px;}
.tab1{background: url("../image/tab-1.png") no-repeat center} .tab1:hover, .tab1.active{background: url("../image/tab-1-on.png") no-repeat 5px 0;}
.tab2{background: url("../image/tab-2.png") no-repeat center} .tab2:hover, .tab2.active{background: url("../image/tab-2-on.png") no-repeat -2px 0;}
.tab3{background: url("../image/tab-3.png") no-repeat center} .tab3:hover, .tab3.active{background: url("../image/tab-3-on.png") no-repeat center}
.tab4{background: url("../image/tab-4.png") no-repeat center} .tab4:hover, .tab4.active{background: url("../image/tab-4-on.png") no-repeat center}
.tab5{background: url("../image/tab-5.png") no-repeat center} .tab5:hover, .tab5.active{background: url("../image/tab-5-on.png") no-repeat center}
.tab6{background: url("../image/tab-6.png") no-repeat center; background-size: 144px 106px;} .tab6:hover, .tab6.active{background: url("../image/tab-6-on.png") no-repeat center}
.tab7{width: 96px; background: url("../image/nav-ys.png") no-repeat center;} .tab7:hover, .tab7.active{background: url("../image/nav-ys-on.png") no-repeat center; background-size: 100% 106px;}
.main{position: relative; width: 990px; height: 540px; margin: 130px 0 0 145px;}
.content{display: none; position: relative;}
.btns-cate{position: absolute; left: 0; top: -100px; width: 100%; height: 66px;} .btns-cate a{display: block; float: left; width: 262px; height: 58px; margin-right: 22px; text-align: center; line-height: 58px; font-size: 26px; font-weight: bold; color: #7f5a33; border: 4px solid #7f5a33;} .btns-cate a.on{background-color: #7f5a33; color: #f8f4ea;}
.wp-skill{display: none;}
.wp-skill3{display: block;}
.con1{display: block;}
.con-title{width: 100%; height: 24px; padding-left: 33px; line-height: 24px; font-size: 18px; color: #202e31; background: url("../image/icon.png") no-repeat left center;} .con-title h1{display: inline-block; font-size: 24px; color: #7f5a33; font-weight: bold; margin-bottom: 5px;} .con-title p{display: inline-block; white-space: nowrap;} .con-title p.sp{font-size: 14px;}
.wp-skill3 .con-title h1{display: block;}
.con-focus{width: 990px; height: 420px; margin-top: 55px;}
.focus-dao{background: url("../image/focus-dao.jpg") no-repeat center top;}
.focus-fa{background: url("../image/focus-fa.jpg") no-repeat center top;}
.focus-zhan{background: url("../image/focus-zhan.jpg") no-repeat center top;}
.focus-ci{background: url("../image/focus-ci.jpg") no-repeat center top;}
.focus-archer{background: url("../image/bg-skill-archer.jpg") no-repeat center top;}
.focus-lq{background: url("../image/skill2.png") no-repeat center top;}
.wp-skill1 .focus-zhan{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0722/zs45.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill1 .focus-fa{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0722/fs45.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill1 .focus-dao{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0722/ds45.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill1 .focus-ci{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0722/ck45.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill1 .focus-archer{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0722/gs45.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill1 .focus-lq{background: url("../image/skill1.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill3 .focus-zhan{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0314/level50/zs.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill3 .focus-fa{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0314/level50/fs.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill3 .focus-dao{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0314/level50/ds.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill3 .focus-ci{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0314/level50/ck.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill3 .focus-archer{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0314/level50/gs.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill3 .focus-lq{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0314/level50/lq.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill1 .focus-ys{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0307/img-jn45.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill2 .focus-ys{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0307/img-jn40.gif") no-repeat left top; background-size: auto 100%;}
.wp-skill3 .focus-ys{background: url("https://static.web.sdo.com/cq/pic/act/2019/w/0229tmjx/0307/img-jn50.gif") no-repeat left top; background-size: auto 100%;}
.con-list{width: 334px; height: 400px; padding-top: 20px; background-color: rgba(0, 0, 0, .6); animation: fadeRight 1s .2s ease both; -ms-animation: fadeRight 1s .2s ease both; -webkit-animation: fadeRight 1s .2s ease both; -moz-animation: fadeRight 1s .2s ease both;}
@keyframes fadeRight{0%{opacity: 0; transform: translateX(20px)} 100%{opacity: 1; transform: translateY(0)}}
@-ms-keyframes fadeRight{0%{opacity: 0; -ms-transform: translateX(20px)} 100%{opacity: 1; -ms-transform: translateY(0)}}
@-webkit-keyframes fadeRight{0%{opacity: 0; -webkit-transform: translateX(20px)} 100%{opacity: 1; -webkit-transform: translateY(0)}}
@-moz-keyframes fadeRight{0%{opacity: 0; -moz-transform: translateX(20px)} 100%{opacity: 1; -moz-transform: translateY(0)}}
.con-list h2{font-size: 24px; color: #c1a88e; font-weight: bold; margin: 4px 0 0 30px;}
.con-list h3{font-size: 22px; color: #1e1613; text-indent: 18px; width: 151px; height: 51px; line-height: 35px; margin: 23px 0 0 -12px; background: url("../image/tbg.png") no-repeat center top; background-size: 100% 100%;}
.focus-sp h3{height: 43px; line-height: 33px; font-size: 18px; margin: 10px 0 0 -12px;}
.con-list p{width: 90%; font-size: 15px; color: #eeeeee; margin: 0 0 20px 15px;}
.focus-sp .con-list p{font-size: 14px; margin: 0 0 0 15px;}
.overlay{position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 150; background: url("../image/popupbg.png") no-repeat center top; background-size: cover; display: none;}
.popup{position: fixed; top: 0; left: 0; width: 100%; height: 1080px; z-index: 160; display: none;}
.popup-wrapper{width: 1280px; height: 100%; margin: 0 auto;}
.popup-guide{position: fixed; left: 50%; top: 60%; transform: translate(-50%, -50%); width: 1140px; height: 700px;} .popup-guide i{display: block; position: absolute; top: 0; width: 1px; height: 413px; background-color: #938c87;} .popup-guide .l1{left: 285px;} .popup-guide .l2{left: 568px;} .popup-guide .l3{left: 852px;} .popup-guide a{display: block; float: left; width: 284px; height: 413px; position: relative;}
.popup-guide1{background: url("../image/btn-menu1.png") no-repeat center 44px; border-left: none !important;}
.popup-guide2{background: url("../image/btn-menu2.png") no-repeat center 44px;}
.popup-guide3{background: url("../image/menu3.png") no-repeat center 44px;}
.popup-guide4{background: url("../image/menu4.png") no-repeat center 44px;}
.popup-guide a.off{-webkit-animation: bounceOutDown 1s ease both; -moz-animation: bounceOutDown 1s ease both;}
@-webkit-keyframes bounceOutDown{0%{-webkit-transform: translateY(0)} 20%{opacity: 1; -webkit-transform: translateY(-20px)} 100%{opacity: 0; -webkit-transform: translateY(2000px)}}
@-moz-keyframes bounceOutDown{0%{-moz-transform: translateY(0)} 20%{opacity: 1; -moz-transform: translateY(-20px)} 100%{opacity: 0; -moz-transform: translateY(2000px)}}
.popup-guide a.animate{-webkit-animation: bounceOutUp 1s ease both; -moz-animation: bounceOutUp 1s ease both;}
@-webkit-keyframes bounceOutUp{0%{-webkit-transform: translateY(0)} 20%{opacity: 1; -webkit-transform: translateY(20px)} 100%{opacity: 0; -webkit-transform: translateY(-2000px)}}
@-moz-keyframes bounceOutUp{0%{-moz-transform: translateY(0)} 20%{opacity: 1; -moz-transform: translateY(20px)} 100%{opacity: 0; -moz-transform: translateY(-2000px)}}
.jian{position: absolute; bottom: 50px; left: 50%; margin-left: -17px; width: 34px; height: 17px; background: url("../image/jian.png") no-repeat center top;}
.popup-guide a:hover .jian{animation: nnt 1.5s infinite; -ms-animation: nnt 1.5s infinite; -webkit-animation: nnt 1.5s infinite;}
@keyframes nnt{0%,100%{transform: translate(0,0px);} 50%{transform: translate(0,-10px);}}
@-ms-keyframes nnt{0%,100%{-ms-transform: translate(0,0px);} 50%{-ms-transform: translate(0,-10px);}}
@-webkit-keyframes nnt{0%,100%{-webkit-transform: translate(0,0px);} 50%{-webkit-transform: translate(0,-10px);}}
.back{display: block; position: absolute; left: 50%; top: 472px; width: 122px; height: 149px; margin-left: -61px; background: url("../image/back.png") no-repeat center top; cursor: pointer;}
.container{width: 50%; height: 100%; margin: 0 auto; position: relative; font-size: 15px; color: #cccccc; line-height: 30px; display: none;} .container .txt img{margin: 20px 10px 20px 0;} .container h2{font-weight: bold; font-size: 20px; margin: 20px 0;}
.popu-title{position: absolute; left: -260px; top: 60px; -webkit-animation: bounceInDown .8s ease both; -moz-animation: bounceInDown .8s ease both;}
.group{width: 100%; height: 70%; margin: 5% auto 0 auto; ;} .group .title{width: 100%; height: 66px; overflow: auto;}
@-webkit-keyframes bounceInDown{0%{opacity: 0; -webkit-transform: translateY(-500px)} 60%{opacity: 1; -webkit-transform: translateY(30px)} 80%{-webkit-transform: translateY(-10px)} 100%{-webkit-transform: translateY(0)}}
@-moz-keyframes bounceInDown{0%{opacity: 0; -moz-transform: translateY(-500px)} 60%{opacity: 1; -moz-transform: translateY(30px)} 80%{-moz-transform: translateY(-10px)} 100%{-moz-transform: translateY(0)}}
.titlebottom{content: ""; position: absolute; bottom: -90px; width: 100%; height: 80px; background: url("../image/titlebottom.png") no-repeat center top;}
.title1{background: url("../image/title1.png") no-repeat left top;}
.title2{background: url("../image/title1.png") no-repeat left top;}
.title3{background: url("../image/title4.png") no-repeat left top;}
.title4{background: url("../image/title41.png") no-repeat left top;}
.group .txt{width: 100%; height: 90%; margin: 5% auto 0 auto; ; overflow: auto;}
.close{position: absolute; top: 50%; left: -100px; width: 80px; height: 80px; background: url("../image/close.png") no-repeat center top;}
#loading{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url("../image/loadingbg.jpg"); background-size: cover; z-index: 150; display: block;}
.loading-guide{position: absolute; top: 15px; right: 25px; width: 185px; height: 55px; background: url("../image/main_btn.png") no-repeat center top;} .loading-guide a{float: left; width: 33.3%; height: 55px;}
.loading-box{position: absolute; top: 50%; left: 50%; width: 900px; height: 900px; transform: translate(-50%, -50%); background: url("../image/yuan.png") no-repeat center top;}
.load1{position: absolute; top: 138px; left: 50%; margin-left: -309px; width: 618px; height: 619px; background: url("../image/loading1.png") no-repeat center top; animation: roll1 25s linear infinite; -webkit-animation: roll1 25s linear infinite; -ms-animation: roll1 25s linear infinite; -moz-animation: roll1 25s linear infinite;}
.load2{position: absolute; top: 80px; left: 50%; margin-left: -367px; width: 735px; height: 738px; background: url("../image/loading2.png") no-repeat center top; animation: roll2 20s linear infinite; -webkit-animation: roll2 20s linear infinite; -ms-animation: roll2 20s linear infinite; -moz-animation: roll2 20s linear infinite;}
.load3{position: absolute; top: 30px; left: 50%; margin-left: -417px; width: 835px; height: 835px; background: url("../image/loading3.png") no-repeat center top; animation: roll1 25s linear infinite; -webkit-animation: roll1 25s linear infinite; -ms-animation: roll1 25s linear infinite; -moz-animation: roll1 25s linear infinite;}
.load4{position: absolute; top: 260px; left: 50%; margin-left: -390px; width: 726px; height: 397px; background: url("../image/title.png") no-repeat center top; animation: scale1 0.6s .5s both; -webkit-animation: scale1 0.6s .5s both;}
@-webkit-keyframes scale1{0%{opacity: 0; -webkit-transform: scale(10,10);} 80%{-webkit-transform: scale(.8,.8);} 100%{opacity: 1; -webkit-transform: scale(1,1);}}
@keyframes scale1{0%{opacity: 0; transform: scale(10,10);} 80%{transform: scale(.8,.8);} 100%{opacity: 1; transform: scale(1,1);}}
.load5{position: absolute; top: 180px; left: 50%; margin-left: -40px; width: 94px; height: 95px; background: url("../image/mov.png") no-repeat center top;}
.load6{position: absolute; top: 915px; left: 50%; margin-left: -790px; width: 1500px; height: 397px; background: url("../image/dixia.png") no-repeat center top; animation: scale1 0.6s .5s both; -webkit-animation: scale1 0.6s .5s both;}
@keyframes roll1{0%{transform: rotate(0deg);} 100%{transform: rotate(360deg);}}
@-ms-keyframes roll1{0%{-ms-transform: rotate(0deg);} 100%{-ms-transform: rotate(360deg);}}
@-webkit-keyframes roll1{0%{-webkit-transform: rotate(0deg);} 100%{-webkit-transform: rotate(360deg);}}
@-moz-keyframes roll1{0%{-moz-transform: rotate(0deg);} 100%{-moz-transform: rotate(360deg);}}
@keyframes roll2{0%{transform: rotate(0deg);} 100%{transform: rotate(-360deg);}}
@-ms-keyframes roll2{0%{-ms-transform: rotate(0deg);} 100%{-ms-transform: rotate(-360deg);}}
@-webkit-keyframes roll2{0%{-webkit-transform: rotate(0deg);} 100%{-webkit-transform: rotate(-360deg);}}
@-moz-keyframes roll2{0%{-moz-transform: rotate(0deg);} 100%{-moz-transform: rotate(-360deg);}}
.enter{position: absolute; bottom: 275px; right: 150px; width: 102px; height: 33px; background: url("../image/enter.png") no-repeat center top; animation: st 1.5s .2s infinite; -ms-animation: st 1.5s .2s infinite; -webkit-animation: st 1.5s .2s infinite;}
@keyframes st{0%,100%{transform: translate(0,0px);} 50%{transform: translate(-18px,0);}}
@-ms-keyframes st{0%,100%{-ms-transform: translate(0,0px);} 50%{-ms-transform: translate(-18px,0);}}
@-webkit-keyframes st{0%,100%{-webkit-transform: translate(0,0px);} 50%{-webkit-transform: translate(-18px,0);}}
@keyframes nst{0%,100%{transform: translate(0,0px);} 50%{transform: translate(0,-18px);}}
@-ms-keyframes nst{0%,100%{-ms-transform: translate(0,0px);} 50%{-ms-transform: translate(0,-18px);}}
@-webkit-keyframes nst{0%,100%{-webkit-transform: translate(0,0px);} 50%{-webkit-transform: translate(0,-18px);}}
.highlight{color: #f73535;}
.video_box{position: fixed; left: 50%; top: 50%; margin: -230px 0 0 -443px; z-index: 190; width: 886px; height: 500px; display: none;}
.video_close{width: 47px; height: 46px; cursor: pointer; position: absolute; text-indent: -9999px; top: -47px; right: 5px; background: url(../image/s1_close.png) center top no-repeat;}
table{position: relative; margin: 10px 0 20px 0; border-collapse: collapse; text-align: center; font-size: 15px !important;} table p{padding-left: 0 !important; width: 100% !important;} table strong{display: inline-block !important; position: relative !important; top: auto !important; left: auto !important; padding: 0 !important; margin: 0 !important; background: none !important; color: #dbdbdb !important; width: auto !important; white-space: nowrap;} table strong:after{display: none !important;} table th{font-weight: bold;} table td, table th{border: 1px solid #cccccc; padding: 2px} table strong:after{display: none !important;}
h6.ps{position: absolute; left: 0; top: 510px; font-size: 14px; color: #666;}