body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;font-size:66.3%;font-weight:normal;} fieldset,img{border:0;} ul,ol{list-style:none;} table{border-collapse:collapse;border-spacing:0;} a{text-decoration: none;color:#000;} small{font-size:12px;} h1,h2,h3,h4,h5,h6,button,input,select,textarea{font-size:100%;} label,input,select,form img,button,textarea{vertical-align:middle;outline:none} address,caption,cite,code,dfn,em,strong,th,optgroup{font-style:normal;font-weight:normal;} .clear:after{content:".";display:block;height:0;clear:both;visibility:hidden;} .clear{display:inline-block;} /* Hides from IE-mac \*/ * html .clear{height:1%;} .clear{display:block;} /* End hide from IE-mac */ *{-webkit-tap-highlight-color:rgba(0,0,0,0) !important;} html,body{width:1920px;height:1080px;position:relative;background:black;-webkit-user-select: none;user-select: none;overflow: hidden} body,input,select,textarea{font:12px "Microsoft YaHei","宋体",sans-serif;} /*body:after{display:none;content:url()} */ .arrow_top{position: absolute;left: 1638px;top: 232px;animation: arrowSlideTop 1s linear infinite;} .arrow_btm{position: absolute;left: 1638px;top: 946px;animation: arrowSlideBtm 1s linear infinite;} @keyframes arrowSlideTop { 0%{transform: translate(0,0);} 50%{transform: translate(0px,-10px);} 100%{transform: translate(0px,0);} } @keyframes arrowSlideBtm { 0%{transform: translate(0,0);} 50%{transform: translate(0px,10px);} 100%{transform: translate(0px,0);} } .container{width:1920px;height:1080px;position:fixed;overflow:hidden;left:0;top:0%;background: white} .fullpage{position: absolute;left: 0;top: 0;width: 100%;height: 100%;} .homepage video{position: absolute;left: 0;top: 0;width: 100%;height: 100%;} .homepage .cover{position: absolute;left: 0;top: 0;width: 100%;} #sidebar{position: absolute;left: 84px;top: 225px;} #sidebar .grid{width: 374px;height: 141px;position: relative;margin-bottom: 12px;} #sidebar .grid img{position: absolute;left: 0;top: 0;width: 100%;height: 100%;} #sidebar .grid .on{opacity: 0;transition: all 0.2s linear;} #sidebar .grid.active .on{opacity: 1;} #home_txt_pop{position: absolute;left: 0;top: 0;width: 100%;height: 100%;} #home_txt_pop .txt{position: absolute;left: 0;top: 0;width: 100%;display: none;} #home_txt_pop.index0 .txt:nth-child(1){display: block;} #home_txt_pop.index1 .txt:nth-child(2){display: block;} #home_txt_pop.index2 .txt:nth-child(3){display: block;} #home_txt_pop.index3 .txt:nth-child(4){display: block;} #home_txt_pop.index4 .txt:nth-child(5){display: block;} #home_txt_pop.index5 .txt:nth-child(6){display: block;} #map_wrapper{position: absolute;left: 0;top: 0;width: 100%;height: 100%;} #map_wrapper .circle{display: none;} .nav_element{z-index: 9;opacity: 0;} .nav1_circle1{position: absolute;left: 504px;top: 524px;animation: focusCircle 2s linear infinite;} .nav1_icon1{position: absolute;left: 541px;top: 540px;} .nav1_icon1.show{animation: blueBlink 1s linear infinite;} .nav2_circle1{position: absolute;left: 652px;top: 445px;animation: focusCircle 2s linear infinite;} .nav2_icon1{position: absolute;left: 665px;top: 462px;} .nav2_icon1.show{animation: blueBlink 1s linear infinite;} .nav3_circle1{position: absolute;left: 1214px;top: 507px;animation: focusCircle 2s linear infinite;} .nav3_icon1{position: absolute;left: 1251px;top: 532px;} .nav3_icon1.show{animation: blueBlink 1s linear infinite;} .nav4_circle1{position: absolute;left: 933px;top: 583px;animation: focusCircle 2s linear infinite;} .nav4_circle2{position: absolute;left: 1657px;top: 279px;animation: focusCircle 2s linear -1s infinite;} .nav4_icon1{position: absolute;left: 924px;top: 584px;} .nav4_icon1.show{animation: blueBlink 1s linear infinite;} .nav4_icon2{position: absolute;left: 1445px;top: 508px;} .nav4_icon2.show{animation: blueBlink 1s linear -0.2s infinite;} .nav4_icon3{position: absolute;left: 1671px;top: 448px;} .nav4_icon3.show{animation: blueBlink 1s linear -0.4s infinite;} .nav4_icon4{position: absolute;left: 1771px;top: 487px;} .nav4_icon4.show{animation: blueBlink 1s linear -0.6s infinite;} .nav4_icon5{position: absolute;left: 1673px;top: 525px;} .nav4_icon5.show{animation: blueBlink 1s linear -0.8s infinite;} .nav4_icon6{position: absolute;left: 1633px;top: 632px;} .nav4_icon6.show{animation: blueBlink 1s linear infinite;} .nav4_icon7{position: absolute;left: 1588px;top: 667px;} .nav4_icon7.show{animation: blueBlink 1s linear -0.5s infinite;} .nav5_circle1{position: absolute;left: 1099px;top: 667px;animation: focusCircle 2s linear infinite;} .nav5_circle2{position: absolute;left: 1427px;top: 448px;animation: focusCircle 2s linear -1s infinite;} .nav5_icon1{position: absolute;left: 1445px;top: 508px;animation: blueBlink 1s linear infinite;} .inner2_page{display: none;z-index: 10;background: white;} .inner2_page .bg{display: block;width: 100%;position: relative;} .inner2_page .back{display: block;width: 100%;position: relative;} .inner2_page .back_home_btn{position: absolute;left: 1129px;top: 960px;width: 500px;height: 100px;background: rgba(0, 0, 0, 0);} .inner2_page .type2{display: none;} .inner2_page .txt_wrapper{position: absolute;left: 65px;top: 92px;width: 414px;height: 60px;overflow: hidden;} .inner2_page .txt_wrapper .txt_loop{position: absolute;left: 0;top: 0;width: 9999px;height: 60px;transform: translate(0,0);} .inner2_page .txt_wrapper .txt_loop.two{animation: twoTxtLoop 4s linear infinite;} .inner2_page .txt_wrapper .txt_loop .grid{float: left;width: 470px;height: 80px;} .inner2_page .txt_wrapper .txt_loop .grid .txt{display: block;padding-left: 20px;} .inner2_page .prev_btn{position: absolute;left: 0;top: 575px;padding: 6px;} .inner2_page .next_btn{position: absolute;right: 0;top: 575px;padding: 6px;} #cat1 .pointer1{position: absolute;left: 1314px;top: 802px;animation: cursorScale 1s linear infinite;width: 60px;} #cat1 .pointer2{position: absolute;left: 1724px;top: 802px;animation: cursorScale 1s linear infinite;width: 60px;} #cat1 .detail_btn2{position: absolute;left: 1380px;top: 670px;width: 410px;height: 180px;background: rgba(0, 0, 0, 0);opacity: 0.5} #cat1 .detail_btn1{position: absolute;left: 965px;top: 670px;width: 410px;height: 180px;background: rgba(0, 0, 0, 0);opacity: 0.5} .inner3_page{display: none;z-index: 10;} .inner3_page .bg{display: block;width: 100%;position: relative;} .inner3_page .back_prev_btn{position: absolute;left: 1129px;top: 980px;width: 240px;height: 70px;background: rgba(0, 0, 0, 0);} .inner3_page .back_home_btn{position: absolute;left: 1383px;top: 980px;width: 240px;height: 70px;background: rgba(0, 0, 0, 0);} #cat2 .pointer1{position: absolute;left: 1306px;top: 804px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat2 .pointer2{position: absolute;left: 1723px;top: 804px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat2 .pointer3{position: absolute;left: 1306px;top: 900px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat2 .pointer4{position: absolute;left: 1723px;top: 900px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat2 .detail_btn1{position: absolute;left: 968px;top: 733px;width: 410px;height: 100px;background: rgba(0, 0, 0, 0);} #cat2 .detail_btn2{position: absolute;left: 1380px;top: 733px;width: 410px;height: 100px;background: rgba(0, 0, 0, 0);} #cat2 .detail_btn3{position: absolute;left: 968px;top: 836px;width: 410px;height: 100px;background: rgba(0, 0, 0, 0);} #cat2 .detail_btn4{position: absolute;left: 1380px;top: 836px;width: 410px;height: 100px;background: rgba(0, 0, 0, 0);} #cat3 .pointer1{position: absolute;left: 1310px;top: 790px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat3 .pointer2{position: absolute;left: 1722px;top: 790px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat3 .pointer3{position: absolute;left: 1722px;top: 890px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat3 .pointer4{position: absolute;left: 1310px;top: 890px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat3 .detail_btn2{position: absolute;left: 1380px;top: 830px;width: 410px;height: 100px;background: rgba(0, 0, 0, 0);} #cat3 .detail_btn1{position: absolute;left: 964px;top: 725px;width: 410px;height: 110px;background: rgba(0, 0, 0, 0);} #cat3 .detail_btn3{position: absolute;left: 1380px;top: 725px;width: 410px;height: 110px;background: rgba(0, 0, 0, 0);} #cat3 .detail_btn4{position: absolute;left: 964px;top: 830px;width: 410px;height: 110px;background: rgba(0, 0, 0, 0);} #cat4 .pointer1{position: absolute;left: 1725px;top: 850px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat4 .pointer2{position: absolute;left: 510px;top: 240px;animation: cursorScale 1s linear -0.5s infinite;width: 60px;} #cat4 .pointer3{position: absolute;left: 1142px;top: 874px;animation: cursorScale 1s linear infinite;width: 60px;} #cat4 .pointer4{position: absolute;left: 110px;top: 240px;animation: cursorScale 1s linear -0.5s infinite;width: 60px;} #cat4 .pointer5{position: absolute;left: 760px;top: 240px;animation: cursorScale 1s linear -0.5s infinite;width: 60px;} #cat4 .pointer6{position: absolute;left: 210px;top: 240px;animation: cursorScale 1s linear -0.5s infinite;width: 60px;} #cat4 .detail_btn1{position: absolute;left: 1380px;top: 653px;width: 440px;height: 290px;background: rgba(0, 0, 0, 0);} #cat4 .switch_btn1{position: absolute;left: 470px;top: 193px;width: 160px;height: 80px;background: rgba(0, 0, 0, 0);} #cat4 .detail_btn2{position: absolute;left: 940px;top: 733px;width: 440px;height: 220px;background: rgba(0, 0, 0, 0);} #cat4 .switch_btn2{position: absolute;left: 60px;top: 193px;width: 160px;height: 80px;background: rgba(0, 0, 0, 0);} #cat4 .switch_btn3{position: absolute;left: 590px;top: 193px;width: 260px;height: 80px;background: rgba(0, 0, 0, 0);} #cat5 .pointer1{position: absolute;left: 1738px;top: 636px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat5 .pointer2{position: absolute;left: 1738px;top: 868px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat5 .pointer3{position: absolute;left: 1738px;top: 411px;animation: cursorScale 1s linear infinite;width: 60px;opacity: 0.5} #cat5 .detail_btn1{position: absolute;left: 1413px;top: 485px;width: 380px;height: 210px;background: rgba(0, 0, 0, 0);} #cat5 .detail_btn2{position: absolute;left: 1413px;top: 712px;width: 380px;height: 210px;background: rgba(0, 0, 0, 0);} #cat5 .detail_btn3{position: absolute;left: 1413px;top: 265px;width: 380px;height: 210px;background: rgba(0, 0, 0, 0);} #video4{position: absolute;left: 119px;top: 365px;height: 421px; z-index: 9} #video4_spot{position: absolute;left: 118px;top: 297px;width: 755px;height: 747px;background: rgba(0, 0, 0, 0);} #video5{position: absolute;left: 118px;top: 375px;height: 422px;} #video5_spot{position: absolute;left: 118px;top: 297px;width: 755px;height: 747px;background: rgba(0, 0, 0, 0);} #video6{position: absolute;left: 83px;top: 393px;height: 505px;z-index:9} #video6_spot{position: absolute;left: 118px;top: 297px;width: 875px;height: 747px;background: rgba(0, 0, 0, 0);} .video_pop{position: fixed;width: 1920px;height: 1080px;left: 0;top: 0;background: rgba(0, 0, 0, 0.8);display: none;} .video_pop .main{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);width: 1150px;} .video_pop .main video{display: block;width: 100%;} .video_pop .main .close_btn{position: absolute;right: -40px;top: -40px;padding: 20px} .go_prev_btn{position: absolute;left: 1120px;top: 988px;width: 510px;height: 72px;} .qr_pop{position: fixed;width: 1920px;height: 1080px;left: 0;top: 0;background: rgba(0, 0, 0, 0.8);display: none;} .qr_pop .bg{display: block;width: 100%;} .qr_pop #pop_qr{position: absolute;left: 50%;transform: translate(-50%,0);top: 300px;width: 300px;} #video41{position: absolute;left: 77px;top: 288px;height: 562px;} #video41_spot{position: absolute;left: 88px;top: 277px;width: 975px;height: 577px;background: rgba(0, 0, 0, 0);} #video3{position: absolute;left: -60px;top: 286px;height: 701px;} #video3_spot{position: absolute;left: 38px;top: 277px;width: 975px;height: 727px;background: rgba(0, 0, 0, 0);} /*@keyframes twoTxtLoop { 0%{transform: translate(0,0);} 40%{transform: translate(0,0);} 50%{transform: translate(-470px,0);} 90%{transform: translate(-470px,0);} 100%{transform: translate(-940px,0);} } @keyframes threextLoop { 0%{transform: translate(0,0);} 25%{transform: translate(0,0);} 33%{transform: translate(-470px,0);} 58%{transform: translate(-470px,0);} 66%{transform: translate(-940px,0);} 91%{transform: translate(-940px,0);} 100%{transform: translate(-1410px,0);} }*/ @keyframes twoTxtLoop { 0%{transform: translate(0,0);} 100%{transform: translate(-940px,0);} } @keyframes threextLoop { 0%{transform: translate(0,0);} 100%{transform: translate(-1410px,0);} } @keyframes focusCircle { 0%{transform: rotate(0deg) scale(0.9);} 50%{transform: rotate(180deg) scale(1.1);} 100%{transform: rotate(360deg) scale(0.9);} } @keyframes cursorScale { 0%{transform: scale(0.9);} 50%{transform: scale(1);} 100%{transform: scale(0.9);} } @keyframes blueBlink { 0%{opacity: 1;} 50%{opacity: 0.6;} 100%{opacity: 1;} }