@charset "utf-8";

@import url(../css/xtl_logo.css);

body{ font-family:'微软雅黑','宋体',sumsun,Helvetica,sans-serif; font-size:14px; line-height:24px; color:#737373;background-color: #fefcf5;/*padding-top: 55px;*/}

.sp{background: url(../images/sp.png) no-repeat;}

.db{text-indent: -9999em;display: block}

.c:before,.c:after {content:"";display:table;}

.c:after {clear:both;}

:focus{outline: none;}

.pa{position:absolute;}

.pr{position:relative;}

.fl{float:left;}

.fr{float:right;}

.content{width:1000px;margin:0 auto;position:relative;}



.pop1{width:800px;height:500px;border:3px solid #8e2c3a;background:#8e2c3a;position:relative;display:none;}

.video1{width:800px;height:500px;position: relative;}

.close1{width:23px;height:23px;background-position:-572px -354px;position:absolute;right:-35px;top:0;transition:transform .4s;}

.close1:hover{transform:rotate(180deg);}



#cyou_bottom{position:absolute;left:0;bottom:-10px;display:none;}

.section{overflow:hidden;position:relative;}

.section1{background:url(../images/bg.jpg) no-repeat 50% 0;}

.yun{background:url(../images/yun.png) no-repeat;width:1920px;height:1025px;left:-460px;top:0;}

.xtl_logo_lk,.xtl_logo_bg{left:50px;top:60px;position:fixed;transform-origin:left top;-ms-transform-origin:left top;-moz-transform-origin:left top;-webkit-transform-origin:left top;}

.xtl_logo_lk{z-index:99;}

.xtl_logo_bg{background:url(../images/logo.png) no-repeat;}

.slogan{width:908px;height:305px;background-position:0 0;margin-left:-454px;left:50%;top:10px;}

.btn_vid{width:68px;height:69px;left:50%;top:260px;margin-left:-45px;}

.vid_bg{width:68px;height:69px;background-position:-37px -341px;left:0;top:0;animation:change 2s linear infinite;}

.vid_icon{width:33px;height:39px;background-position:0 -341px;left:50%;top:50%;margin:-20px 0 0 -12px;}

.hd_tit{width:847px;height:29px;background-position:0 -308px;left:50%;margin-left:-424px;top:340px;}

.hd_txt{background:url(../images/hd_tit.png) no-repeat;width:874px;height:103px;left:50px;top:380px;text-align:center;font-size:20px;line-height:30px;color:#70242d;padding-top:20px;}

.rw1{width:264px;height:450px;background:url(../images/rw1.png) no-repeat;left:-170px;top:560px;}

.rw2{width:252px;height:411px;background:url(../images/rw2.png) no-repeat;left:5px;top:600px;}

.rw3{width:264px;height:358px;background:url(../images/rw3.png) no-repeat;left:260px;top:605px;}

.rw4{width:277px;height:540px;background:url(../images/rw4.png) no-repeat;left:450px;top:420px;}

.rw5{width:295px;height:460px;background:url(../images/rw5.png) no-repeat;left:720px;top:560px;}

.rw6{width:242px;height:229px;background:url(../images/rw6.png) no-repeat;left:860px;top:770px;}

.hb_box{transform:rotate(-10deg);}

.hb{position:absolute;}

.hb1{left:-285px;top:-40px;animation:hb1 9s .3s linear both infinite;}

.hb2{left:220px;top:-20px;animation:hb2 5s .4s linear both infinite;}

.hb3{left:-105px;top:150px;animation:hb2 4s .1s linear both infinite;}

.hb4{left:-275px;top:280px;animation:hb1 9s 0s linear both infinite;}

.hb5{left:785px;top:450px;animation:hb2 4.5s .6s linear both infinite;}

.hb6{left:1030px;top:300px;animation:hb1 7s .8s linear both infinite;}

.hb7{left:955px;top:10px;animation:hb2 6.5s .3s linear both infinite;}

.hb8{left:185px;top:600px;animation:hb1 6s .5s linear both infinite;}

.mouse{background-position:-407px -342px;width:32px;height:52px;left:50%;bottom:60px;margin-left:-16px;animation:flash 1.8s ease both infinite;}

.mouse1{background-position:-460px -342px;}

@keyframes flash{

	0%{transform:translateY(0px);}

	50%{transform:translateY(-15px);}

	100%{transform:translateY(0px);}

}



.active .yun{animation:scale 1.6s  .2s ease both;}

.active .slogan{animation:scaleA 1s ease both;}

.active .btn_vid{animation:fadeInUp 1s .2s ease both;}

.active .hd_tit{animation:fadeInUp 1s .4s ease both;}

.active .hd_txt{animation:fadeInUp 1s .6s ease both;}

.active .rw1,.active .rw6{animation:fadeInUp 1s 1s ease both;}

.active .rw2,.active .rw5{animation:fadeInUp 1s .8s ease both;}

.active .rw3,.active .rw4{animation:fadeInUp 1s .6s ease both;}

@keyframes hb1{

	from{transform: translate(0px,-70px);opacity: 0;}

	20%{transform: translate(30px,0px);opacity: 1;}

	35%{transform: translate(60px,70px);opacity: 1;}

	50%{transform: translate(90px,140px);opacity: 1;}

	75%{transform: translate(120px,210px);opacity: 1;}

	to{transform: translate(150px,280px);opacity: 0;}

}

@keyframes hb2{

	from{transform: translate(10px,-80px);opacity: 0;}

	20%{transform: translate(20px,-44px);opacity: 1;}

	35%{transform: translate(30px,-8px);opacity: 1;}

	50%{transform: translate(40px,32px);opacity: 1;}

	75%{transform: translate(50px,76px);opacity: 1;}

	to{transform: translate(80px,100px);opacity: 0;}

}

@keyframes fadeInUp{

0%{opacity:0;transform:translateY(20px)}

100%{opacity:1;transform:translateY(0)}

}

@keyframes scale{

	0%{opacity:0;transform:scale(2);}

	100%{opacity:1;transform:scale(1);}

}

@keyframes change{

0%{transform:rotate(0deg)}

50%{transform:rotate(180deg)}

100%{transform:rotate(360deg)}

}

@keyframes scaleA{

	0%{opacity:0;transform:scale(2,2);}

	80%{transform:scale(.9,.9);}

	100%{opacity:1;transform:scale(1,1);}

}

.mist_wrapper{width:1920px;height:730px;position:absolute;left:50%;bottom:40px;margin-left:-960px;overflow:hidden;}

.mist_item{display:block;width:1920px;height:730px;background:url(../images/yw.png) left top no-repeat;position:absolute;left:0;bottom:0;opacity:0;filter:alpha(opacity=0);animation: mist 6s linear infinite forwards;animation:mist 6s linear infinite forwards;}

.mist_item:nth-child(1){bottom:-200px;opacity: 1;animation: none;animation: none;filter: alpha(opacity=100);}

.mist_item:nth-child(2){left:100px;animation-delay:2s;animation-delay:2s;}

.mist_item:nth-child(3){animation-delay:4s;animation-delay:4s;left:200px;}

.mist_item:nth-child(3){animation-delay:6s;animation-delay:6s;left:300px;}

@keyframes mist{

	0%{opacity:1;transform:translate3d(0, 730px, 0);transform:translate3d(0, 730px, 0);}

	90%{opacity:0;transform:translate3d(0, -50px, 0);transform:translate3d(0, -50px, 0);}

	100%{opacity: 0;transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}

}

@keyframes mist {

	0%{opacity:1;transform:translate3d(0, 730px, 0);transform:translate3d(0, 730px, 0);}

	90%{opacity:0;transform:translate3d(0, -50px, 0);transform:translate3d(0, -50px, 0);}

	100%{opacity:0;transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);}

}



.section2{background:url(../images/bg1.jpg) no-repeat 50%;}

.tit7{width:634px;height:18px;background-position:0 -974px;margin:40px auto 40px;padding-top:71px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.tab_con{display:none;height:250px;}

.npc_box{height:255px;width:560px;margin:0 auto;position:relative;}

.npc_box li{position:absolute;cursor:pointer;}

.npc_bg{display:block;}

.npc_tips{position:absolute;}

.npc1{left:0px;top:38px;width:144px;height:148px;}

.npc1 .npc_bg{width:144px;height:148px;background:url(../images/npc1.png) no-repeat;background-position:0 0;}

.npc1 .npc_tips{width:37px;height:126px;background-position:-677px -458px;left:0;top:23px;}

.npc2{left:117px;top:16px;width:100px;height:115px;}

.npc2 .npc_bg{width:100px;height:115px;background:url(../images/npc2.png) no-repeat;background-position:0 0;}

.npc2 .npc_tips{width:37px;height:110px;background-position:-785px -458px;right:-15px;top:15px;}

.npc3{left:261px;top:50px;width:110px;height:157px;}

.npc3 .npc_bg{width:110px;height:157px;background:url(../images/npc3.png) no-repeat;background-position:0 0;}

.npc3 .npc_tips{width:37px;height:120px;background-position:-836px -458px;right:-22px;top:35px;}

.npc4{left:450px;top:10px;width:74px;height:140px;}

.npc4 .npc_bg{width:74px;height:140px;background:url(../images/npc4.png) no-repeat;background-position:0 0;}

.npc4 .npc_tips{width:37px;height:110px;background-position:-731px -458px;right:-25px;top:25px;}

.npc_txt{text-align:center;font-size:14px;color:#c04466;line-height:24px;}



.section3{background:url(../images/bg1.jpg) no-repeat 50% 0;}

.tit1{width:640px;height:18px;background-position:0 -415px;margin:40px auto 30px;padding-top:71px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.con{width:1000px;height:800px;top:50%;left:50%;margin:-440px 0 0 -500px;position:absolute;*margin-top:-400px !important;}

.hd_js{width:440px;padding-left:25px;}

.hd_tits{font-size:16px;color:#c04466;font-weight:bold;line-height:24px;padding-bottom:10px;text-align:left;border-bottom: 1px dashed #ccc;}

.hd_icon{width:11px;height:11px;background-position:-532px -360px;}

.hd_tits1{text-align:left;}

.hd_tits1 .hd_icon{left:-15px;top:7px;}

.hd_txts{font-size:16px;color:#37292b;line-height:24px;padding:10px 0; border-bottom: 1px dashed #37292b;}

.hd_txts em{color:red;}

.jl_con{width:485px;text-align:center;}

.jl_tit{width:128px;}

.jl_t1{width:128px;height:37px;background-position:-744px -347px;font-size:18px;color:#210c10;line-height:36px;margin-bottom:68px;}

.jl_t1s{margin-top:30px;}

.jl_t1 em{font-weight:bold;color:#ba373a;}

.jl_list{width:350px;}

.jl_l{height:105px;}

.jl_ls{padding-top:10px;}

.jl_l li{float:left;width:85px;}

.jl_l img{display:block;width:77px;height:79px;margin:0 auto;}

.jl_l span{display:block;height:24px;line-height:24px;font-size:14px;color:#4b3a3d;}

.jl_l .crt{color:#f0355f;}

.menu{background:url(../images/nav_bg.png) no-repeat;width:11px;height:383px;position:fixed;right:170px;top:50%;margin-top:-200px;transform-origin:right center;-ms-transform-origin:right center;-moz-transform-origin:right center;-webkit-transform-origin:right center;}

.menu li{position:absolute;width:143px;}

.n1{left:-1px;top:28px;}

.n2{left:-1px;top:88px;}

.n3{left:-1px;top:148px;}

.n4{left:-1px;top:208px;}

.n5{left:-1px;top:268px;}

.n6{left:-1px;top:328px;}

.nava{display:block;width:110px;height:26px;background-position:-114px -342px;text-align:center;line-height:26px;color:#fff;font-size:16px;padding:0 0 0 33px;}

.menu .nava:hover{background-position:-642px -415px;}

.menu .active,.menu .active1{animation:flipInY 1.2s ease-in-out both;transform-origin:140px center;left:-135px;}

@keyframes flipInY{

0%{transform:perspective(400px) rotateY(180deg);}

40%{transform:perspective(400px) rotateY(-5deg);}

70%{transform:perspective(400px) rotateY(5deg);}

100%{transform:perspective(400px) rotateY(0deg);}

}

.active .nava,.active1 .nava{width:118px;height:32px;line-height:32px;background-position:-112px -375px;padding:0 27px 0 0;}

.active1 .nava:hover,.active .nava:hover{background-position:-112px -375px;}

.navb{width:118px;height:36px;background-position:-613px -345px;font-size:14px;color:#be2848;text-align:center;line-height:18px;padding-top:4px;margin-top:8px;display:none;}

.navb em{color:#933a4d;display:block;}

.active .navb,.active1 .navb{display:block;}

.cur,.navb:hover{background-position:-270px -354px;}

.navb:nth-of-type(2){animation:fadeInDown .6s ease both;}

.navb:nth-of-type(3){animation:fadeInDown .6s .1s ease both;}

.navb:nth-of-type(4){animation:fadeInDown .6s .3s ease both;}

.navb:nth-of-type(5){animation:fadeInDown .6s .5s ease both;}

.navb:nth-of-type(6){animation:fadeInDown .6s .7s ease both;}

.navb:nth-of-type(7){animation:fadeInDown .6s .9s ease both;}



.tit2{width:601px;height:18px;background-position:0 -508px;margin:40px auto 30px;padding-top:72px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.hd_tits .hd_icon1{left:-17px;top:8px;}

.hd_tits .hd_icon2{right:-17px;top:8px;}

.qd_txt{text-align:center;font-size:15px;color:#37292b;line-height:20px;padding-bottom:10px;}

.qd_txt em{color:#e43b6a;}

.qd_list{width:910px;margin:0 auto;height:165px;text-align:center;}

.qd_list li{float:left;width:129px;position:relative;height:165px;}

.qd_tit{left:0;top:5px;width:100%;line-height:24px;height:24px;font-size:14px;color:#fff;}

.qd_list img{display:block;margin:0 auto;}

.qd_name{height:28px;line-height:28px;font-size:14px;color:#4b3a3d;}



.tit3{width:601px;height:18px;background-position:0 -508px;margin:40px auto 20px;padding-top:70px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.jh_con{width:960px;margin:0 auto;text-align:center;transform-origin:top center;-ms-transform-origin:top center;-moz-transform-origin:top center;-webkit-transform-origin:top center;}

.jh_tabx1{width:473px;height:422px;background:url(../images/tab1.png) no-repeat 50% bottom;padding-bottom:10px;}

.jh_tab1{width:473px;height:388px;}

.jh_tabx2{width:473px;height:422px;background:url(../images/tab2.png) no-repeat 50% bottom;padding-bottom:10px;}

.jh_tab2{width:473px;height:388px;}

.jh_con th{height:30px;padding-top:4px;line-height:30px;text-align:center;font-size:14px;color:#fff;}

.jh_con td{font-size:14px;color:#4b3a3d;line-height:20px;}

.jh_con em{color:red;}



.tit4{width:601px;height:18px;background-position:0 -508px;margin:40px auto 30px;padding-top:71px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.mc_con{background:url(../images/mc_rw.png) no-repeat left 25px;width:554px;height:301px;padding-left:306px;margin:0 auto;padding-top:25px;}

.mc_list{padding-top:10px;}

.mc_list li{float:left;width:110px;height:122px;display:inline;}

.mc_list .ml{margin-left:55px;}

.mc_list li img{display:block;margin:0 auto 4px;}

.mc_txt{font-size:14px;color:#554547;line-height:16px;text-align:center;}



.tit5{width:605px;height:18px;background-position:0 -508px;margin:40px auto 30px;padding-top:71px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.nx_con{/*background:url(../images/nx_rw.png) no-repeat left top;*/padding-top:15px;min-height:373px;/*padding-left:295px;*//*width:600px;*/margin:0 auto;border: 1.5px dashed #c04466;border-radius: 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px;-ms-border-radius: 20px;padding-left: 30px;}

.nx_list1{/*width:505px;*/margin:0 auto;}

.nx_list1 li{width:101px;}

.nx_list2{/*width:572px;*/margin:0 auto;}

.nx_list2 li{width:95px;}



.tit6{width:677px;height:18px;background-position:0 -508px;margin:40px auto 30px;padding-top:69px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.qm_con{width:920px;margin:0 auto;padding-left:30px;}

.qm_box{height:230px;}

.qm_l{width:590px;}

.tips{font-size:16px;color:#37292b;line-height:20px;padding-bottom:35px;}

.tips1{padding-bottom:10px;}

.qm_rule li{float:left;width:100%;font-size:16px;color:#37292b;line-height:24px;}

.qm_rule em{float:left;width:20px;}

.qm_rule span{float:left;width:435px;}

.code{width:174px;text-align:center;font-size:16px;color:#4b3a3d;line-height:26px;}

.code img{display:block;margin:0 auto 2px;}

.qm_jl{height:170px;padding-top:10px;}

.qm_jl li{float:left;width:103px;margin-right:225px;position:relative;}

.qm_jl .last{margin-right:0;}

.qm_txt{font-size:14px;color:#4b3a3d;line-height:24px;text-align:center;}

.qm_num{font-size:16px;color:#4b3a3d;line-height:24px;width:60px;left:115px;top:48px;}



.section4{background:url(../images/bg3.jpg) no-repeat 50% 0;}

.tit8{width:625px;height:18px;background-position:0 -1067px;margin:40px auto 15px;padding-top:71px;font-size:18px;color:#9a2f39;line-height:18px;text-align:center;}

.lb_con{width:900px;height:540px;text-align:center;margin:0 auto;padding-top:10px;}

.lb_box{display:none;}

.lb_pic{width:785px;height:429px;margin:0 auto 5px;}

.lb_bg{background:url(../images/lb_bg.png) no-repeat;width:791px;height:438px;left:-4px;top:-8px;}

.lb_txt{text-align: left; font-size:16px;color:#4b3a3d;line-height:28px;transform-origin:center top;-ms-transform-origin:center top;-moz-transform-origin:center top;-webkit-transform-origin:center top;}

.lb_txt em{color:#e53b6b;}

.lb_tab{width:34px;left:0;top:0;z-index:999;}

.lb_tab a{display:block;width:34px;height:151px;background-position:-838px -599px;font-size:18px;color:#fff;line-height:18px;margin-bottom:30px;}

.lb_tab a span,.lb_tab a em{display:inline-block;vertical-align:middle;cursor:pointer;}

.lb_tab a em{height:100%;}

.lb_tab .curs{background-position:-783px -599px;}

.page_tips{font-size:14px;color:#4b3a3d;line-height:20px;right:20%;bottom:200px;}



.active .con .xtl_logo_bg,.active .con2 .xtl_logo_bg{animation:fadeIn 1s .8s ease both;}

.active .tit1,.active .tit2,.active .tit3,.active .tit4,.active .tit5,.active .tit6,.active .tit7,.active .tit8{animation:fadeInDown 1s .3s ease both;}

.active .hd_con,.active .qd_con,.active .jhs_con,.active .mcs_con,.active .nxs_con,.active .qm_con,.active .tab_con1,.active .lb_con{animation:fadeInDown 1s .4s ease both;}

.active .npc_box{animation:fadeInDown 1s .5s ease both;}

@keyframes fadeIn{

0%{opacity:0}

100%{opacity:1}

}

@keyframes fadeInDown{

0%{opacity:0;transform:translateY(-30px)}

100%{opacity:1;transform:translateY(0)}

}

#cyou_bottom{animation:fadeInUp .6s ease both;}

@-webkit-keyframes fadeInUp{

0%{opacity:0;transform:translateY(20px)}

100%{opacity:1;transform:translateY(0)}

}

.txtBox a{

	background-color: #0095d9;

	color: #fff;

	font-size: 12px;

	text-align: center;

	padding: 5px 5px;

	margin: 10px 20px 10px 0;

	border-radius: 5px;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	-ms-border-radius: 5px;

}

.txtBox a:hover{

	background-color: #22a8e4;

}

a.c1{

	background-color: #c76c0d;

}

a.c1:hover{

	background-color: #e68520;

}