:root{
  --hover_color:#5085FB;
  --placeholder_color:#999;
  --border_color:#e2e2e2;
}
*{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin:0px;padding:0px;-webkit-tap-highlight-color:transparent;}
*:before,
*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
:focus-visible{outline:none;}
*::-webkit-input-placeholder{color:var(--placeholder_color);font-size:1.2rem;}
*:-moz-placeholder{color:var(--placeholder_color);font-size:1.2rem;}
*::-moz-placeholder{color:var(--placeholder_color);font-size:1.2rem;}
*:-ms-input-placeholder{color:var(--placeholder_color);font-size:1.2rem;}
html{font-family:"ui-sans-serif","system-ui","-apple-system","Segoe UI",Roboto,Ubuntu,Cantarell,"Noto Sans","sans-serif",BlinkMacSystemFont,Helvetica Neue,Arial,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#333;font-size:62.5%; /*涔熷氨鏄�10px(1em=1rem=10px) 榛樿鏄�16px(1em=1rem=16px)*/ }
@media screen and (max-width:768px){
  html{font-size:31.25%; /*涔熷氨鏄�5px(1em=1rem=5px)*/}
}
body{position:relative;width:100%;max-width:100%;}

html,body{width:100%;height:100%;overflow:hidden;margin:0 auto;}


img{ max-width:100%;}
.flx-center{display: flex;align-items: center;flex-direction: column;justify-content: center;}
ul,
li{display:block;list-style:none;padding-inline-start:0px;}
.page-box .flex{display: flex;}
.page-box .layout-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.page-box .iframe,.page .cover{position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.page-box .video-box{position:absolute;top:0;left:0;}
.page-box .btn-back{position: absolute;left: 20px;top: 30px;z-index: 2;max-width: 32px;cursor: pointer;}
.page-box .btn-back img{max-width: 100%;}
.page-box{position: relative; width: 100%;height: 100%;overflow: hidden;background: #000;}
.page-box .none{display: none !important;}
.page-box video{width:100%;height:100%;object-fit:cover;}
.page-box .screen{width:100%;height:100%;background:url('../img/bg.png') no-repeat center 0/cover;align-items: center;justify-content: center;}

.page-box .load-box{background:url('../img/cover.png') no-repeat center/contain;z-index: 50;}
.page-box .load-box .cover{width: 100%;height: 100%;backdrop-filter: blur(15px);background: rgba(0, 0, 0, 0.6);}
.page-box .scale{transition: all .5s;}
.page-box .scale:hover{transform: scale(1.1);}

.page{position: absolute;left: 0;right: 0;top: 0;bottom: 0;}
.page .cover{background:url('../img/cover.jpg') no-repeat center/cover;z-index: 10;display: flex;justify-content: center;align-items: center;cursor: pointer;}
.page .cover .play{background:url('../img/play.png') no-repeat center/contain;width: 50px;height: 50px;}
.page2 .tt{justify-content: center;margin-top: 2%;margin-left: 0;}
.page2 .img{position: absolute;}
.page2 .zshi{width: 6px;}
.page2 .img-lt{left: 3%;top: 5%;}
.page2 .img-rb{right: 3%;bottom: 5%;}
.page2 .header{margin: 1.8vw 0 3vw;padding: 0 8vw;align-items: center;}
.page2 .header .t{max-width: 65%;margin-right: 40px;}
.page2 .header .ser{flex: 1;background:url('../img/page2/s_bg.png') no-repeat 0 0/100% 100%;align-items: center;}
.page2 .header .ser .inp{background: none;border: none;color: #FFFFFF;font-size: 16px;padding: 0 3vw;width: 100%;line-height: 60px;}
.page2 .header .ser .btn{display: inline-block;background:url('../img/page2/2.png') no-repeat 0 50%/contain;width: 30px;height: 30px;cursor: pointer;margin-left: -3vw;}
.page2 .ul{padding: 0 6vw;position: relative;}
.page2 .ul .ll{background-image: url('../img/page2/ll.png');left: 3vw;}
.page2 .ul .rr{background-image: url('../img/page2/rr.png');right: 3vw;}
.page2 .ul .ll,.page2 .ul .rr{width: 5vw;height: 5vw;top: 50%;background-position: center;background-size: contain;background-repeat: no-repeat;cursor: pointer;margin-top: -2.5vw;}
.nav{margin-top: 2%;margin-left: -1vw;}
.nav li+li{margin-left: 1vw;}
.nav li{cursor: pointer;display: flex;flex-direction:column;justify-content: space-between;align-items: center;transition: all .5s;position: relative;flex: 1;}
.nav li:hover{transform: scale(1.1);}
.nav li .txt{position:relative;font-size:1.2vw;background:linear-gradient(90deg,#FFFFFF 0%,#5FB4F8 100%);padding:0 2vw;-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin: 1vw 0 0.5vw;}
.nav.nv li{background-image: url('../img/page2/k_bg.png');}
.nav.nv{margin-bottom: 3vw;}
.nav.nv li,.nav.nv2 li{background-position: center;background-size: 100% 100%;background-repeat: no-repeat;}
.nav.tt li{width: 25vw;flex: none;}
.nav li.first{display: none;}
.img-text{justify-content: center;}


.password-visit{z-index: 50;}
.password-visit .content{width:350px;background:linear-gradient( 180deg,#FFF9DF 0%,#489667 100%),rgba(255,255,255,0.8);box-shadow:0px 4px 16px 0px rgba(0,0,0,0.3);border-radius:30px;left: 50%;top: 50%;transform: translate(-50%,-50%);position: absolute;padding: 40px 30px 50px;text-align: center;}
.password-visit .content input{border: none;height: 100%;width: 100%;padding-left: 16px;font-size: 14px;}
.password-visit .content .inp{height:45px;background:#FFFFFF;border-radius:10px;border:1px solid #D9D9D9;overflow:hidden;margin: 30px 0 20px;position: relative;}
.password-visit .content .t{font-size: 24px;}
.password-visit .content .btn{background:linear-gradient( 149deg,#ACD896 0%,#2C784B 100%);box-shadow:0px 2px 4px 0px rgba(0,0,0,0.5);border-radius:10px;padding: 10px 0;font-size: 20px;cursor: pointer;}
.password-visit .content .btn span{background: linear-gradient(90deg, #FFFFFF 0%, #EBD16B 100%); -webkit-background-clip: text;-webkit-text-fill-color: transparent;font-weight: bold;}
.password-visit .content .eye{display: inline-block;width: 30px;height: 30px;position: absolute;right: 10px;top: 6px;background-image: url('../img/eye2.png');background-size: contain;background-repeat: no-repeat;background-position: center;cursor: pointer;}
.password-visit .content .eye.on{background-image: url('../img/eye.png');}
/* Responsive Styles */
@media (max-width: 600px) {
  .page-box .screen{background:url('../img/bg_m.png') no-repeat center 0/cover;}
  .nav{flex-wrap: wrap;margin-left: -2vw;margin-right: -2vw;margin-top: 10%;}
  .nav li{flex-basis: calc(100% / 2);padding:  2vw;}
  .nav li+li{margin-left: 0;}
  .nav li.first,.ul .sm{display: flex!important;}
  .nav.tt,.ul .xl{display: none;}
}

.fadeInUp{-webkit-animation:fadeInUp 1s .2s ease both;-moz-animation:fadeInUp 1s .2s ease both;}
@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px)}
100%{opacity:1;-webkit-transform:translateY(0)}
}
@-moz-keyframes fadeInUp{0%{opacity:0;-moz-transform:translateY(20px)}
100%{opacity:1;-moz-transform:translateY(0)}
}
.bounceIn{opacity:1 !important;-webkit-animation:bounceIn 1s .2s ease both;-moz-animation:bounceIn 1s .2s ease both;}
@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(0)}
100%{-webkit-transform:scale(1)}
}
@-moz-keyframes bounceIn{0%{opacity:0;-moz-transform:scale(0)}
100%{-moz-transform:scale(1)}
}
.fadeIn{-webkit-animation:fadeIn 1s .2s ease both;-moz-animation:fadeIn 1s .2s ease both;}
@-webkit-keyframes fadeIn{0%{opacity:0;}
100%{opacity:1;}
}
@-moz-keyframes fadeIn{0%{opacity:0;}
100%{opacity:1;}
}