.index_main{
    position:relative;
}
.section2 {
    width: 100%;
    height: 100vh !important; 
    overflow: hidden;
}
.section2 {background-repeat: no-repeat;background-position: center;background-size: cover;background-image: url(../img/background-5.jpg);}
.section2 .logo_box{ width: 1200px; height: 100%; margin: 0 auto;position: relative;z-index: 8;}
.section2 .logo_box a{text-decoration: none;}
#myCanvas{margin: 0 auto;position: absolute;left: 0;top: 57%;right: 0;transform: translateY(-50%);width: 100%;height: 65%;background: url("/PC/img/img-24.png") no-repeat center;background-size: 610px;}
#myCanvas:hover{
    cursor: pointer;
}
.logo-font{color:#fff;position: absolute;top: 90px;transform: translateX(-50%);left: 50%;}
.logo-font .p-size16{line-height: 60px;}
.tagcloud {position: absolute !important;left: 0;right: 0;top: 50%;transform: translateY(-50%);  }
.tagcloud a { position: absolute; top: 0; left: 0;  display: block; }
.section2 h3.tit{font-size: 38px;color: #fff;line-height: 1;text-align: center;font-weight: normal;position: absolute;left: 0;right:0;top: 0;bottom:0;line-height: 107vh;z-index: 8;margin: 0 auto;/* display: none; */}
.section2 .line_box .line:nth-child(2){border:0;position: relative;}
.section2 .line_box .line:nth-child(2):before{content: "";display: block;width: 1px;height: 60px;background-color: rgba(255,255,255,0.2);position: absolute;right:0;top: 0;}
.section2 .line_box .line:nth-child(2):after{content: "";display: block;width: 1px;height: 60px;background-color: rgba(255,255,255,0.2);position: absolute;right:0;bottom: 0;}
.line_box .line:nth-of-type(4){border:0;}
.line_box .line:nth-of-type(4):before{content: "";display: block;width: 25vw;height: 1px;background-color: rgba(255,255,255,0.2);position: absolute;left: 0;bottom: 0;}
.line_box .line:nth-of-type(4):after{content: "";display: block;width: 25vw;height: 1px;background-color: rgba(255,255,255,0.2);position: absolute;right: 0;bottom: 0;}
.section2 .bg_box{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.section2 .logo_box .logo_pc{display: block;}
.section2 .logo_box .items{display: none;}
.section2 .logo_box #tags img{max-width: 180px; max-height: 110px;}
.section2 .bg_box .bg{position: absolute;-webkit-animation: shake 2s linear infinite; animation: shake 2s linear infinite;}
.section2 .bg_box .bg img{display: block;width: 100%;}
.section2 .bg_box .bg1{width: 140px;left: 6%;top: 22%;}
.section2 .bg_box .bg2{width: 242px;left: 7%;top: 30%;animation-delay:200ms;-webkit-animation-delay:200ms;-moz-animation-delay:200ms;-webkit-animation: shake2 2s linear infinite; animation: shake2 2s linear infinite;}
.section2 .bg_box .bg3{width: 196px;left: 8%;bottom:29%;animation-delay:300ms;-webkit-animation-delay:300ms;-moz-animation-delay:300ms;}
.section2 .bg_box .bg4{width: 254px;left: 6%;bottom:12%;animation-delay:400ms;-webkit-animation-delay:400ms;-moz-animation-delay:400ms;-webkit-animation: shake2 2s linear infinite; animation: shake2 2s linear infinite;}
.section2 .bg_box .bg5{width: 256px;right: 6%;top:18%;animation-delay:600ms;-webkit-animation-delay:600ms;-moz-animation-delay:600ms;-webkit-animation: shake2 2s linear infinite; animation: shake2 2s linear infinite;}
.section2 .bg_box .bg6{width: 141px;right: 13%;bottom:35%;animation-delay:500ms;-webkit-animation-delay:500ms;-moz-animation-delay:500ms;}
.section2 .bg_box .bg7{width: 110px;right: 5%;bottom:25%;animation-delay:700ms;-webkit-animation-delay:700ms;-moz-animation-delay:700ms;-webkit-animation: shake2 2s linear infinite; animation: shake2 2s linear infinite;}
@-webkit-keyframes shake {
  0%{transform: translateX(10px);}
  50%{transform: translateX(0);}
  100%{transform: translateX(10px);}
}
@-moz-keyframes shake {
  0%{transform: translateX(10px);}
  50%{transform: translateX(0);}
  100%{transform: translateX(10px);}
}
@keyframes shake {
  0%{transform: translateX(10px);}
  50%{transform: translateX(0);}
  100%{transform: translateX(10px);}
}
@-webkit-keyframes shake2 {
  0%{transform: translateX(-10px);}
  50%{transform: translateX(0);}
  100%{transform: translateX(-10px);}
}
@-moz-keyframes shake2 {
  0%{transform: translateX(-10px);}
  50%{transform: translateX(0);}
  100%{transform: translateX(-10px);}
}
@keyframes shake2 {
  0%{transform: translateX(-10px);}
  50%{transform: translateX(0);}
  100%{transform: translateX(-10px);}
}
.section2 .box{position:absolute;left:0;top: 0;width: 100%;height: 100%;background-repeat: no-repeat;background-position: center;background-size: cover;background-image: url(../image/section2_bg2.jpg);z-index: 9999;display: none; }
.section2 .box .scroll_box{width: 50vw;position: absolute;left: 0;bottom:100px;height: 30px;z-index: 1;}
.section2 .box .scroll_box .inner{width: 40%;margin: 0 auto;position: relative;height: 100%;}
.section2 .box .swiper-scrollbar{position: relative;height: 100%;background: transparent;width: 120%;margin-left: -10%;}
.section2 .box .swiper-scrollbar:after{content: "";display: block;width: 100%;height: 1px;border-bottom:1px dashed rgba(255,255,255,0.4);position: absolute;top: 13px;left: 0;z-index: -1;}
.section2 .box .swiper-scrollbar-drag{background: transparent;}
.section2 .box .swiper-scrollbar-drag span{width: 60px;height: 16px;line-height: 16px;position: absolute;left: -22px;right: 0;border: 0;border-radius: 0;top: 7px;background: #353332;margin: auto;}
.section2 .box .swiper-scrollbar-drag span i{display: block;display: inline-block;width: 60px;height: 16px;line-height: 16px;background: #FFFFFF;position: absolute;left: 0;right: 0;margin: auto;cursor: pointer;color: #FFFFFF;text-align: center;font-style: normal;}
.section2 .box .swiper-scrollbar-drag span i:before{content: " ";width: 0;height: 100%;background: #ddae60;display: block;}
.section2 .box .swiper-scrollbar-drag span M{position: absolute;left: 0;right: 0;top: 0;font-size: 14px;}
.donghua:before{-webkit-animation: width_1 5s ease-in-out 0s 1 alternate forwards;animation: width_1 5s ease-in-out 0s 1 alternate forwards;}
@keyframes width_1{
  from{width: 0;}
  to{width: 100%;}
}
@-moz-keyframes width_1{
  from{width: 0;}
  to{width: 100%;}
}
@-moz-keyframes color1 {
  0% {
    color: #ddae60;
  }
  60% {
    color: #FFFFFF;
  }
  100% {
    color: #FFFFFF;
  }
}

@-ms-keyframes color1 {
  0% {
    color: #ddae60;
  }
  60% {
    color: #FFFFFF;
  }
  100% {
    color: #FFFFFF;
  }
}

@-webkit-keyframes color1 {
  0% {
    color: #ddae60;
  }
  60% {
    color: #FFFFFF;
  }
  100% {
    color: #FFFFFF;
  }
}

@keyframes color1 {
  0% {
    color: #ddae60;
  }
  60% {
    color: #FFFFFF;
  }
  100% {
    color: #FFFFFF;
  }
}

.donghua M {
  -webkit-animation: color1 5s ease-in-out 0s 1 alternate forwards;
  animation: color1 5s ease-in-out 0s 1 alternate forwards;
}

.section2 .box .swiper-container{height: 100%;}
.section2 .box .swiper-container-h{position: absolute;z-index: 3;width: 50%;height: 100%;left: 0;top: 0;overflow: inherit;}

.section2 .box .swiper-container-h .left{width: 100%;height: 100%;text-align: center;padding: 5vw 10vw;}
.section2 .box .swiper-container-h .left img{display: inline-block;max-width: 90%;}
.section2 .box .swiper-container-h .left .txt{margin-top: 50px;padding-bottom: 56px;}
.section2 .box .swiper-container-h .left .txt p{font-size: 16px;line-height: 30px;color: rgba(255,255,255,0.6);height: 60px;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.section2 .box .swiper-container-h .right{float: right;width: 50%;height: 100%;}
.section2 .box .pic_box{width: 50%;height: 100%;position: absolute;right: 0;top: 0;z-index: 1;}
.section2 .box .swiper-container-v{width:100%;height:0;opacity: 0;visibility: hidden;transition: opacity 500ms ease, visibility 500ms ease;}
.section2 .box .swiper-container-v.active{opacity: 1;visibility: visible;height: 100%;}

.section2 .box .swiper-container-v .swiper-slide{width:100%;height: 100%;background-repeat: no-repeat;background-position: center;background-size: cover;position: relative; }
.section2 .box .swiper-container-v .swiper-slide .pic{background-repeat: no-repeat;background-position: center;background-size: cover;width: 100%;height: 100%;}
.section2 .box .swiper-container-v .swiper-slide h3{font-size: 36px;font-family: 'DINPRO-L';font-weight: normal;line-height: 1;text-transform: uppercase;position: absolute;left: 60px;bottom: 120px;color: #fff;}
.section2 .box .swiper-button-next, .section2 .box .swiper-button-prev{width: 10px;height: 10px;background-color: transparent;background-repeat: no-repeat;background-position: center;position: absolute;top: 50%;margin-top: -5px;z-index: 1;background-size: contain;}
.section2 .box .swiper-button-prev{background-image: url(../image/section2_prev.png);left: -84px;}
.section2 .box .swiper-button-next{background-image: url(../image/section2_next.png);right: -84px;}
.section2 .box .line_box{z-index: 1;}
.section2 .box .number{font-size: 0;position: absolute;bottom: 60px;left: calc(100% + 60px);z-index: 3;display: table;}
.section2 .box .number span{display: inline-block;vertical-align: middle;font-family: 'DINPRO-L';font-size: 18px;color: rgba(255,255,255,0.6);padding: 15px 10px; margin-right: 5px;transition: all 500ms ease;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;position: relative;cursor: pointer;bottom: 0;width: auto;}
.section2 .box .number span:after{content: "";display: block;width: 0;height: 2px;background: #ddad60;position: absolute;left: 0;right: 0;bottom: 0;margin: 0 auto;opacity: 0;visibility: hidden;transition: all 500ms ease;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;}
.section2 .box .number span.active:after,.section2 .box .number span:hover:after{opacity: 1;visibility: visible;width: 100%;}
.section2 .box .number span.active,.section2 .box .number span:hover{color: #ddad60;font-weight: bold;}
.section2 .box .drag_a_p{margin: 90px auto 0 auto;}

.section2 .box .close{cursor: pointer;height: 1.6rem;overflow: hidden;position: absolute;right: 60px;top: 60px; width: 1.6rem;z-index: 3;}
.section2 .box .close span{background-color: #fff;border-radius: 1px;display: block;height: 2px;left: 50%;position: absolute;top: 50%;width: 2.26rem;}
.section2 .box .close span:nth-child(1){-webkit-transform: translate(-1.12rem,-50%) rotate(45deg);
    transform: translate(-1.12rem,-50%) rotate(45deg);}
.section2 .box .close span:nth-child(2){webkit-transform: translate(-1.12rem,-50%) rotate(-45deg);
    transform: translate(-1.12rem,-50%) rotate(-45deg);}
.section2 .box .close:hover span:nth-child(1){webkit-animation: close_a 1s ease-in-out 1;animation: close_a 1s ease-in-out 1;}
.section2 .box .close:hover span:nth-child(2){-webkit-animation: close_b 1s ease-in-out 1;-webkit-animation-delay: .25s;animation:close_b 1s ease-in-out 1;animation-delay: .25s;}
.section2 .box .logo{position: absolute;z-index: 4;top: 60px;left: 60px;width: 227px;}
.section2 .box .logo img{display: block;max-width: 100%;}
.section2 .line_box .line{border-right: 1px solid rgba(255,255,255,0.05);}
.section2 .line_box:before{background-color: rgba(255,255,255,0.05);}
.section2 .line_box:after{background-color: rgba(255,255,255,0.05);}
.section2 .line_box .circle{border: 1px solid rgba(255,255,255,0.05);}
.section2 .line_box .line:nth-of-type(4):before{background-color: rgba(255,255,255,0.05);}
.section2 .line_box .line:nth-of-type(4):after{background-color: rgba(255,255,255,0.05);}



@media only screen and (max-width: 1600px){
  .section2 .box .swiper-container-v .swiper-slide h3{font-size: 32px;}
  .section2 .box .swiper-container-h .left img{max-width: 54%;}
  .section2 .box .swiper-container-h .left .txt{margin-top: 35px;}
  .section2 .box .drag_a_p{margin-top: 75px;}
  .section2 h3.tit{font-size: 42px;}
  .section2 .logo_box{width: 950px;}
}
@media only screen and (max-width: 1440px){
  .section2 .box .swiper-container-h .left .txt p{font-size: 14px;line-height: 26px;height: 52px;}
  .drag_a_p h3{font-size: 14px;}
  .section2 .box .swiper-container-v .swiper-slide h3{font-size: 28px;}
  .section2 .logo_box{width: 800px;}
  .section2 h3.tit{font-size: 34px;}
}
@media only screen and (max-width: 1366px){
  .section2 .box .logo{width: 190px;}
  .section2 .box .scroll_box{bottom: 80px;}
  .section2 .box .drag_a_p{margin-top: 65px;}
  .section2 .box .swiper-container-h .left .txt{margin-top: 25px;}
  .section2 h3.tit{font-size: 30px;}
  .section2 .logo_box{width: 750px;}
}
@media only screen and (max-width: 1199px){
  .section2 .box .swiper-container-v .swiper-slide h3{font-size: 24px;}
  .section2 .logo_box{width: 650px;}
}
@media only screen and (max-width: 992px){
  .section2{padding: 40px 0 20px 0;height: auto!important;}
  .section2 h3.tit{position: static;font-size: 22px;line-height: 30px;}
  .section2 .bg_box{display: none;}
  .section2 .logo_box{width: 100%;}
  .section2 .logo_box .logo_pc{display: none;}
  .section2 .logo_box .items{display: block;font-size: 0;margin-top: 25px;}
  .section2 .logo_box .items .item{display: inline-block;vertical-align: top;width: 18%;margin: 0 1% 20px 1%;height: 120px;background: -webkit-linear-gradient(135deg,#363736 , #181818);background: -o-linear-gradient(135deg,#363736 , #181818);background: -moz-linear-gradient(135deg,#363736 , #181818);background: linear-gradient(135deg,#363736 , #181818);font-size: 0;}
  .section2 .logo_box .items .item a{width: 100%; display: inline-block; vertical-align: middle;line-height: 120px;text-align: center;height: 100%;}
  .section2 .logo_box .items .item a:before{content: ''; height: 100%; display: inline-block; vertical-align: middle;}
  .section2 .logo_box .items .item img{max-height: 80%;max-width: 76%;}
  .logo-font {
    color: #fff;
    position: inherit;
    top: inherit;
    transform: translateX(0%);
    left: inherit;
    margin-bottom: 30px;
}
  .logo-font .p-size16{
    line-height: 30px;
}
}
@media only screen and (max-width: 640px){
  .section2 .logo_box .items .item{width: 23%;height: 70px;}
  .section2 .logo_box .items .item a{line-height: inherit;}
}