
.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: 47px;left:  100px;}
html,body,.wrap{height: 100%;}
body::-webkit-scrollbar { width:0px;}
p{text-align: justify;}
/* bg.png */
.wrap *{line-height: 1;-webkit-box-sizing: border-box; box-sizing: border-box;appearance: none;-moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;}
select::-ms-expand { display: none; }
.sp_4{width: 1500px;height: 1500px;background: url(../img/shanhe/sp_4.png) no-repeat;background-size: 1000px 1000px}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}  
.clearfix {zoom: 1;display: block;}
.fl{float: left;}
.fr{float: right;}
a{-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
b{font-weight: normal;}
table{border-collapse:collapse;}
table td{border: 1px solid #f1e3ce;}
table thead tr td{background: #f9f7eb;text-align: center;height: 35px;font-size: 22px;color: #9e824c;}
table tbody tr td:nth-of-type(1){color: #9e824c;font-size: 22px;text-align: center;line-height: 25px;}
.wrap{position: relative;width: 750px;height: auto;margin: auto;box-sizing: border-box;overflow: hidden;}
.reset_{padding-left: 100px;}
.c_bg{padding-left: 100px;}
/* 返回主页 */
/* nav */
.nav{position: fixed;left: 0px;top: 0px; width: 100px;padding-top: 331px;}
.nav a{display: flex;align-items: center;justify-content: center; margin:0 auto 11px; width: 96px;height: 96px;background-position: -904px -218px;color: #bec8db;font-size: 18px;text-align: center;line-height: 25px;}
.nav a.active{background-position: -807px -218px;color: #171f2b;}
/* 山河 */
.bg1{width: 100%;height: 1650px;background: url(../img/shanhe/bg1.jpg)top center no-repeat;background-size: 750px 1650px;padding-top: 266px;}
.bg1>h3{ width: 614px;height: 24px;margin:0 auto 35px; background-position: -0 -507px;animation: t_t 1s .5s both;}
.bg1 .content {padding-left: 31px;}
.bg1 .content li{position: relative;width: 576px;height: 286px; margin-bottom: 19px;animation: t_t 1s .7s both;}
.bg1 .content li:nth-of-type(2){animation: t_t 1s .9s both;}
.bg1 .content li:nth-of-type(3){animation: t_t 1s 1.2s both;}
.bg1 .content li a{position: absolute;bottom: 21px;right: -22px;width: 178px;height: 46px;background-position: -816px -332px;}
.bg1 .pop1{position: relative; width: 668px;}
.bg1 .bg1_swiper.pop1{ width: 668px;height: 600px; } 
.bg1 .prev1,.bg1 .next1{ width: 42px; height: 42px;}
.bg1 .option{display: flex;justify-content: space-between;align-items: center; width: 170px;margin:20px auto 0;}
.bg1 .prev1,.bg2 .prev1{background-position: -872px -396px;}
.bg1 .next1,.bg2 .next1{background-position: -922px -396px;}
.bg1 .pop1 .this_page{ font-size: 20px;color: #bfceea;}
.bg1 .swiper-container{width: 668px;height: 500px;}
.bg1 .swiper-pagination1{display: none;}
  /*  */
.bg2{width: 100%;height: 1650px;background: url(../img/shanhe/bg3.jpg)top center no-repeat;background-size: 750px 1650px; padding-top: 313px;}
.bg2 .content{position: relative; overflow: hidden;}
.bg2 .video_box{position: absolute;right: 57px; display: flex;flex-wrap: wrap;justify-content: center; width: 96px;height: 96px;border-radius: 50%;}
.bg2 .video_box::after{position: absolute;left: 50%;top: 50%;margin: -48px 0 0 -48px; content: ""; width: 96px;height: 96px;border-radius: 50%;border: solid 1px #9fc0f5; animation:videobg 3s infinite linear;}
.bg2 .video_box::before{position: absolute;content: "";left: 50%;top: 50%;margin: -43px 0 0 -43px; width: 86px;height: 86px;border-radius: 50%;border: solid 1px #9fc0f5;animation:videobg 3s infinite linear;}
.bg2 .video_box .play_btn{z-index: 9; position: absolute;left: 50%;top: 50%;margin: -14px 0 0 -12px; width: 24px; height: 28px;background-position: -924px -466px;}
.bg2 .video_box p{color: #85aae5;font-size: 20px;text-align: center; white-space: nowrap;margin-top: 13px;}
.bg2 .audio_bg{position: relative; width: 625px;height: 256px;margin: 162px auto 35px; background: url(../img/shanhe/vodeo_bg.png)center center no-repeat;background-size: 625px 256px;animation: t_t 1s .5s both;}
.bg2 .audio_bg .music_bg{position: relative; width: 257px;height: 257px;}
.bg2 .audio_bg .music_bg::after{position: absolute;left: 0px;top: 0px; content: ""; width: 257px;height: 257px;background: url(../img/shanhe/music_bg.png)center center no-repeat;background-size: 257px 257px;}
.bg2 .audio_bg .music_bg.active::after{animation:videobg 5s 1s infinite linear;}
.bg2 .audio_bg .axle{position: absolute;left: 152px;top: 17px; width: 133px; height: 180px;background-position: -5px -547px; transform-origin:top right; transform: rotate(-30deg); transition:transform 1s ;}
.bg2 .audio_bg .axle.active{transform: rotate(-7deg);}
.bg2 .music_bg audio{display: block;margin: auto; width: 10px;height: 10px; visibility: hidden;}
.bg2 .audio_bg .music_list{ position: absolute;left: 300px;width: 300px;padding: 38px 0 0 0;}
.bg2 .audio_bg .music_list li{ display: flex;align-items: center; justify-content: space-between; margin-bottom: 29px;}
.bg2 .audio_bg .music_list p{ color: #aab9d1;font-size: 16px;}
.bg2 .audio_bg .music_list b{font-size: 20px; color: #9bbef2;}
.bg2 .audio_bg .music_list a{  width: 44px;height: 44px;background-position: -808px -456px;}
.bg2 .audio_bg .music_list a.active{background-position: -866px -456px;}
.bg2 .composer{width: 622px;height: 368px;background:url(../img/shanhe/composer.png) no-repeat;background-size:622px  368px; margin:0 auto 38px;  animation: t_t 1s .7s both;   }
.bg2  .composer strong{display: block; padding-left: 92px;color: #aab9d1;font-size: 18px;height: 48px;line-height: 48px;margin-bottom: 10px;}
.bg2 .composer p{color: #94a4bd;font-size: 18px;width: 380px;line-height: 22px;padding-left: 18px;text-indent: 2em;}
.bg2 .bg2_swiper{width: 622px;height: 318px;animation: t_t 1s .9s both;}
.bg2 .bg2_swiper .swiper-slide{padding:0 12px 0 217px;}
.bg2 .bg2_swiper .swiper-slide strong{display: block;height: 48px; line-height: 55px;color: #aab9d1;font-size: 18px;text-align: right; padding-right: 96px; margin-bottom: 15px;}
.bg2 .bg2_swiper .swiper-slide p{color: #94a4bd;font-size: 18px;line-height: 22px; text-indent: 2em;}
.bg2 .bg2_swiper .swiper-slide:nth-of-type(1){background: url(../img/shanhe/composer1.png) no-repeat; background-size:622px 318px;}
.bg2 .bg2_swiper .swiper-slide:nth-of-type(2){background: url(../img/shanhe/composer2.png) no-repeat; background-size:622px 318px;}
.bg2 .bg2_swiper .swiper-slide:nth-of-type(3){background: url(../img/shanhe/composer3.png) no-repeat; background-size:622px 318px;}
.bg2 .bg2_swiper .swiper-slide:nth-of-type(4){background: url(../img/shanhe/composer4.png) no-repeat; background-size:622px 318px;}
.bg2 .option .toggle{width: 42px;height: 42px;}
.bg2 .option{float: right;display: flex;align-items: center;justify-content: space-between; width: 168px;height: 42px;margin-right: 14px; }
.bg2 .page_num{color: #bfceea;font-size: 20px;}
.bg2 .prev1 {background-position: -872px -396px; }
.bg2 .next1 {background-position: -922px -396px;}

.video_box2 {position: relative;width: 696px;height: 390px;margin: auto;}
.video_box2 video{object-fit: fill;width: 100%;height: 100%;}

  @keyframes videobg{
      0%{
          transform: rotate(0deg);
      }
      100%{
        transform: rotate(360deg);
    }
  }



/*5.5*/
.bg2-add{ width: 100%; height: 2375px; background: url(../img/shanhe/add-bg.jpg) top center no-repeat;
  background-size: 750px 2375px;padding-top: 170px;
}
.add-role-box{position: relative; height: 654px;} 
.add-tit{background: url(../img/shanhe/add-tit.png) no-repeat; width: 386px; height: 54px; background-size: 386px auto; margin: 0 auto;}
.add-img1,.add-img2,
.add-zk,.add-aj{position: absolute; color: #94a4bd; font-size: 18px; text-align:justify;}
.add-img1{left: 0; top: 100px; width: 306px; height: 257px;}
.add-img2{right: 2px; top: 390px; width: 330px; height: 221px;}
.add-role-box .add-zk{ width: 344px; height: 356px; background:#364766; padding: 16px 22px 0; box-sizing: border-box; right: 0; top: 34px; z-index: 2;  }
.add-role-box .add-aj{position: relative; width: 351px; height: 256px; background: #29364b; padding: 46px 10px 0; box-sizing: border-box;  left: 0; top: 358px;}
.add-role-box .detail-txt em{ font-size: 30px; line-height: 30px; color: #aab9d1; display: block; margin-bottom: 20px;}
.add-role-box .detail-txt p{line-height: 24px; text-indent: 2em; border-bottom: 1px #344360 solid; padding-bottom: 34px;font-size: 19px;}
.add-zk span{width: 51px; height: 91px; background: url(../img//shanhe/add-tag1.jpg) no-repeat; background-size: 51px auto; text-indent: -999em; ; display: block; position: absolute; left: -49px; top: 0;}
.add-role-box .add-aj .detail-txt p{border-bottom: none; padding-bottom: 0;    padding-right: 37px;}
.add-role-box .add-aj .detail-txt em{text-align: right;    padding-right: 35px;}
.add-step{background: url(../img/shanhe/add-step.png) no-repeat; width: 582px; height: 1278px; background-size: 582px 1278px;    margin-left: 28px;}
.add-step .step-list{ padding: 118px 0 0 224px;}

.add-step .step-list li{ width: 350px; height: 212px; margin-bottom: 65px; text-align: justify; font-size: 20px; display: flex; display: -webkit-flex; align-items: center;}
.add-step .step-list li p{  padding: 20px 34px; line-height: 24px; text-indent: 2em;font-size: 19px;}
.add-step .step-list li:first-child{height: 297px;}
.add-role-box{animation: t_t 1s ease both;}
.add-step{animation: t_t 1s .2s ease both;}
.add-aj .add-aj_name{z-index: 9; position: absolute;left: 317px;top: 31px; width: 48px;height: 84px;background: url(../img/shanhe/add-tag2.jpg) no-repeat;}





  













