html {overflow-x:hidden !important;}
body {cursor:pointer;font-family:"Arial","Helvetica","sans-serif","Microsoft yahei";}
body, input, button, select, textarea {margin:0;padding:0;}
img {border:none;border:0;display:block;}
input,button {border:none;border:0;display:block;}
input,button:focus {outline:none;}
a {color:#666;text-decoration:none;outline:0;transition:all 0.3s ease 0s;}
a:hover {color:#3E68FA;}
.bg {background:#F6F6F6;}
.main {overflow:hidden;width:25%;height:100vh;text-align:center;margin:0 auto;}
.main .union {overflow:hidden;margin-top:20vh;padding:10%;background:#FFF;border-radius:10px;}
.main .union .header {overflow:hidden;}
.main .union .header .logo {overflow:hidden;}
.main .union .header .logo img {overflow:hidden;text-align:center;margin:0 auto;}
.main .union .header .logowen {overflow:hidden;margin:0;padding:0;height:30px;line-height:30px;font-size:24px;font-weight:bold;background:-webkit-linear-gradient(top,#C8E0FF,#5B94E1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:inline-block;}
.main .union .logreg {overflow:hidden;}
.main .union .logreg .inp {overflow:hidden;padding-bottom:1rem;}
.main .union .logreg .inpcap {overflow:hidden;padding-bottom:1rem;}
.main .union .logreg .inpcap .cap1 {float:left;width:60%;}
.main .union .logreg .inpcap .cap1 .cha {overflow:hidden;cursor:pointer;width:91%;padding-left:9%;height:3.5rem;line-height:3.5rem;border-top-left-radius:4px;border-bottom-left-radius:4px;background:#F6F6F6;font-size:0.9rem;border:0px solid #0E121A;border-right:0px solid #0E121A;color:#333;}
.main .union .logreg .inpcap .cap2 {float:left;width:40%;border-top-right-radius:4px;border-bottom-right-radius:4px;}
.main .union .logreg .inpcap .cap2 img {overflow:hidden;width:100%;height:3.5rem;border-top-right-radius:4px;border-bottom-right-radius:4px;background:#FFF;}
.main .union .logreg .alert-msg {overflow:hidden;width:100%;}
.main .union .logreg .sub {overflow:hidden;}
.main .union .logreg .sub .btn {overflow:hidden;cursor:pointer;width:100%;margin:0;padding:0;height:3.5rem;line-height:3.5rem;border-radius:4px;font-size:1rem;background:linear-gradient(180deg, #137AD2, #1365D2);color:#FFF;font-weight-:bold;border-bottom:0px solid #000;}
.main .union .logreg .sub .btn:hover {background:linear-gradient(180deg, #1365D2, #137AD2);}
.main .union .logreg .first {overflow:hidden;cursor:pointer;width:95%;padding-left:5%;height:3.5rem;line-height:3.5rem;border-radius:4px;background:#F6F6F6;border:0px solid #0E121A;color:#333;font-size:0.9rem;}
.footer {overflow:hidden;padding-top:0.5rem;font-size:0.76rem;color:#C0C0C0;text-align:center;margin:0 auto;opacity:0.8;}
.main .union .footer button {overflow:hidden;cursor:pointer;background:#232C3E;padding:0;text-align:center;margin:0 auto;color:#F5574B;}
.main .union .footer button:hover {color:#FFF;}
.main .union .footer p {padding-top:0.5rem;color:#B6B7BA;margin:0 auto;}
.modal {display:none;position:fixed;z-index:1;left:0;top:0;width:100%;height:100vh;overflow:auto;background-color:rgba(0, 0, 0, 0.8);}
.modal-content {background:-webkit-linear-gradient(left,#F5574B,#E63E31);border:2px solid #000;border-radius:10px;margin:0 auto;margin-top:25vh;width:30%;position:relative;opacity:0.9;}
.modal-content h6 {overflow:hidden;width:100%;text-align:center;font-size:24px;font-weight:normal;padding:0;margin:0;padding-top:20px;padding-bottom:20px;color:#FFF;}
.modal-content .content {overflow:hidden;width:100%;border-top:1px solid #000;padding:0;margin:0;padding-top:18px;padding-bottom:18px;text-align:center;font-size:14px;line-height:32px;}
.modal-content .content p {padding:0;margin:0;color:#DDD;}
.modal-content .content span {overflow:hidden;float:left;width:100%;padding-top:10px;padding-bottom:10px;}
.modal-content .content span a {float:left;width:60%;height:32px;line-height:32px;border-radius:50px;text-align:center;color:#F5574B;background:-webkit-linear-gradient(left,#FCE4C0,#FFF,#FCE4C0);margin-left:20%;}
.modal .clo {overflow:hidden;margin:0 auto;text-align:center;width:100%;padding-top:10px;}
.modal .clo .close {color:#aaa;font-size:28px;font-weight:bold;cursor:pointer;text-align:center;margin:0 auto;width:100%;}
.close:hover,.close:focus {color:black;text-decoration:none;}
.alert-msg {display:none;}
.alert-msg .alert {}

.bgb {height:100vh;background:linear-gradient(135deg, #1365D2 , #137AD2 , #1365D2);}
.mainone {overflow:hidden;width:100%;height:100vh;position:absolute;}
.indexmain {overflow:hidden;text-align:center;margin:0 auto;}
.indx {overflow:hidden;padding-top:30vh;}
.indx .logo {overflow:hidden;}
.indx .title {overflow:hidden;font-size:3.5rem;margin-bottom:0.5rem;background:linear-gradient(90deg, #FFF, #DDD);-webkit-background-clip:text;background-clip:text;color:#FFF;font-weight:700;-webkit-text-stroke:0px #1365D2;}
.indx p {overflow:hidden;color:#7BC0FF;font-size:0.86rem;}
.indx .subbtn {overflow:hidden;width:280px;text-align:center;margin:0 auto;padding-top:0.5rem;}
.indx .subbtn a {float:left;width:100%;line-height:3.4rem;background:linear-gradient(180deg, #FFF, #B9DEFF);color:#1365D2;text-align:center;border-radius:30px;font-size:1.2rem;transition:all 0.3s ease 0s;font-family:"Microsoft yahei";}
.indx .subbtn a:hover {background:linear-gradient(180deg, #B9DEFF, #FFF);}

@media screen and (max-width:640px) {
.main {width:90%;}
.main .union {margin-top:10vh;padding:5%;}
.main .union .logreg .first {height:3rem;line-height:3rem;}
.main .union .logreg .sub .btn {height:3rem;line-height:3rem;}
.main .union .logreg .inpcap .cap1 .cha {height:3rem;line-height:3rem;}
.main .union .logreg .inpcap .cap2 img {height:3rem;}

.modal-content {margin-top:25vh;width:80%;}

.indx {padding-top:30vh;}
.indx .title {font-size:2rem;}
.indx .subbtn {width:60%;}

#particles-js {height:100vh;}

}

#particles-js {position:absolute;width:100%;height:99.2vh;background:linear-gradient(135deg, #1365D2 0%, #137AD2 50%, #1365D2 100%);z-index:-1;}
        
.floating-elements {position: absolute;width: 100%;height: 100%;overflow: hidden;z-index: 0;}
.floating-element {position: absolute;border-radius: 50%;background: rgba(255, 255, 255, 0.05);animation: float 15s infinite linear;}
        
@keyframes float {
            0% {
                transform: translateY(0) rotate(0deg);
                opacity: 0.5;
            }
            50% {
                transform: translateY(-20px) rotate(180deg);
                opacity: 0.8;
            }
            100% {
                transform: translateY(0) rotate(360deg);
                opacity: 0.5;
            }
        }
        
