@import url("root.css");
@import url("animate.css");
@import url("../font/icons.css");
*,*:before,*:after{box-sizing:border-box;}
body{ background:var(--body)}
article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block;}
a,button,span,p,i,input,em,select,textarea,li,dl,dt,img,svg path,*:after,*:before,h1,h2,h3,h4,h5,h6{transition:all .5s ease-out 0s;}
/* Preloader */
.preloading{position:fixed;top:0;left:0;z-index:9999999999;width:100%;height:100%;background-color:#fff;overflow:hidden;}
.preloader-inner{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
.preloader-icon{width:100px;height:100px;display:inline-block;padding:0px;}
.preloader-icon span{position:absolute;display:inline-block;width:100px;height:100px;border-radius:100%;background:#0167F3;-webkit-animation:preloader-fx 1.6s linear infinite;animation:preloader-fx 1.6s linear infinite;}
.preloader-icon span:last-child{animation-delay:-0.8s;-webkit-animation-delay:-0.8s;}
@keyframes preloader-fx{0%{-webkit-transform:scale(0,0);transform:scale(0,0);opacity:0.5;}100%{-webkit-transform:scale(1,1);transform:scale(1,1);opacity:0;}}
@-webkit-keyframes preloader-fx{0%{-webkit-transform:scale(0,0);opacity:0.5;}100%{-webkit-transform:scale(1,1);opacity:0;}}
a{transition:color 0.6s;}
a:hover{text-decoration:none;transition:all .5s ease-in-out;}
li,ol,ul,dl,dt,dd,p{list-style:none;padding:0;margin:0}
.icon{font-size:20px}
.h15{ height:15px}

.header{ padding-top:10px; padding-bottom:10px; border-bottom:1px solid var(--primary-lt); background:#fff}
.header>*>*{align-items:center;}
.top-menu{gap:15px;display:flex;justify-content:flex-end;align-items:center; font-size:14px}
.top-menu a{display:flex;color:var(--muted);align-items:center;}
.top-menu a i{ margin-right:2px}
.navbar-brand{ padding:10px 0}
.navbar-brand img{height:40px; opacity:0.7;transition:all 0.3s ease-in-out;}
.navbar-brand img.off{ display:none; opacity:0}
.navbar-brand-image{filter:brightness(0) invert(1);}
@media only screen and (max-width:639px){.navbar-brand{ padding:9px 0}.navbar-brand img{height:32px;}}
.uk-navbar-nav>li>a{ min-height:40px; font-size:inherit;color:var(--th-main-dark)}
.uk-navbar-nav{ padding-left:30px}

.nav-item,.nav-link{ position:relative; z-index:9; color:var(--th-main-dark)}
.nav-link.active{ color:var(--th-main)}
.nav-link.active:before{ width:100%; height:6px; background:rgb(var(--th-blue-rgb),0.2); content:""; position:absolute; z-index:-1; border-radius:2px; left:0; bottom:10px}

.nav-search i{ display:block; width:24px; height:24px; text-align:center; line-height:24px; font-size:20px; cursor:pointer;outline:none}
.search-form{ position:relative; right:-50px; z-index:9999}
.form-control{ max-width:300px; width:100%; height:30px; border:1px solid var(--gray-300); border-radius:15px; padding:2px 10px; outline:none}
.form-so{ position:absolute; right:0; top:2px; height:24px; height:24px; text-align:center; line-height:24px; background:none; border:none; outline:none}

.avatar {--avatar-size:2.5rem;position:relative;width:var(--avatar-size);height:var(--avatar-size);display:inline-flex;align-items:center;justify-content:center;color:#656d77;text-align:center;text-transform:uppercase;vertical-align:bottom;user-select:none;background:#f0f2f6 no-repeat center/cover;border-radius:4px}
@media (min-width:360px){.avatar{--avatar-size:3.125rem;}}
@media (min-width:375px){.avatar{--avatar-size:3.75rem;}}
@media (min-width:440px){.avatar{--avatar-size:5rem;}}
@media (min-width:640px){.avatar{--avatar-size:6.25rem;}}
@media (min-width:960px){.avatar{--avatar-size:7.5rem;}}
@media (min-width:1200px){.avatar{--avatar-size:10rem;}}
@media (min-width:1440px){.avatar{--avatar-size:11.25rem;}}
.nodata{ padding:30px;}
.title-h4{ position: relative; padding:20px 30px 0px; margin:0px auto 20px; line-height:1; font-size:20px;}
.title-h4 i{ margin-right:5px; position:relative; z-index:3}
.title-h4 i:after{ content:""; width:16px; height:16px; position:absolute; right:-2px; bottom:-2px;background-image: linear-gradient(to right bottom,rgb(var(--th-grad2-rgb),0.4), rgb(var(--th-grad1-rgb),0.06)); border-radius:50%}
.left-list,.uk-xiang,.right-card,.list-box{ background:#fff; box-shadow:0px 4px 12px rgb(var(--th-main-dark),0.1); border-radius:4px}
.list>li{ border-top:1px solid var(--th-main-light); padding:30px}
.list>li:hover{ background:rgb(var(--primary-lt-rgb),0.3)}
.list>li>dl{align-items:center;}
.list>li>dl>dt{order:99;}
.list h3{ margin-bottom:15px;}
.list h3>a{ color:var(--th-main-dark)}
.list h3>a i{border-radius:3px; padding:0px 4px; line-height:1; font-size:16px; font-style:normal;border:1px solid var(--info); color:var(--info);}
.list h3>a.j{ margin-right:5px; display:flex;align-items: center;}
.list *+p{ margin-top:10px; font-size:14px; color:var(--gray-400)}
.text-tags{ font-size:14px; gap:10px; display:flex; display:none}
.text-info{display:flex;align-items: center; line-height:1;gap:20px;}
.text-info span{display:flex;align-items:center;}
.text-class{border-radius:4px; padding:3px; border:1px solid var(--th-main-borde); background:#fff}
.text-class:hover{ border-color:var(--th-blue); background:var(--th-blue); color:#fff}
.text-class a{ color:var(--th-main-light)}
.text-eidt{border-radius:4px; padding:3px;border:1px solid var(--info-lt); background:var(--info-lt);}
.text-eidt i{ margin-right:3px}
.page{ margin-top:30px;}
.local{ padding-bottom:20px}
.uk-breadcrumb{ font-size:12px; color:var(--th-main-light);}
.uk-breadcrumb>:nth-child(n+2):not(.uk-first-column)::before{color:var(--th-main-light); margin:0px 10px}
.uk-breadcrumb>a,.uk-breadcrumb>*>*{ color:var(--th-main-light)}
.uk-breadcrumb>a>i{ font-size:12px; margin-right:3px}
.list-page{ padding:30px; border-top:1px solid var(--th-main-light);}
.uk-pagination{ gap:5px; font-size:14px}
.uk-pagination>*>*{ padding:5px 8px; line-height:1; border:1px solid var(--gray-300); }
.uk-pagination>*>*:hover{ color:#fff; background:var(--th-red); border-color:var(--th-red)}
.uk-pagination li.active a{ background:var(--th-sub);border-color:var(--th-sub); color:#fff}

.right-card{ padding:20px; font-size:14px;}
.title-h5{ font-size:16px; line-height:1; margin-bottom:20px; display:flex;align-items:center;justify-content: space-between;}
.title-h5 span{ position:relative; padding-left:10px;}
.title-h5 span:before{ content:""; position:absolute; width:4px; height:8px; left:0; top:0px; background:var(--th-grad1); border-radius:2px 2px 0px 0px}
.title-h5 span:after{ content:""; position:absolute; width:4px; height:8px; left:0; top:8px; background:var(--th-grad2);border-radius:0px 0px 2px 2px }
.title-h5 span b{ color:var(--th-main)}

.uk-xiang{ margin-top:30px;}
.uk-xiang .title-h5{position: relative; padding:20px 30px 0px; margin:0px auto 20px; line-height:1;}

.grid-about{ text-align:center}
.grid-about a{ display:block; padding:6px 10px; border:1px solid var(--gray-200); border-radius:3px;}
.grid-about li.active a{ border-color:var(--th-blue); background:var(--th-blue); color:var(--th-main-light)}
.grid-links{ font-size:14px;}
.grid-links a{ color:var(--gray)}

.list-box{ padding:20px 30px}
.list-box a{ display:block;word-wrap: normal;text-overflow: ellipsis;white-space: nowrap;overflow: hidden; color:var(--th-sub); position:relative; padding-left:10px}
.list-box a:before{ content:""; position:absolute; width:4px; height:4px; border-radius:50%; background:var(--gray-500); left:0; top:10px;}

@media only screen and (max-width:959px){

}
@media only screen and (max-width:639px){

}
@media only screen and (max-width:359px){

}


.banner-area{ padding-top:80px;position:relative;max-height:500px;overflow:hidden;background-image:-moz-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-webkit-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-ms-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);}
.banner-area:before{ content:""; position:absolute; left:0; top:-2px; background:url(../img/shadow/shadow-2.png) center top no-repeat; height:60%; width:100%; opacity:0.3}
.banner-content{padding-top:80px;color:#fff;position:relative;z-index:2}
.banner-content .subheading{position:relative;display:inline-block;border-radius:4px;background:var(--info-lt);color:var(--primary);padding:10px 15px;line-height:1}
.banner-content .subheading:after{content:'';position:absolute;right:0;bottom:-7px;width:0;height:0;border-left:14px solid transparent;border-right:0px solid transparent;border-top:13px solid var(--info-lt)}
.banner-content h1{font-weight:bold;color:#fff;margin:0px auto;position:relative;z-index:2}
.banner-content h1:before{content:"";width:120px;height:10px;border-radius:3px;position:absolute;left:0;bottom:0;background:linear-gradient(to bottom right,rgb(var(--blue-rgb),0.8),transparent);z-index:-1}
.banner-content h2{line-height:1;color:var(--info-lt);margin-top:1rem;font-weight:800}
.banner-content .Description{color:rgb(255,255,255,0.7)}
.banner-content .chat{margin:20px auto}
.banner-content .chat a{border-radius:5px;background:var(--primary);padding:10px;color:#fff;font-size:14px}
.banner-img{position:relative;left:120px;padding-top:40px}
.banner-img img{position:relative;z-index:2;animation:fl-x 2s ease-in-out infinite alternate;}
.banner-img:after{width:500px;height:500px;background:rgb(var(--info-lt-rgb),0.3);border-radius:50%;content:"";left:50%;margin-left:-250px;bottom:0px;position:absolute;box-shadow:0px -40px 120px rgb(var(--info-lt-rgb),0.1)}
@media only screen and (max-width:959px){
.banner-area{ max-height:inherit}
.banner-img{ left:inherit}
}
@media only screen and (max-width:639px){
.banner-area{ padding-top:60px;}
.banner-content{ padding-top:40px;}
}
.shape{position:absolute}
.shape-01{opacity:0.5;left:10%;top:10%}
.shape-02{opacity:0.2;right:30px;bottom:-30px}



.contact-top{ position:absolute; left:0; right:0; top:0; z-index:123456}
.contact-top .uk-container{ position:relative;z-index:2}
.contact-top .uk-sticky:before{transition:all 0.3s ease-in-out;left:0; top:-60px; width:100%; height:100%; right:0; position:absolute; content:""}
.contact-top .uk-sticky.uk-active:before{transition:all 0.3s ease-in-out; background:rgb(var(--light-rgb),0.95);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px); left:0; top:0; box-shadow:0px 5px 15px rgb(0,0,0,0.05)}

.content-area .uk-container{ max-width:960px}
.content-area .uk-article{ line-height:2; background:#fff; border:1px solid var(--gray-200); margin-top:50px; padding:30px 40px}
.content-area .uk-article p{ margin:15px auto}
.content-area .uk-article img.qq{ width:200px;}

.contact-info,.contact-table{ background:url(../../../images/img/pic/about-page-bg.png) no-repeat; background-size:100% 100%; padding:120px 0}
.contact-info-img{ position:relative;}
.contact-info-img .img{ width:100%; position:relative; z-index:2}
.contact-info-img .shape3{ bottom:-20px; left:-20px;}
.contact-info-img .shape4{ top:-20px; right:-20px;}
.contact-info-right{ padding-left:60px}
.contact-info-right h2{ margin:20px auto; font-size:20px; font-weight:bold}
.contact-info-right p{ margin:15px auto 0; font-size:14px}
.contact-info-right span{ display:inline-block; font-size:12px; left:1.5; padding:2px 6px;background:linear-gradient(to right,#62bdfc,#8490ff); color:#fff}
.contact-info .uk-grid{ padding-top:50px}

.contact-info-content{animation:fl-y 3s linear infinite; width:120px; height:120px;display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:10px;position:absolute; bottom:50px; right:-50px; z-index:3}
.contact-info-content h3{color:#fff;margin:5px auto;position:relative;z-index:10; line-height:1.2; font-weight:700; font-size:32px}
.contact-info-content p{color:#fff;font-size:13px;line-height:1;position:relative;z-index:10;}
.info-svg-1{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#8490ff;-webkit-clip-path:polygon(0 0,100% 9%,100% 95%,0% 100%);clip-path:polygon(0 0,100% 9%,100% 95%,0% 100%);z-index:10;border-radius:15px 25px 25px 15px;}
.info-svg-2{position:absolute;top:8px;left:-8px;width:100%;height:100%;background-color:#62bdfc;-webkit-clip-path:polygon(0 0,100% 9%,100% 95%,0% 100%);clip-path:polygon(0 0,100% 9%,100% 95%,0% 100%);z-index:9;border-radius:15px 25px 25px 15px;}
@media (max-width:959px){
.contact-info,.contact-table{ padding:80px 0}
.contact-info-content{ right:-10px;}
.content-area .uk-article{ margin-top:40px; padding:20px 30px}
.contact-info-right{ padding-left:0px}
.contact-info-img .shape4{right:-15px;}
}
@media (max-width:639px){
.contact-info,.contact-table{ padding:40px 0}
.content-area .uk-article{ margin-top:30px; padding:15px 20px}
h2.t{ margin-bottom:15px}
.contact-info-img .shape4{ top:-15px; right:-10px;}
.contact-info .uk-grid{ padding-top:40px}
}
@media (max-width:359px){
.contact-info,.contact-table{ padding:30px 0}
.content-area .uk-article{ margin-top:20px; padding:10px 15px}
h2.t{ margin-bottom:10px}
.contact-info .uk-grid{ padding-top:20px}
}

.contact-offer ul{ margin-top:50px}
.contact-offer dl{ text-align:center; padding:20px;}
.contact-offer dl:hover{ background:var(--info-lt); box-shadow:0px 5px 15px rgb(var(--primary-rgb),0.1)}
.contact-offer dt{ margin:0px auto;background-color:rgba(var(--primary-rgb),.2);display:inline-block;height:100px;width:100px;border-radius:120px 135px 110px 90px; text-align:center}
.contact-offer dt:before{position:absolute;content:"";height:100%;width:100%;top:0;left:5px;background:rgba(var(--primary-rgb),.05);border:2px solid var(--blue-darken);border-radius:130px 120px 160px 130px;}
.contact-offer dl:hover dt{transform:rotate(360deg);}
.contact-offer dd{ margin-top:20px;}
.contact-offer dd p{ margin-top:10px; font-size:14px;}
.contact-offer dd p.t{ font-weight:800; font-size:16px}
.contact-offer .icon{line-height:100px; color:var(--primary)}

.idea-img{text-align:right;padding:50px;}
.idea-text{line-height:2}

.contact-server .server{margin-top:50px;}
.server-img{background:url(../../../images/about/service.jpg) no-repeat left center;background-size:cover}
.server-text p,.idea-text p{margin:15px auto}
.server-text{padding:60px;line-height:2}


.contact-area form{ margin-top:50px}

.common-textarea{ height:100%; }
.form-button{display:flex;justify-content:center;align-items:center;}
.form-button span{ margin-right:10px; font-size:14px; line-height:16px;}
.form-btn button{ border:none;background-image:linear-gradient(90deg,#62bdfc 0%,#8490ff 100%); cursor:pointer; border-radius:20px; padding:10px 60px 10px 30px; position:relative; color:#fff;}
.form-btn button i{transition:all 0.3s ease 0s; position:absolute; transform:translateY(-45%);top:50%;right:30px}
.form-btn button:focus{outline:none;}
.form-btn button:hover i{ right:20px;transition:all 0.3s ease 0s;}

.section-gap{padding:120px 0}

.contact-bottom{ padding-top:80px; background:var(--gray-200)}
.contact-bottom-nav{ text-align:center;display:flex;justify-content:center;align-items:center; font-size:14px;color:var(--gray-500)}
.contact-bottom-nav a{ padding:0px 10px; color:var(--gray-600); position:relative;}
.contact-bottom-nav a:before{ width:1px; height:12px; background:var(--gray-300); content:""; position:absolute; left:0; top:50%; margin-top:-6px;}
.contact-bottom-nav a:first-child:before{ display:none}
.contact-copyright{ background:var(--gray-300); margin-top:60px; min-height:50px; display:flex;justify-content:center;align-items:center!important; color:var(--gray-500); font-size:14px;}

.hexagon{display:flex;justify-content:center; text-align:center; margin:0px auto; padding-bottom:120px; padding-top:60px}
.hexagon dl{ background:var(--light);box-shadow:0 20px 70px -20px rgba(0,0,0,0.34); padding:60px 30px 20px; position:relative; z-index:1; cursor:pointer}
.hexagon dl:before{ content:"";background:#8490ff;background:-webkit-linear-gradient(to right,#62bdfc,#8490ff);background:linear-gradient(to right,#62bdfc,#8490ff); border-radius:50%; width:50px; height:50px;transition:all .3s linear; opacity:0; left:0; top:0; position:absolute; }
.hexagon dt{transform:rotate(60deg); width:88px; height:112px; overflow:hidden;position:absolute; top:-56px; left:50%; margin-left:-44px; z-index:3}
.hexagon dt>*{ width:100%; height:100%; top:0; left:0; position:absolute;transform:rotate(-120deg); overflow:hidden}
.hexagon dt>*>*{ width:100%; height:100%; top:0; left:0; position:absolute;transform:rotate(60deg); background:var(--blue-lt); color:var(--blue); overflow:hidden}
.hexagon dt>*>*>*{ font-size:3rem; line-height:2.3}
.hexagon dd{ font-size:14px; min-width:90px; position:relative; z-index:2;transition:all .3s linear}
.hexagon dl:hover{transform:translateY(-0.5rem)}
.hexagon dl:hover dt>*>*{ background:var(--orange-lt); color:var(--orange);}
.hexagon dl:hover dd{ color:#fff}
.hexagon dl:hover:before{ width:100%; height:100%; border-radius:0; opacity:1}
@media (max-width:959px){
.section-gap{padding:80px 0}
.idea-img{padding:40px 20px; text-align:center}
.hexagon{padding-bottom:80px;}
.hexagon dl{ padding:60px 10px 20px}
.server-text{padding:30px;}
.contact-server .server{margin-top:40px;}
.contact-offer ul{ margin-top:40px}
.contact-bottom{ padding-top:60px}
.contact-copyright{ margin-top:50px}
}
@media (max-width:639px){
.section-gap{padding:40px 0}
.hexagon{padding-bottom:40px;}
.hexagon dl{ padding:60px 15px 30px}
.hexagon .uk-grid{ margin-left:-15px}
.hexagon .uk-grid>*{ padding-left:15px}
.idea-img{padding:0px;}
.server-text{padding:0px 15px;}
.contact-server .server{margin-top:30px;}
.contact-offer ul{ margin-top:30px}
.contact-bottom{ padding-top:40px}
.contact-copyright{ margin-top:40px}
.contact-bottom-nav{flex-wrap:wrap}
}
@media (max-width:359px){
.contact-server .server{margin-top:20px;}
.contact-offer ul{ margin-top:20px}
.server-text{padding:0px 10px;}
.contact-bottom{ padding-top:20px}
.contact-copyright{ margin-top:20px}
}

.chat-a{position:relative}
.chat-a a{display:block;left:0;top:0;right:0;bottom:0;position:absolute;width:100%;height:100%}
.agreement{ background:url(../img/bg/bg-ge-footer.png) var(--body)}
.agreement .banner-area{ background-image:url(../../../images/about/slide2.jpg); background-position:center top; background-repeat:no-repeat; background-size:cover}
.agreement .banner-area:after{ opacity:0.9; left:0; top:0;content:"";position:absolute;height:100%; width:100%;background-image:-moz-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-webkit-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-ms-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);}
.agreement .banner-content{ padding-bottom:60px}
.agreement .banner-content p{ margin-top:20px}

.statement{ background:url(../img/bg/bg2.png) var(--body)}
.statement .banner-area{ background-image:url(../../../images/about/slide1.jpg); background-position:center top; background-repeat:no-repeat; background-size:cover}
.statement .banner-area:after{ opacity:0.9; left:0; top:0;content:"";position:absolute;height:100%; width:100%;background-image:-moz-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-webkit-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-ms-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);}
.statement .banner-content{ padding-bottom:60px}
.statement .banner-content p{ margin-top:20px}

.toushu{ background:url(../img/bg/body-pattern.png) var(--body)}
.toushu .banner-area{ background-image:url(../../../images/about/slide3.jpg); background-position:center top; background-repeat:no-repeat; background-size:cover}
.toushu .banner-area:after{ opacity:0.9; left:0; top:0;content:"";position:absolute;height:100%; width:100%;background-image:-moz-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-webkit-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);background-image:-ms-linear-gradient(0deg,#62bdfc 0%,#8490ff 100%);}
.toushu .banner-content{ padding-bottom:60px}
.toushu .banner-content p{ margin-top:20px}

.contact-form{ margin-top:50px; background:#fff; padding:30px;}
.contact-form .upload{ position:relative}
.contact-form .upload span{ position:absolute; right:2px; top:2px; width:90px; height:34px; text-align:right}
@media (max-width:639px){
.agreement .banner-content,.statement .banner-content,.toushu .banner-content{ padding-bottom:40px}
}

.right-form dt{ display:none}
.vercode dd{ position:relative; display:flex;align-items: center;}
.vercode dd img{ height:30px; margin-left:5px;}

.uk-footer{ background:var(--sub); color:rgb(var(--light-rgb)); margin-top:30px}
.uk-footer-nav{ padding:40px 0px; border-bottom:1px solid rgb(var(--sec-rgb),0.3);color:rgb(var(--light-rgb),0.7); }
.uk-footer-nav h4{ font-weight:bold; color:#fff; font-size:14px; line-height:1;position:relative}
.uk-footer-nav h4 i{ margin-right:6px;}
.uk-footer-nav h4 b{ position:relative; z-index:3}
.uk-footer-nav h4 b:before{ content:""; height:5px; width:100%; bottom:0; left:0; position:absolute;background-image: linear-gradient(to right,rgb(var(--th-red-rgb),0.3), transparent);}
.uk-footer-menu ul{ padding-left:20px; font-size:14px;}
.uk-footer-menu ul a{color:rgb(var(--light-rgb),0.7)}
.uk-footer-menu dt{ margin-bottom:5px;}
.uk-footer-menu dd{ margin-left:-10px;}
.uk-footer-menu dd span{ padding-left:10px; display:inline-block}
.uk-copyright{ font-size:0.875rem;color:rgb(var(--light-rgb),0.5); padding:30px 0; border-top:1px solid rgb(var(--light-rgb),0.2)}