
.xtl_logo_bg, .xtl_logo_lk a{position:absolute; width: 178px;  height: 98px;}
.xtl_logo_bg{z-index:10; background:url('http://i0.cy.com/xtl/main/20191101/logo_tl.png') no-repeat; cursor:pointer;background-size: 100%;}
.xtl_logo_lk a {z-index:11;}
.xtl_logo_bg{top: 18px;left: 50px;}
html,body,.wrap{height: 100%;}
body::-webkit-scrollbar { width:0px;}
/* bg.png */
.wrap *{line-height: 1;-webkit-box-sizing: border-box; box-sizing: border-box;font-size: 0px;appearance: none;-moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;}
select::-ms-expand { display: none; }
.wrap{position: relative;}
p{text-align: justify;}
.sp{width: 1500px;height: 1500px;background: url(../img/sp.png) no-repeat;background-size: 1500px 1500px}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
 .clearfix {display: inline-block;}  /* for IE/Mac */
 .clearfix {zoom: 1;display: block;   }
.fl{float: left;}
.fr{float: right;}
a{-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
.wrap{position: relative; width: 750px; height:auto;margin: auto; box-sizing: border-box; overflow: hidden;}
.reset_{padding-bottom: 95px;}
/* 导航 */
.nav_box{display: flex;align-items: center;flex-wrap: wrap;justify-content: center; position: fixed;top: 266px;left: 18px; width: 68px;height: 309px;background: url(../img/nav2_bg.png)top center no-repeat;background-size: 68px 228px; }
.nav_box a{display: block;width: 100%;height: 74px;}
.nav_box a.active{background: url(../img/nav2_hover.png)top center no-repeat;}
.nav_box .a1.active{ background-position: -0px -0px;}
.nav_box .a2.active{ background-position: -0px -78px;}
.nav_box .a3.active{ background-position: -0px -156px;}
/* login */
.logo{position: absolute;right: 14px;top: 21px;}
.logo a{display: block; width: 176px;height: 56px;background-position: -371px -630px;}
/* 返回首页 */
 .returnHome{width: 100%;   height: 74px;transform: scale(1.3); }
 .returnHome a{display: block; width: 44px;height: 44px; background-position: -436px -525px;margin:10px auto 0;}
 .returnHome a.active{display: block !important;margin:10px auto 0; width: 44px;height: 44px; background: url(../img/sp.png) no-repeat;background-size: 1500px 1500px;background-position: -436px -525px;}
/* 背景一 */
.bg1{display: block; width: 100%;height: 1800px; background: url(../img/bg2.jpg)top center no-repeat; background-size: 750px 1800px;padding: 107px 0 0 0;}
.bg1>h2{ width: 692px; height: 76px;background-position: -28px -770px; margin:0 0 8px 63px;}
.bg1 .container{height: 100%;width: 100%; padding-left: 139px;}
.bg1 .container .rule{color: #bda067;font-size: 22px;text-align: center;line-height: 25px;margin-bottom: 100px;}
.bg1 .showBox{position: relative; width: 423px;height: 395px;background: url(../img/p_bg.png)center center no-repeat; background-size: 423px 395px;margin-left:34px ;}
.bg1 .showBox .personShow{display: flex;align-items: center;justify-content: center;width: 100%;height: 100%; }
.bg1 .showBox .personShow img{transition: all .5s;}
.bg1 .showBox .toggle_box{position: absolute;left: 361px;top: 52px;width: 200px;height: 100%;}
.bg1 .showBox .toggle_box a{display: block; color: #aa9162;font-size: 24px;margin-bottom: 25px;height: 42px;line-height: 42px;}
.bg1 .showBox .toggle_box a.active{color: #6a490c;}
.bg1 .showBox .toggle_box .m1{padding-left: 0px;}
.bg1 .showBox .toggle_box .m2{padding-left: 32px;}
.bg1 .showBox .toggle_box .m3{padding-left: 40px;}
.bg1 .showBox .toggle_box .m4{padding-left: 25px;}
.bg1 .showBox .toggle_box .m5{transform: translateX(-18px);}
.bg1 .showBox .toggle_box em{display: inline-block;width: 42px;height: 42px;background: url(../img/sign1.png)center center no-repeat;background-size: 19px 19px;vertical-align: top; transition: all .2s;}
.bg1 .showBox .toggle_box a.active em{background: url(../img/sign_hover.png)center center no-repeat;background-size: 39px 39px;}
.bg1 .showBox .video_box{position: absolute;left: -37px;top: 0; width: 132px;height: 145px; }
.bg1 .showBox .video_box p{position: absolute;bottom: -34px;left: 50%;margin-left: -73.5px; width:  147px;height:35px ; background-position: -18px -523px;color: #9e824c;font-size: 20px;text-align: center; line-height: 29px;}
.bg1 .showBox .video_box::before{position: absolute;left: -3px;top: -5px;content: ""; width: 145px;height: 145px;background: url(../img/v_bg.png)center center no-repeat;background-size: 145px 145px;animation: loadRotate 10s linear infinite;animation-fill-mode: both;}
.bg1 .showBox .preview{display: flex;align-items: center;justify-content: center; position: absolute;opacity: .8; border: 3px solid #ddba5b;left: 50%;top: 50%;margin: -67.5px 0 0 -60.5px;width: 125px;height: 125px;border-radius:50%;overflow: hidden;  }
.bg1 .showBox .preview video{width: 100%;height: 100%;object-fit: fill;}
.bg1 .showBox .video_box .play_btn{z-index: 9; position: absolute;left: 5px;top: 5px; width: 125px;height: 125px;padding: 41px;background: url(../img/play_btn.png)center center no-repeat; }
.bg1  .particular{position: relative; margin-top: 70px;}
.bg1  .particular h5{width: 441px;height: 88px;margin:0 auto 30px; background-position: -31px -894px; transform: translateY(20px); opacity: 0;  animation: elTop 1s both;}
.bg1  .particular>p{color: #bda067;font-size: 21px;padding-left: 54px; line-height: 25px;margin-top: 12px;text-align: center;}
.bg1 .alter_box{display: flex; justify-content: space-around; width: 580px;height: 426px;}
.bg1 .alter_box>div{width: 262px; transform: translateY(20px);opacity: 0;animation: elTop 1s .2s both;}
.bg1 .alter_box p{ width: 45px; height: 180px;}
.bg1 .alter_box .alter_after{animation: elTop 1s .3s both;}
.bg1 .alter_box .alter_befroe p{background-position: -187px -521px;}
.bg1 .alter_box .alter_after p{background-position: -248px -521px;}
.text_box{display: flex;align-items: center;justify-content: center;text-align: center;line-height: 25px; width: 542px;height: 108px;background: url(../img/text_bg.png)top center no-repeat;background-size: 542px 108px; margin:50px 0 0 50px;color: #bda067;font-size: 22px;}

.off{position: absolute;top: -47px;right: -15px; width: 40px;height: 40px;background-position: -321px -525px;}
.pop{display: none;}
.pop1{width:696px;height: 390px; }
.pop1 .video_box2{position: relative; width: 696px;height: 390px;margin: auto;}
.pop1 video{width: 100%;height: 100%; object-fit: fill;}
.pop2{width: 437px;height: 193px;background: url(../img/pop2.png)center no-repeat;background-size:437px 193px;}
/* footer */
.footer{z-index: 10; position: fixed;left: 0;bottom: 0;  width: 100%; ;height: 95px;}
.footer a{position: relative;float: left;text-align: center;  line-height: 28px; width: 25%; height: 95px;background-position: -473px -277px;color: #f6f3ee;font-size: 24px;padding-top: 20px;}
.footer a span{display: none;}
.footer a.active span{ z-index: 9;display: block; position: absolute;left: 50%;top: 3px; text-align: center; margin-left: -98px;width: 196px;height: 91px;color: #f6f3ee;font-size: 24px;line-height: 28px;padding-top: 17px; background-position: -274px -278px;}


@keyframes elTop{
     0%{transform: translateY(20px);opacity: 0;}
    100%{transform: translateY(0px) ;opacity: 1;}
}
@-webkit-keyframes loadRotate{ from{-webkit-transform:rotateZ(0deg);} to{-webkit-transform:rotateZ(360deg);} }
@keyframes loadRotate{ from{transform:rotateZ(0deg);} to{transform:rotateZ(360deg);} }

/*--------- add ---------- */
/* 背景二 */
.bg2 .hide{height:0; line-height:0; font-size:0; }
.bg2{width: 100%;height: 3182px; background: url(../img/bg-hld02.jpg) top center no-repeat; background-size: 750px 3183px;overflow: hidden;display: none;}
.mod-hld{margin-left:112px;position: relative;text-align:center;width:638px;}
.bg2 *{font-size:22px;color:#c14033;line-height: 1.2;}
.mod-hld01{height: 1173px;width: 591px; background: url(../img/hxl-img1.png) center top no-repeat;background-size:591px 1173px;padding-top:534px;margin-top:210px;}
.mod-hld .exp{width: 573px;margin-left:39px;}
.mod-hld .shi{position: absolute;top:100px;left:45px;}
.mod-hld .shi p{width: 20px;float:right;margin:0 5px;}
.mod-hld .shi p:nth-child(2){margin-top:50px;}
.mod-hld .t-left{text-align: left;}
.mod-hld01 .exp{height:476px;}
.mod-hld01 .name{position: absolute;top:673px;width:30px;}
.mod-hld01 .name01{left:80px;}
.mod-hld01 .name02{left:350px;}
.mod-hld01 .name03{left:80px;top:857px;}
.mod-hld01 .shuoming{position: absolute;left:320px;top:874px;width: 200px;text-align: left;}
.mod-hld01 .txt{width: 561px;height: 156px;margin-left: 33px;display: flex;align-content: center;flex-wrap: wrap;justify-content: center; padding-top: 15px;}
.mod-hld01 .txt p{font-size: 20px;line-height: 25px;    text-align: center;width: 100%;}
.mod-hld02{margin-top:40px;background: url(../img/hxl-img2.png) center top no-repeat;background-size:638px 420px;padding:435px 0 40px 0;}
.mod-hld03{background: url(../img/hxl-img3.png) center top no-repeat;background-size:638px 476px;padding:440px 0 40px 0;}
.mod-hld03 .shi{top:130px;}
.mod-hld04{background: url(../img/hxl-img4.png) center top no-repeat;background-size:638px 466px;}
.mod-hld04 ul{display: flex;padding:0 10px 0 30px;}
.mod-hld04 ul li{flex: 1;position: relative;padding-top:470px;padding-left:50px;}
.mod-hld04 .shi{top:170px;left:5px;}
.mod-hld04 li:nth-child(2) .shi{left:0;}
/*背景三*/
.bg3 .btns{background: url("../img/btns3.png")no-repeat;background-size: 550px auto; }
.bg3{background:url("../img/bg7.jpg")no-repeat top center;width: 750px;height: 3431px;background-size: 750px 3431px;display: none;}
.bg3 .container{height: 100%;width: 100%; padding:0 45px 0 155px;}
.bg3 .code{padding-top: 225px;}
.bg3  h2{width:400px;height: 37px;margin-left: -30px; }
.bg3 .rule h2{background-position: 0 0;margin-top: 35px;}
.bg3 p{font-size: 22px;color: #9e824c;text-indent: 40px;line-height: 32px;text-align: justify;}
.bg3 span{color: #c14033;line-height: 32px;font-size: 22px;}
.bg3 .rule p{padding: 7px 0 30px}
.bg3 .introduce h2{background-position: 0 -46px;margin-bottom: 5px;}
.bg3 .introduce .img{padding: 20px 0 37px}
.bg3 .award h2{background-position: 0 -96px;}
.bg3 .award img{margin-top: 20px;}
.bg3 .lottery h3{width:550px;height: 53px;background-position: 0 -145px;margin-top: 25px; }
.bg3 .lottery .img{display: flex;justify-content: center; width: 649px;height: 430px;margin-left: -53px}
.bg3 .lottery{margin-bottom: 30px;}
.bg3 .gift_name>p{color: #c14033;font-size: 22px;font-weight: bold;margin-bottom: 23px;}
.bg3 .gift_name table{border-collapse: collapse;width: 573px;margin: auto;}
.bg3 .gift_name table td{border: 1px solid #f2e4d0;text-align: center;}
.bg3 .gift_name thead td{height: 31px; background: #f9f7eb;font-size: 23px;color: #9e824c;}
.bg3 .gift_name tbody td{height: 31px; background: #ffffff;font-size: 18px;color: #9e824c;line-height: 30px;}