@charset "utf-8";

/*header*/
.topbar-wrapper{width:100%;display: block;background-color: #2a2b2b;z-index: -9;height:40px;line-height:40px;-moz-transition:.3s;-o-transition:.3s;-webkit-transition:.3s;transition:.3s;}
.topinfo {font-size: 14px !important;float:left;}
.topinfo p span{font-weight:600;font-size:14px;}
.topinfo p, .topinfo p a {color: #fff;font-size:12px;letter-spacing: 1px;}
.topinfo p a:hover {color: #cbd3da;}
.topnav{float:right;color:#fff;}
.topnav a{color:#fff;font-size:12px;line-height: 1;margin: 0 5px;}
.topnav .login{
	display:inline-block;
}

.hua-header {position:relative;top: 0;width: 100%;    text-align: center;z-index: 998;-moz-transition: .3s;-o-transition: .3s;-webkit-transition: .3s;transition: .3s;}
.hua-header.slideUp {position: fixed;top: 0px;}
.hua-navbar{position: relative;
	background: #fff;}
.hua-navbar h1{float: left;margin-top: 22px;}
.hua-navbar h1 a{display: block;}
.hua-navbar .nav-list{margin-left: 7.1rem;display: block;list-style: none;float: left;}
.hua-navbar .nav-list li{list-style: none;position: relative;display: inline-block;}
.nav-list li.current a{color:#0060ed;}
.nav-list li em{position: absolute;height:86px;line-height: 86px;right: 0px;top:0;cursor: pointer;}
.nav-list li em i{font-size:22px;}
.nav-list > li > a{height: 86px;line-height: 86px;display: inline-block;padding:0 20px;font-size: 16px;color:#000;}
.hua-navbar .nav-list li small {position:absolute;display:block;right:0px;top:16px;font-size:.625rem;font-weight:400;line-height:1;color:#ffffff;background:#f53939;background-image:linear-gradient(310deg,#f53939,#fbcf33);border-radius:4px 4px 4px 0;padding:0.2rem 0.3375rem;}
.hua-navbar .nav-list li small.blue {background: linear-gradient(to right,#0056f3 0%,#2b76ff 100%);}
.nav-list .sub-nav{display: none;position:absolute;top:100%;left:0;background-color:#fff;padding:9px 0;text-align: center;box-shadow:0 0 10px rgba(0,0,0,0.1);line-height:32px;min-width: 100px;width: 100%;}
.nav-list .sub-nav a {display: inline-block;width: 100%;color: #52617f;font-size:12px;background-color: #fff;}
.nav-list .sub-nav li{display: inline-block;width: 100%;}
.nav-list li:hover .sub-nav{display: block;}
.nav-list li:hover a,.nav-list li:hover i.down {color:#0060ed}
.nav-list li:hover .sub-nav a {color:#52617f}
.nav-list li .sub-nav a:hover  {color:#0060ed}
.nav-list li .down:before {display:inline-block;-webkit-transition:all .15s ease;-moz-transition:all .15s ease;-ms-transition:all .15s ease;-o-transition:all .15s ease;transition:all .15s ease;}
.nav-list li:hover .down:before {transform:rotate(180deg);-webkit-transform:rotate(180deg);}
.nav-right{float:right;font-size:15px;margin-top:0px;}
.nav-right li{position:relative;float:left;margin:20px 5px;}
.nav-right a{display:inline-block;padding:0 15px;-webkit-transition:ease-in color .15s;transition:ease-in color .15s;position:relative}
.nav-right .nav-search{}
.nav-right .nav-search .iconfont{font-size:24px;}
.nav-right .nav-search a{padding:4px 0;z-index:99;}
.search-box{position:fixed;left:0;right:0;top:-0;z-index:9998;padding:36.5px 0;background:#fff;transition:top 0.3s cubic-bezier(.4,0,.2,1);display: none;}
.search-box.show{top:0;display: block;}
.search-box .container{max-width:800px;position: relative;}
.search-close{position:absolute;right:-70px;top:10px;color:#000}
.search-close .iconfont{font-size:24px;padding: 15px;}
.search-input{text-align: center;float:left;font-size: 20px;font-weight: 700;border:none;width:100%;height:50px;padding:4px 12px;border-right:none;font-size:16px;border-radius:2px 0 0 2px;outline:none}
.search-box-form a{margin-left:20px;color:#999}
.search-box-form a:hover{color:#0060ed}
.nav-right .nav-button{display:none}
.u-fang a{position: relative;background-color: #0060ed;background-image:linear-gradient(310deg,#0060ed,#2152ff);padding: .5rem 1.5rem;font-size: 14px;font-weight: 600;color: #fff;border-radius: 1rem;}
.u-fang a:hover{color:#fff;}
.u-fang a i{color:#fff;margin-right:5px;font-size:21px;vertical-align: bottom;}
.menu-btn {display:none;padding:6px 0;float:right;margin-left:15px;}
.menu-btn:before,.menu-btn:after,.menu-btn span {display:block;height:2px;background-color:#000;content:'';}
.menu-btn:before {width:24px;}
.menu-btn:after {width:18px;margin-left:6px;}
.menu-btn span {width:12px;margin:6px 0 6px 12px;}
/*idnex*/
.section-header {height: 100%!important;width:100%;clear:both;overflow: hidden;position:relative;background:#ebeff0;background-image: url(../images/header-bg.jpg);background-size: cover;background-position: 50%;}
.section-header .page-home-header {width:100%;height:100%;position:relative;    z-index: 9;}
.section-header:before {
  content: '';
  height: 100%;
  width: 100%;
  opacity: .4;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  transition: opacity 1s cubic-bezier(0.77,0,0.175,1);
  background-image: linear-gradient(310deg,#141727,#3a416f);
}
.vertical-middle,.swiper-caption {position:relative;}
.page-banner {text-align: center;width: 100%;max-width:100%;padding:6rem 0 10rem 1rem;}
.page-banner .banner-title {font-size: 34px;letter-spacing:1px;color:#ffffff;margin-bottom:1.1rem;}
.page-banner .banner-title span{color:#191a1c;}
.page-banner .banner-description {margin:10px auto;font-size:16px;color:#ffffff;letter-spacing:1px;}
.page-banner .banner-button {margin-top:30px;text-shadow:none;transition: all 3s ease-out 3s;}
.banner-img {
    width: 100%;
    position: relative;
}
.banner-img img {
    border-radius: 10px;
    width: 100%;
}
.page-banner .banner-button a {
  margin-right: 10px;
}
.btn-info-white {
  transition: all .5s;
  background: #ffffff;
  color: #0060ed;
  border-right-width: 0;
  border-left-width: 0;
  margin-left: 2%;
}
.hero-particle-effect .particle-1 {
  top: 30%;
  left: 15%;
}
.hero-particle-effect img {
  position: absolute;
}
.hero-particle-effect {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: block!important;
}
.animate-zoom-fade {
  -webkit-animation-name: zoom-fade;
  animation-name: zoom-fade;
  -webkit-animation-duration: 5s;
  animation-duration: 5s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}
.hero-particle-effect .particle-2 {
  top: 45%;
  left: 19%;
}
.hero-particle-effect .particle-3 {
  right: 26%;
  top: 20%;
}
.hero-particle-effect .particle-4 {
  left: 25%;
  bottom: 15%;
}
.hero-particle-effect .particle-5 {
  right: 15%;
  bottom: 36%;
}


.position-relative {position:relative !important;}
.shape:not([class*=shape-blur]) {overflow:hidden;}
.shape-bottom {bottom:0;left:0;right:0;}
.shape {pointer-events:none;position:absolute;}
.text-white {color:#fff !important;}
.shape:not([class*=shape-blur])>* {transform:scale(2);}
.shape-fluid-x>* {height:auto;width:100%;}
.shape-bottom>* {transform-origin:top center;}
.shape>* {display:block;}
@keyframes upndown {0% {transform:translateY(5px);}
50% {transform:translateY(15px);}
100% {transform:translateY(5px);}
}
@keyframes smallnbig {0% {width:90px;}
50% {width:100px;}
100% {width:90px;}
}
@keyframes shine {0% {opacity:.2;}
25% {opacity:.1;}
50% {opacity:.2;}
100% {opacity:.2;}
}
.animate-float-bob-y {-webkit-animation-name:float-bob-y;animation-name:float-bob-y;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear;}
.animate-zoom-fade {-webkit-animation-name:zoom-fade;animation-name:zoom-fade;-webkit-animation-duration:5s;animation-duration:5s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear;}
.animate-zoominout {-webkit-animation-name:zoomInOut;animation-name:zoomInOut;-webkit-animation-duration:3s;animation-duration:3s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;}
@keyframes float-bob-y {
0% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
}
@keyframes zoom-fade {
0% {
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
50% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
100% {
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
}
@keyframes zoomInOut {
0% {
-webkit-transform: rotate(0deg) scale(0.7);
transform: rotate(0deg) scale(0.7);
opacity: 0;
}
50% {
-webkit-transform: rotate(180deg) scale(1);
transform: rotate(180deg) scale(1);
opacity: 1;
}
100% {
-webkit-transform: rotate(360deg) scale(0.7);
transform: rotate(360deg) scale(0.7);
opacity: 0;
}
}
.at_list_con{position: relative;bottom: 38px;}
.at_list_con ul {width:100%;margin:0 auto;position:relative;display:table;}
.at_list li {flex:0 0 23.333%;width:23.55555%;float:left;display:flex!important;display:block;background-image:linear-gradient(0deg,#fff,#f3f5f8);border:2px solid #fff;box-shadow:8px 8px 20px 0 rgba(55,99,170,.1),5px 5px 20px 0 #fff;border-radius:4px;padding:20px 20px;margin:0 8px;}
.at_list .at-icon {font-size:.95rem;border-radius:50%;display:inline-table;text-align:center;}
.at_list .at-icon i {font-size:40px;color:#076bf6;}
.at_list .at-text {overflow:hidden;margin-left:1rem;}
.at_list .at-text h4 {font-size:.875rem;font-weight:600;margin-bottom:0;color:#000;}
.at_list .at-text p {font-size:.775rem;color:#6c757d;margin-bottom:0;}
.preview {display: block;clear: both;position: relative;}
.preview .tit-p{padding-top: 0rem;}
.tit-p{text-align: center;padding: 2rem 0;}
.tit-p h2{font-size:2.1rem;color:#000; font-weight: 500;margin-bottom:.5rem;}
.tit-p .title{font-size:2.1rem;color:#000; font-weight: 500;margin-bottom:.5rem;}
.tit-p p{font-size:1rem;color:#67748e;}
.le-e-hot {padding-top:0px;background: #ffffff;}
.le-e-hot .tit-p {padding:2rem 0;}
.ecms-hot {position:relative;padding:10px 0;max-width: 1200px;margin: 0 auto;}
.ecms-hot-list {overflow:hidden;}
.swiper-wrapper {position:relative;width:100%;height:100%;z-index:1;display:flex;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;}
.swiper-slide {-webkit-flex-shrink:0;-ms-flex:0 0 auto;flex-shrink:0;width:100%;height:100%;position:relative;}
.index-btn {display:block;width:36px;height:36px;position:absolute;z-index:3;top:40%;background-color:#fff;box-shadow:2px 2px 4px 0 rgba(0,0,0,.16);border:2px solid #fff;border-radius:50%;background-image:linear-gradient(135deg,#dbe2e9,#fff);}
.index-btn:hover {background-image:linear-gradient(135deg,#d0d2d3,#fff);}
.index-btn>i {font-size:14px;color:#c6cad1;display:inline-block;padding:10px 10px;font-weight:600;}
.index-btn.index-prev {left:-50px;}
.index-btn.index-next {right:-50px;}
.index-hotlist {position: relative;}
.index-hotlist li {width:24%;position:relative;display:inline-block;margin-right:1.2rem;margin-bottom:1.2rem;overflow:hidden;}
.index-hotlist .hot-box:nth-child(3n) {margin-right:0px;}
.index-hotlist .hot-box {border-radius:4px!important;transition:all .2s;background-color: #f4f4ff;border: 2px solid #fff;box-shadow: 4px 4px 10px 0 rgba(55,99,170,.1), -4px -4px 10px 0 #fff;}
.index-hotlist li:hover {-webkit-box-shadow:0 5px 10px 0 rgb(6 14 44/10%);box-shadow:0 5px 10px 0 rgb(6 14 44/10%);}
.index-hotlist .hot-box .hot-footer {background: #f4f4ff;border-radius: 5px;    max-height: 312px;overflow: hidden;}
.index-hotlist .hot-box img {width:100%;height:100%;display:block;}
.hot-box .entry-meta {align-items:center;color:#1f0757;display:flex;flex-wrap:wrap;letter-spacing:.2px;margin-top: 10px;text-align:center;font-size:.875rem;font-weight: 700;}
.hot-box .entry-meta .meta-category {display:flex;flex-wrap:wrap;font-weight: 700;}
.index-hotlist .hot-box .hot-header {text-align:center;padding:0px 20px;background-image: linear-gradient(0deg,#fff,#f4f4ff);}
.index-hotlist .hot-box .hot-header {text-align:center;height: 46px;}
.index-hotlist .hot-box .hot-header a  {color:#293957;margin-top:.2rem!important;font-size:.8rem;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;line-height:20px;text-align:left;}
.index-hotlist .hot-box:hover .pricer>span{opacity:1;-webkit-transition-delay:.4s;transition-delay:.4s}
.pro-ztlist {position: relative;}
.pro-ztlist li {width:32%;position:relative;display:inline-block;margin-right:1.2rem;margin-bottom:1.2rem;overflow:hidden;}
.pro-ztlist .le-box {border-radius:4px!important;border-radius:10px !important;transition:all .2s;background-image: linear-gradient(0deg, #ffffff 0%, #f3f5f8 100%);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1), -8px -8px 20px 0 #fff;}
.pro-ztlist .le-box:nth-child(3n) {margin-right:0px;}
.pro-ztlist li:hover {-webkit-box-shadow:0 10px 40px 0 rgb(6 14 44/10%);box-shadow:0 10px 40px 0 rgb(6 14 44/10%);-webkit-transform:translateY(-5px);-ms-transform:translateY(-5px);transform:translateY(-5px)}
.pro-ztlist .le-box .pro-footer {background: #f4f4ff;border-radius: 5px;    max-height: 285px;overflow: hidden;}
.pro-ztlist .le-box img {width:100%;height:100%;display:block;}
.pro-ztlist .le-box .pro-footer .overview-dots i{width: 8px;height: 8px;}
.pro-ztlist .le-box .tipss {position:absolute;background:linear-gradient(to right,#fd7a64 10%,#fb2d2d 100%);top:0;left:0px;z-index:10;text-align:center;font-size:12px;color:rgb(255,255,255);padding:6px 14px 6px;border-radius:0;}
.pro-ztlist .le-box .pro-header {text-align:center;padding:18px 20px 15px;background-image: linear-gradient(0deg,#fff,#f4f4ff);}
.le-box .entry-meta {align-items:center;color:#111010;display:flex;flex-wrap:wrap;letter-spacing:.2px;text-align:center;font-size:.875rem;font-weight: 700;background-image: linear-gradient(to right,#f8ab5e 0,#f36961 20%,#a176c8 40%,#759beb 60%,#65beb3 80%,#70db96 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.pro-ztlist .le-box .pro-header  a  {text-align:center;height: 46px;margin-top:.7rem!important;font-size:.8rem;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:20px;text-align:left;}
.entry-boot {margin-top:1rem;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;color:#bdbdbd;letter-spacing:-0.2px;width:100%;}
.entry-boot>span {margin-right:10px;}
.entry-boot>span i {margin-right:3px;}
.entry-boot .meta-shhop-icon {flex:1;text-align:right;margin-right:0;color:#ff4a00;}
.pro-ztlist .le-box .pricer{position:absolute;bottom:72px;right:10px;color:#fff;font-weight:500;text-transform:uppercase;padding:2px 10px;border-radius:50px;font-size:.5rem;z-index:3;overflow:hidden;transform:scale(0);-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}
.pro-ztlist .le-box:hover .pricer{transform:scale(1,1)}
.pricer:before{content:"";display:block;position:absolute;top:0;left:0;right:0;bottom:0;background-color:#0078fe;border-radius:50px;transform:translateX(-72%);-webkit-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
.pro-ztlist .le-box:hover .pricer:before{transform:translateX(0);-webkit-transition-delay:.2s;transition-delay:.2s}
.pricer>span{opacity:0;z-index:4;color:#fff;position:relative;-webkit-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
.pro-ztlist .le-box:hover .pricer>span{opacity:1;-webkit-transition-delay:.4s;transition-delay:.4s}
.preview .btn-more{margin-bottom:2rem;text-align:center}
.course{background-color:#fff;position:relative;}
.course .course-con{position:relative;z-index:2;}
.course-list{position: relative;display: inline-block;margin-right:31px;border-radius:4px!important;padding:2.5rem!important;max-width:31.3%;width: 100%;background-image: linear-gradient(0deg, #ffffff 0%, #f3f5f8 100%);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1), -8px -8px 20px 0 #fff;}
.course-list:nth-child(3n){margin-right:0}
.course-list .w-newsitem{width:100%;position:relative}
.course-list .w-newsitem h3{display: flex !important;position:relative;margin-bottom:30px!important;font-size:1.25rem;color: #3e506f;line-height: 1.3;}
.course-list .w-newsitem h3 a{font-size:.8rem;margin-left: auto !important;}
.course-list .w-newsitem h3::after{position:absolute;display:block;content:'';width:32px;bottom:-20px;left:0;border-top:solid 2px #3e506f;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s;transition:.5s}
.course-list:hover .w-newsitem h3::after{left:0!important;margin-left:0!important;width:100%!important;border-top:solid 2px #3e506f;}
.course-list ul{position:relative}
.course-list ul li{padding:12px 0;border-top:1px solid #f7f7f7}
.course-list ul li:first-child{border:none}
.course-list ul li a{height:22px;line-height:22px;font-size:14px;overflow:hidden;font-weight:400;display:block;text-overflow:ellipsis;white-space:nowrap}
.fuwu-box {color:#fff;overflow:hidden;position:relative;width:100%;clear:both;}
.fuwu-list {position: relative;}
.fuwu-list ul {}
.fuwu-list ul li {width: 22.777%;text-align:center;margin-right:35px;margin-bottom:50px;float:left;border-radius:5px;cursor:default;transition: all .5s;background-image: linear-gradient(0deg, #ffffff 0%, #f3f5f8 100%);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1), -8px -8px 20px 0 #fff;}
.fuwu-list ul li:hover {-webkit-box-shadow:0 10px 40px 0 rgb(6 14 44/10%);box-shadow:0 10px 40px 0 rgb(6 14 44/10%);-webkit-transform:translateY(-5px);-ms-transform:translateY(-5px);transform:translateY(-5px)}
.fuwu-list ul li div{padding:50px 58px;vertical-align:top;position: relative;width:100%;display: block;}
.fuwu-list ul li div img{width:100px;}
.fuwu-list ul li:nth-child(4n) {margin-right:0;}
.fuwu-list ul li span {width: 100%;font-size:22px;margin:5px 0px;color:#343a40;display: inline-block;}
.fuwu-list ul li p {overflow:hidden;font-size:14px;font-family: 'oswaldregular', sans-serif;}
.fuwu-boxsm {padding:30px 0;color:#fff;overflow:hidden;position:relative;width:100%;clear:both;background:#ffffff }
/*模板列表内容页*/
.section-bg {
    width: 100%;
    overflow: hidden;
    padding: 3rem 0 1rem;
}
.term-bar {width: 100%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color: #3a416f;background-image: linear-gradient(to right, #4403ff 0%, #0060ed 100%);background-position:center;background-size:cover;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:5rem 0;position:relative;text-align:center;overflow:hidden;}
.term-bar .term-bg {background-attachment: fixed;position:absolute;left:0;top:0;right:0;height:100%;width:100%;background-repeat:no-repeat;overflow:hidden;}
.term-bar .term-bg:before {content:"";display:block;width:100%;height:100%;position:absolute;left:0;top:0;}
.term-bar.lazyloaded:before {opacity:.5;}
.term-bar .term-title {font-family: 'oswaldregular', sans-serif;color:#000;font-weight:600;font-size: 2.2rem;line-height: normal;margin-bottom:1rem;position:relative;display:flex;justify-content:center;align-items:center;}
.term-bar .term-description {position:relative;color:#141727;font-size:1rem;margin:0;}
.badge {display:inline-block;padding:0.58em 1.2em;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;border-radius:10rem;color:#536de6;background-color:rgba(83,109,230,.18);margin-right:8px;margin-bottom:8px;}
.mbys {color:#fff;position:relative;font-size:14px;padding-top:1.1rem!important;}
.badge-secondary {color:#fff;background-color:#6c757d;}
.badge-success {color:#fff;background-color:#28a745;}
.badge-danger {color:#fff;background-color:#dc3545;}
.badge-warning {color:#212529;background-color:#ffc107;}
.badge-info {color:#fff;background-color:#17a2b8;}
.mobanclass {padding-bottom: 2rem;display: block;clear: both;position: relative;}
.mobanclass .le-crumb{padding: 2rem 0px 0rem 0;display: block;clear: both;position: relative;    padding-left: 12px;}
.archive-filter {display: block;position:relative;font-size:15px;color:#8f8f8f;background:#fff;margin-bottom:30px;padding:10px 0;}
.archive-filter .badge {font-weight:500;font-size:65%;}
.archive-filter .container {overflow:visible}
.archive-filter .filter {display:block;overflow:hidden;border-bottom:1px dashed #e8e8e8;position:relative;margin:0;padding:0;list-style:none;}
.archive-filter .filter::-webkit-scrollbar {width:10px;height:5px;}
.archive-filter .filter::-webkit-scrollbar-thumb {border-radius:10px;background:rgb(222 222 222);}
.archive-filter .filter::-webkit-scrollbar-track {background:#f0f4f5;}
.archive-filter a {color:#6d6d6d;display:inline-block;padding:0;border-radius:4px;position: relative;}
.archive-filter .hot .point-flicker {position:absolute;top:-4px;margin-left:-2px;opacity:1;}
.point {width:6px;height:6px;background-color:#ff0909;position:relative;border-radius:50%;}
.point-flicker:before,.point-flicker:after {content:'';width:10px;height:10px;position:absolute;left:50%;top:50%;margin-left:-5px;margin-top:-5px;border-radius:50%;animation:warn 1.5s ease-out 0s infinite;}
.point-flicker:before {background-color:#ea8787;}
.point-flicker:after {background-color:#ff0909;}

@keyframes fade {
from {
opacity:1
}
50% {
opacity:.5
}
to {
	opacity:1
}
}
@keyframes warn {
    0% {
      transform: scale(0.5);
      opacity: 1;
    }
 
    30% {
      opacity: 1;
    }
 
    100% {
      transform: scale(1.4);
      opacity: 0;
    }
  }
.archive-filter a:hover {color:#000;}
.archive-filter .current a {color:#FF9800;}
.archive-filter .filter li {position: relative;display:inline-block;list-style:none;font-size:14px;line-height:14px;border-right:1px solid #f0f4f5;padding:0 12px;margin:13px 0;}
.archive-filter .filter li:first-child {margin-left:0;}
.archive-filter .filter li:last-child {border-right:none;}
.archive-filter .filter:last-child {border-bottom:none}
.archive-filter .filter:last-child {border-bottom:none}

.archive-filter .filters .recent {display:-ms-flexbox;display:-webkit-box;display:flex;-ms-flex-pack:end;-webkit-box-pack:end;justify-content:flex-end;}
.archive-filter .filters .recent a {background:unset;}
.archive-filter .filters .recent .filter li:last-child a {margin-right:0;}
.explains{padding:0 8px;}
.explain {margin: 20px 0 40px;position:relative;box-sizing:border-box;border-radius:4px;padding:35px 20px;transition:all .4s ease-in-out;background-image: linear-gradient(0deg, #ffffff 0%, #f3f5f8 100%);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1), -8px -8px 20px 0 #fff;color:#717278;}
.alert-success {background: #fbedf2;color: #f53939;padding: 10px 15px;margin-bottom: 20px;}
.explain p{color:#383e6b;}
.explain p strong{color:#f40;}
/*single*/
.huatheme-content {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 2rem 0 3rem 0;
    background-color: #f4f4ff;
    background-image: -webkit-linear-gradient(left,#ffffff,#e3edff 25%,#f3e9fe 50%,#e3edff 75%,#ffffff);
}
.huatheme_info {padding: 30px 0;}
.huatheme_left {width:43.333%;float:left;}
.huatheme_right {width:53.333%;float:right;}
.theme-item-image {position: relative;}
.theme-item-image img {
    background-image: linear-gradient(0deg,#ffffff 0%,#f3f5f8 100%);
    border: 2px solid #fff;
    box-shadow: 8px 8px 20px 0 rgb(55 99 170 / 10%);
    border-radius: 6px;
}

.theme-overview {border:1px solid #e5e5ef;border-radius: 10px; position:relative;overflow:hidden;max-width:90%;padding-top:30px;-webkit-transition:all .25s cubic-bezier(.37,.31,.2,.85);-o-transition:all .25s cubic-bezier(.37,.31,.2,.85);transition:all .25s cubic-bezier(.37,.31,.2,.85)}
.theme-overview:after {content:'';display:block;padding-top:66.66666%}
.theme-overview img {border-radius:inherit}
.overview-hover {-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-box-shadow:0 10px 30px 0 rgb(6 14 44/5%);box-shadow:0 10px 30px 0 rgb(6 14 44/5%)}
.overview-hover:hover {-webkit-box-shadow:0 10px 40px 0 rgb(6 14 44/10%);box-shadow:0 10px 40px 0 rgb(6 14 44/10%);-webkit-transform:translateY(-15px);-ms-transform:translateY(-15px);transform:translateY(-15px)}
.theme-overview:before {content:"";top:0;left:0;width:100%;height:30px;position:absolute;background:var(--bg-light);background:-o-linear-gradient(top,var(--bg-light),#fff);background:-webkit-gradient(linear,left top,left bottom,from(var(--bg-light)),to(#fff));background:linear-gradient(180deg,var(--bg-light),#fff);border-top-left-radius:inherit;border-top-right-radius:inherit;background-color: #141727;
    background-image: linear-gradient(310deg,#141727,#3a416f);}
.theme-overview .overview-poster {overflow: hidden;position:absolute;left:0;width:100%;height:100%;background-repeat:no-repeat;background-size:100%;background-position:top}
.outDiv{border:1px solid #ddd;width:500px;height:500px;padding:20px;margin:20px auto;background:#7ce;}
.innerDiv{width:500px;height:500px;position:relative;background:#fff;overflow:hidden;}	
.overview-dots {position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;top:-10px;left:15px;margin:-10px 0 0}
.overview-dots i.dot1,.overview-dots i.dot2,.overview-dots i.dot3 {width:10px;height:10px;border-radius:10px}
.overview-dots i.dot1 {background-color:#ff5f52}
.overview-dots i.dot2 {background-color:#ffbe05;margin:0 .5rem}
.overview-dots i.dot3 {background-color:#15cc35}
.overview-full {max-width:100%}
.overview-app {border-radius: 30px;position:absolute;width:180px;bottom:-30px;right:0;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition:all .25s cubic-bezier(.37,.31,.2,.85);-o-transition:all .25s cubic-bezier(.37,.31,.2,.85);transition:all .25s cubic-bezier(.37,.31,.2,.85)}
.overview-app:hover {-webkit-transform:translateY(-15px);-ms-transform:translateY(-15px);transform:translateY(-15px)}
.overview-app .app-frame {position:relative;z-index:-999;bottom: -5px;}
.overview-app .overview-poster {overflow: hidden;position:absolute;left: 5%;right: 5%;top: 3%;bottom: 2%;background-repeat:no-repeat;background-size:100%;background-position:top;border-radius: 20px;}
.theme-item-image .theme-overview {max-width:90%}
@media (max-width:767.98px) {
.theme-overview {max-width:95%;height:250px;padding-top:20px;}
.theme-overview.overview-full {max-width:100%}
.theme-overview:before {content:"";top:0;left:0;width:100%;height:20px;position:absolute;border-top-left-radius:var(--radius-sm);border-top-right-radius:var(--radius-sm)}
.theme-overview .overview-poster {top:20px}
.overview-dots {top:-7px;left:11px;margin:-7px 0 0}

.pro-footer .overview-dots{top:-4px;left:11px;margin:-7px 0 0}
.overview-dots i.dot1,.overview-dots i.dot2,.overview-dots i.dot3 {width:8px;height:8px;border-radius:10px}
.overview-app {width:90px;bottom:-15px}
.overview-app .overview-poster {left:4px;right:4px;top:9px;bottom:3px;border-radius: 9px;}
}
@media (min-width:768px) and (max-width:991.98px) {
.theme-overview {max-width:95%;padding-top:20px;}
.theme-overview.overview-full {max-width:100%}
.theme-overview:before {content:"";top:0;left:0;width:100%;height:20px;position:absolute;background:#fff;border-top-left-radius:var(--radius-sm);border-top-right-radius:var(--radius-sm)}
.overview-dots {top:11px;left:11px;margin:-4px 0 0}
.overview-dots i.dot1,.overview-dots i.dot2,.overview-dots i.dot3 {width:8px;height:8px;border-radius:10px}
.overview-app {width:130px;bottom:-15px}
.overview-app .overview-poster {left:6px;right:6px;top:5px;bottom:5px;}
}
.theme_title {margin: 15px 0;}
.theme_title h1 {font-size:18px;color:#000;font-weight:600;}
.theme_title em {color: #fcfbf7;background: #151414 none repeat scroll 0 0;padding: 0 5px 0 5px;margin-left: 10px;font-weight: normal;font-size: 12px;border-radius: 30px;}
.theme_title p {font-size: 15px;letter-spacing: .1em;color: #858585;margin-top:.5rem;}
.meta{margin: 1.5rem 0;}
.theme-price {width:100%;position:relative;font-size: 14px;}
.theme-price .text-vip {color:#fb2d2d  !important;font-size:1.8em;font-weight:700;}
.theme-price .text-vip small{font-weight: 400;}
.theme-price .text-vip .font-theme {margin-left:5px;font-family:'oswaldregular',sans-serif;}
.metatit{margin-left: 10px;display: inline-block;text-align: left;line-height: 1;}
.original-price {opacity:.7;position:relative;padding:0 3px 0 2px;font-size:14px;color:#555;}
.original-price::before {content:'';position:absolute;width:100%;height:1px;background:#ff343b;top:.6em;left:0;transform:rotate(5deg);}
.theme-price .huodong {background: linear-gradient(135deg, #fd7a64 10%, #fb2d2d 100%);display: inline-block;padding: .5em .5em;line-height: 1.44;border-radius: 4px;color: #ffffff;text-align: center;font-size: 14px;margin-left:1rem;position: relative;bottom: 9px;}
.theme-server{display: inline-block;margin: 30px 0;position: relative;width: 100%;}
.theme-server li {width:50%;text-align:left;color:#303138;float:left;margin-bottom:10px;cursor: default;}
.btn-theme{padding:0;}
.btn-theme a{margin-right: 15px; margin-bottom: 10px;}
.grid-bg {width: 100%;overflow: hidden;background-color: #fff;}
.mod-inner {margin:0 auto;max-width:1200px;position: relative;}
.mod-inner .newstext {position:relative;padding:30px 40px;background:#f4f4ff;border-radius:3px;margin:20px 0;}
.mod-inner .newstext:before {position:absolute;top:20px;left:20px;display:block;width:16px;height:14px;background:url(../images/syin.png) no-repeat;content:'';}
.mod-inner .newstext:after {position:absolute;right:20px;bottom:20px;display:block;width:16px;height:14px;background:url(../images/syin.png) -16px 0 no-repeat;content:'';}
.mod-inner .newstext p {margin:0;padding:10px;line-height:1.8;word-wrap:break-word;font-size:16px;color:#52617f;}
.inner-tit{text-align: center !important;margin: 3rem !important;}
.inner-tit span{position: relative;font-size: 1.5rem;    text-align: center !important;color:#3e506f;font-weight:600;}
.inner-tit span::before,.inner-tit span::after {position:absolute;top:50%;width:30px;height:2px;border-top:2px solid;content:'';border-color:#0a5bf2;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;}
.inner-tit span::before {left:-45px;}
.inner-tit span::after {right:-45px;}
.theme-item-intro:hover .inner-tit span::before,.theme-itembox:hover .inner-tit span::before,.function-list:hover .inner-tit span::before{left:-55px}
.theme-item-intro:hover .inner-tit span::after,.theme-itembox:hover .inner-tit span::after,.function-list:hover .inner-tit span::after{right:-55px}
.theme-item-intro{padding: 0 8px;position: relative;margin: 20px 0;}
.theme-item-intro ul{position: relative;display: inline-block;width:100%;}
.theme-item-intro ul li {position:relative;min-width:16.555%;background-color:#fff;padding:1.2rem;float:left;background-image:linear-gradient(0deg,#ffffff 0%,#f3f5f8 100%);border:2px solid #fff;box-shadow:8px 8px 20px 0 rgba(55,99,170,.1),-8px -8px 20px 0 #fff;}
.theme-item-intro ul li span {color:#999;margin-bottom:10px!important;font-size:.8rem !important;}
.theme-item-intro ul li p {font-size:1.2rem !important;}
.theme-itembox {padding: 0 8px;background-color:#fff;border-radius:8px;margin-bottom:20px;line-height:1.5;}
.yuanma-con {padding:2rem 4rem;cursor:default;overflow:hidden;background-image: linear-gradient(0deg,#ffffff 0%,#f3f5f8 100%);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1), -8px -8px 20px 0 #fff;}
.yuanma-con h3 {padding-bottom:12px;font-size: 1.5rem;border-bottom:4px solid #f4f4ff;margin:0px 0 20px;line-height:1.4;font-weight:500;color:#52617f;}
.yuanma-con p {color:#52617f;font-size:15px;line-height:24px;margin:0 0 10px;}
.yuanma-con ol,.yuanma-con ul {color:#52617f;list-style-position:outside;}
.yuanma-con ul li {line-height: 36px;}
.yuanma-con ul li:before {content: "";display: inline-block;margin-right: 15px;width: 8px;height: 8px;background-color: #dddddd;border-radius: 50%;}
.yuanma-con code {padding:3px 5px;font-size:14px;color:#c7254e;background-color:#f9f2f4;border-radius:4px;font-family:"Microsoft Yahei","Microsoft Yahei-Regular","SF Pro SC","SF Pro Text","SF Pro Icons",PingFangSC-Regular,Microsoft Sans Serif,sans-serif;}
mark {background-color: transparent;color: inherit;font-weight: bold;border-bottom: 2px solid #e6e6e6;}
.function-list {margin:0;padding: 0 8px;}
.section-box-content {padding:40px 50px;overflow:hidden;color:#506173;}
.single-item-faq{display:inline-block;width:100%;margin-right:20px;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;}
.single-item-faq:nth-child(2n) {float:right;margin-right:0px;}
.single-item-faq .faq-toggle{background-color:#ffffff;margin-bottom:16px;padding:0 20px;border-radius: 6px;}
.single-item-faq .toggle-title{font-weight:400;line-height:1.4;padding:15px 0px;cursor: pointer;transition: all .3s ease;}
.single-item-faq .toggle-title a{color:#52617f;font-size:15px;}
.single-item-faq .toggle-title i{float:right;font-size: 18px;}
.single-item-faq .faq-toggle p a{color:#fff;border-bottom:1px solid #fff;margin:0 5px;padding:0 5px}
.single-item-faq .faq-toggle h3+p{border-top:1px solid #7f9bcb;padding:15px 0}
.faq-toggle p {margin:0px 0 0;display:none;color:#52617f;font-size:14px;line-height:1.5;padding-bottom: 20px;}
.action{text-align: center!important;margin:40px 0 0 0;}
.cd-popup {position:fixed;left:0;top:0;height:100%;width:100%;background-color:rgba(94,110,141,0.9);opacity:0;visibility:hidden;-webkit-transition:opacity 0.3s 0s,visibility 0s 0.3s;-moz-transition:opacity 0.3s 0s,visibility 0s 0.3s;transition:opacity 0.3s 0s,visibility 0s 0.3s;z-index:999;}
.cd-popup.is-visible {opacity:1;visibility:visible;-webkit-transition:opacity 0.3s 0s,visibility 0s 0s;-moz-transition:opacity 0.3s 0s,visibility 0s 0s;transition:opacity 0.3s 0s,visibility 0s 0s;}
.cd-popup-container {position:relative;width:90%;max-width:500px;margin:15em auto;padding:40px 20px 25px;background:#FFF;border-radius:.25em .25em .4em .4em;text-align:center;box-shadow:0 0 20px rgba(0,0,0,0.2);-webkit-transform:translateY(-40px);-moz-transform:translateY(-40px);-ms-transform:translateY(-40px);-o-transform:translateY(-40px);transform:translateY(-40px);/* Force Hardware Acceleration in WebKit */  -webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:0.3s;-moz-transition-duration:0.3s;transition-duration:0.3s;}
.cd-popup-container p {padding-bottom:2em;font-size:18px;font-weight:bold;}
.cd-popup-container .cd-buttons:after {content:"";display:table;clear:both;}
.cd-popup-container .cd-buttons li {float:left;width:50%;}
.cd-popup-container .cd-buttons a {display:block;height:60px;line-height:60px;text-transform:uppercase;color:#FFF;-webkit-transition:background-color 0.2s;-moz-transition:background-color 0.2s;transition:background-color 0.2s;}
.cd-popup-container .cd-buttons li:first-child a {background:#fc7169;border-radius:0 0 0 .25em;}
.no-touch .cd-popup-container .cd-buttons li:first-child a:hover {background-color:#fc8982;}
.cd-popup-container .cd-buttons li:last-child a {background:#b6bece;border-radius:0 0 .25em 0;}
.no-touch .cd-popup-container .cd-buttons li:last-child a:hover {background-color:#c5ccd8;}
.cd-popup-container .cd-popup-close {position:absolute;top:8px;right:8px;width:30px;height:30px;}
.cd-popup-container .cd-popup-close::before,.cd-popup-container .cd-popup-close::after {content:'';position:absolute;top:12px;width:14px;height:3px;background-color:#8f9cb5;}
.cd-popup-container .cd-popup-close::before {-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);left:8px;}
.cd-popup-container .cd-popup-close::after {-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);right:8px;}
.is-visible .cd-popup-container {-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0);}
.rewards-popover-item {display:inline-block;width:200px;margin:0 10px;}
.rewards-popover-item h4 {margin:0 20px 18px;font-size:15px;}
.rewards-popover-item img {
    width: 100%;
    height: auto;
    background-color: #eee;
    border-radius: 2px;
    padding: 5px;
}
/*fuwu*/
.service-head{position: relative;background-color:#f5f7fa; width:100%;overflow:hidden;height: 339px;}
.service-head-bg{position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: url('../images/list-banner1.jpg') no-repeat center/cover;background-position: center;}
.service-head .service-banner{display:flex;justify-content:space-between;padding:115px 0 50px;position:relative}
.service-head .standard-left{width:100%;text-align:center;margin-bottom:0}
.service-head .standard-left h1{position:relative;margin-bottom:10px;font-size:2.2rem;font-weight:600;color:#000;text-transform:uppercase}
.service-head .standard-left h2{font-weight:500;font-size:1rem;margin-bottom:30px;color:#141727}
.service-page{    position: relative;background-color:#f5f7fa; width:100%;padding-top:3rem;padding-bottom:50px;overflow:hidden;border-top: 2px solid #fff;border-bottom: 2px solid #fff;-webkit-font-smoothing: antialiased;background-image: linear-gradient(0deg,#fff,#f3f5f8);}
.service-page .conversion-flex{display:flex;flex-wrap:wrap;justify-content:space-between}
.service-page .conversion-box{text-align:left;margin-bottom:0;position:relative}
.service-page .conversion-box{width:31%;background-color:#fff;padding:30px;margin-bottom:50px;border-radius:4px;background-image: linear-gradient(0deg,#fff,#f3f5f8);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1), -8px -8px 20px 0 #fff;}
.service-page .conversion-box h3{margin-bottom:20px;font-size:24px;font-weight:500;color:#000}
.service-page .conversion-box p{font-size:15px;margin-bottom:25px;color: #212733;}
.service-page .service-link{list-style-type:disc;padding-left:14px}
.service-page .service-link li{margin-bottom:10px;line-height:1.5;color:#383e6b;padding-bottom:10px}
.service-page .service-link li:last-child{border-bottom:none}
.service-page .service-link li a{display:inline-block;color:#686868;font-size:16px;transition:all .3s cubic-bezier(.4,0,.2,1);text-decoration:underline}
.service-page .price{font-family: 'oswaldregular', sans-serif;font-size: 1.5rem !important;color:#ff4a14;font-weight:600;}
.service-page .web-conversion-bg:hover::after{background:#ff4a14}
.service-page .conversion-box:hover:after{transform:scaleX(1) translateZ(0)}
.service-page .conversion-box:after{content:"";position:absolute;width:100%;height:3px;left:0;bottom:0;background:0 0;transform-origin:0 100%;transform:scaleX(0) translateZ(0);transition:transform 1s cubic-bezier(.23,1,.32,1);border-radius:0 0 4px 4px}
/*教程列表内容页*/
.webnews-main {
    margin: 0 auto;
    position: relative;
}
.newsconleft {float:left;position:relative;width:65.666%;}
.article-item {position:relative;background:#ffffff;}
.article-item ul{margin-top:.5rem;}
.article-item ul li{border-bottom: 1px solid #f4f4ff !important;padding: 1.5rem 0;}
.article-item ul li a{margin-bottom: 1rem!important;position: relative;display: block;line-height:22px;font-size: 20px;font-weight: 500;color: #3e506f;}
.article-item ul li .decs{margin-bottom: 1.2rem!important;}
.article-item ul li .decs p{font-size: 14px !important;color: #62656d;}
.article-item ul li .text-xs{color: #9d9fa9 !important;font-size:12px;}
.article-item ul li span{margin-right:8px;}
.article-item ul li span i{margin-right:2px;font-size:13px;}
.article-item ul li span a{color: #9d9fa9 !important;font-size:12px;display: inline;}
.newsconright {float:right;position:relative;width:29.3333%;}
.newsconright .course-list{max-width:100%;margin-right:0px;margin-bottom:30px;}
.right-list {position:relative;background-color:#fff;padding:2rem;border-radius:4px;clear:both;overflow:hidden;margin-bottom:30px;border: 1px solid #f4f4ff!important;border-width: 2px!important;}
.right-list .w-newsitem{width:100%;position:relative}
.right-list .w-newsitem h3{font-size:1.25rem;position:relative;margin-bottom:30px!important}
.right-list .w-newsitem h3 a{font-size:18px;color:#000}
.right-list .w-newsitem h3::after{position:absolute;display:block;content:'';width:32px;bottom:-20px;left:0;border-top:solid 2px #dde8f5;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s;transition:.5s}
.right-list:hover .w-newsitem h3::after{left:0!important;margin-left:0!important;width:100%!important}
.hot-item{position:relative}
.hot-item li{padding:12px 0;border-top:1px solid #f7f7f7}
.hot-item li:first-child{border:none}
.hot-item li a{height:22px;line-height:22px;font-size:14px;color:#333b55;overflow:hidden;font-weight:400;display:block;text-overflow:ellipsis;white-space:nowrap}
.hot-item li a:hover{color:#666}
.tagcloud{margin-top:1.5rem;display:inline-block;}
.tagcloud a {position:relative;font-size:inherit !important;letter-spacing:1px;line-height:1;text-transform:capitalize;display:inline-block;margin:0 .25rem .5rem 0;border:1px solid var(--border-light);padding:.5rem .5375rem;border-radius:5px;}
.tagcloud a:hover {opacity: .8;color:inherit}

.widget_search {position:relative;background-color:#fff;padding:1px;clear:both;overflow:hidden;margin-bottom:30px;}
.form-control {display:block;width:100%;font-weight:400;color:#495057;background-color:#fff;background-clip:padding-box;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;font-size:14px;line-height:1;margin:0;padding:20px 18px;height:calc(1.5em + .75rem + 2px);-ms-flex:0 0 100%;-webkit-box-flex:0;flex:0 0 100%;max-width:100%;border: 1px solid #f4f4ff!important;border-width: 2px!important;}
.home-search {height:45px;margin-bottom:16px;position:relative;width:500px;}
#book-search-input {transition:top .5s ease;margin-bottom:10px;margin-top:-1px;padding:0;display:flex;}
.search-input-block {border-radius:4px;line-height:45px;padding:0 0 0 16px;font-size:16px;width:100%;box-shadow:none;outline:0;border:2px solid #ffffff !important;background-image: linear-gradient(0deg,#fff,#f3f5f8);color:#2c3e50 !important;}
.search-input-icon {position:absolute;display:block;width:100px;height:40px;line-height:40px;text-align:center;opacity:1;right:5px;bottom:0;margin:auto;background-repeat:no-repeat;background-position:center;cursor:pointer;border:2px solid #ffffff;text-shadow:0 0.1em 0 rgb(49 43 43 / 50%);font-size:18px;background:#0055ff;border-radius:5px;color:#fff;box-shadow:0px 6px 12px 0px rgba(0,85,255,0.2);}
.search-input-icon:hover {border:none;}
.right-list-ad {position:relative;background-color:#fff;padding:0px;clear:both;overflow:hidden;margin-bottom:30px;}
.right-list-ad img{border-radius:4px;}
.feature-post {width:100%;padding:0;margin:0;list-style:none;position:relative;margin-bottom: 30px;}
.feature-post li {position:relative;margin-bottom:20px;border-radius:4px;overflow:hidden;background:#fff}
.feature-post li:last-child {margin-bottom:0}
.feature-post li:hover img {-webkit-transform:scale(1.05);transform:scale(1.05);transition:all .3s ease-out 0s}
.feature-post a {display:block;transition:all .3s ease-out 0s;}
.feature-post img {width:100%;height:auto;vertical-align:top;transition:all .3s ease-out 0s;}
.feature-post span {position:absolute;display:block;left:0;bottom:0;width:100%;height:34px;padding:0 10px;line-height:34px;color:#fff;font-size:12px;background:rgba(0,0,0,.3);box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;}
.article-content {background:#fff;margin-bottom:20px;display:block;}
.article-detail {position:relative;margin-bottom:20px;border-bottom:1px solid #f4f4ff;border-width:2px !important;}
.article-detail .detail-title {font-size:1.75rem;font-weight:500;-webkit-line-clamp:inherit;height:auto;line-height:normal;margin:0;margin:1rem 0;}
.article-detail .infos {color:#999;font-size:14px;margin-bottom:25px;}
.article-detail .infos span {color:#999;font-size:14px;margin-right:10px;}
.article-detail .infos span a{color:#333b55;font-size:14px;}
.article-detail .infos .iconfont {display:inline-block;padding-right:2px;font-size: 14px;}
.article-body {color:#2f3340;font-size:14px;margin-bottom:10px;line-height:1.8;overflow:hidden;white-space:normal;word-wrap:break-word;word-break:normal;}
.article-body .body-img{text-align: center;}
.article-body img{max-width:100%;height: auto !important;margin-bottom: 20px;border-radius: 5px;}
pre, blockquote {
    display: block;
    padding: 5px 1px;
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.42857143;
    color: #333;
    word-wrap: break-word;
    background-color: #ffffff;
    border: 1px solid #e1f0ff;
    border-radius: 4px;
}
.article-body pre,.article-body blockquote{margin:20px 0;font-size:12px;line-height:22px;background:#4a4a4a;padding:10px 20px;color:#f8f8d4;border:0;}
.article-body pre code,.article-body blockquote p{padding:0;font-family:"Microsoft YaHei";font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0;}
.article-body p {margin:5px 0;color:#2f3340;font-size:14px;}
.article-body h1,.article-body h2,.article-body h3 {color:#000;font-size:22px;margin-top: 20px;margin-bottom: 0px;}
.article-body h4 {color:#2b548b;font-size:15px;font-weight:600;}
.post-copyright {background-color:#eee;border-radius:2px;color:#aaa;font-size:12px;margin:18px 0;padding:15px 30px;text-align:center;}
.article-sm {color:#9d9fa9;background-color:#fafaff;position:relative;padding:.75rem 1.25rem;margin:1rem 0;border:1px solid #f4f4ff;border-radius:.25rem;font-size:14px;line-height:20px;}
.article-sm a{font-size:12px;}.article-sm strong{font-size:13px;}
.entry-navigation {border-radius: 4px!important;border: 1px solid #f5f5fd!important;border-width: 2px!important;display:block;margin-bottom:20px;position:relative;border-radius:5px;padding:20px;}
.article-nav {overflow:hidden;font-size:14px;color:#bbb;}
.article-nav span {float:left;position:relative;width:50%;border-right:1px solid #f4f4ff;}
.article-nav span:nth-child(2n) {border-right:0px solid #e9ebec;}
.article-nav span.article-nav-next {float:right;text-align:right;}
.article-nav a {color:#999;display:inline-block;font-size:12px;}
.aboutme {padding:3rem!important;border-radius:4px!important;border:1px solid #f5f5fd!important;border-width:2px!important;margin-bottom:40px;display:inline-block;width:100%;}
.aboutme h5 {margin-bottom:1rem!important;line-height:1.5;font-size:18px;color:#000;}
.aboutme ul{font-size: 14px;    margin-left: 1rem!important;}
.aboutme ul li{font-size: 14px;margin-bottom: .25rem!important;color: #9d9fa9 !important;}
.section-box-title {padding:12px 0px;line-height:34px;font-weight:700;border-radius:25px;}
.section-box-title h3 i {box-sizing:border-box;width:10px;height:10px;border-radius:50%;position:absolute;margin-left:-20px;margin-top:4px;border:2px solid #0060ed;box-shadow:0 0 0px 4px rgba(33,150,243,0.2);}
.section-box-title h3 {color:#243159;font-size:16px;font-weight:600;height:18px;padding-left:25px;line-height:18px;}
.tag-box {padding:10px 0;width:100%;}
.tag-box span {border:none;background-color:#0d0033;color:#fff;display:inline-block;margin-bottom:10px;margin-right:10px;padding:5px 8px;border-radius:4px;font-size:14px;}
.tag-box a {border:none;display:inline-block;margin-bottom:10px;margin-right:10px;padding:5px 10px;border-radius:4px;font-size:14px;}
.xgart-row {overflow:hidden;position:relative;}
.xgart-row li {width:47%;float:left;display:flex;align-items:center;margin-top:15px;padding-right:30px;padding-left:15px;position:relative;}
.xgart-row li:before {content:'';position:absolute;left:0;width:4px;height:4px;border-radius:10px;background-color:#2196F3;}
.xgart-row a {display:inline-block;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;color:#777;}
.xgart-row a:hover {color:var(--primary-color);}
/*texiao*/
#gallery-wrapper {position:relative;max-width:100%;width:100%;margin:20px auto;}
img.thumb {max-width:100%;height:auto;}
.white-panel {position:absolute;background:white;border-radius:5px;border:1px solid #dbd1f1;padding:10px;transition:box-shadow .3s cubic-bezier(.215,.61,.355,1),transform .3s cubic-bezier(.215,.61,.355,1),-webkit-transform .3s cubic-bezier(.215,.61,.355,1);-webkit-transform:translate(0,0);transform:translate(0,0);box-shadow:0 34px 50px -24px rgba(136,161,206,0.3);}
.white-panel h1 {font-size:1em;}
.white-panel h1 a {color:#1f0757;font-size:.8rem;font-weight:700;}
.white-panel:hover {-webkit-transform:translateY(-5px);transform:translateY(-5px);-ms-transform:translateY(-5px);transition:all 0.3s ease-in-out;}
/*about*/
.about-infos{background-color: #ffffff !important;padding: 3rem 0;overflow: hidden;}
.about-content{max-width: 1000px;margin: 0 auto;}
.posts-pushes{width: 100%;background-color: #ffffff;position: relative;display: inline-block;border-radius:4px!important;}
.posts-pushes  h5{position:relative;margin-bottom:30px!important;color: #1f0757 !important;font-size: 1.2rem;font-weight:600;}
.posts-pushes  h5::after{position:absolute;display:block;content:'';width:116px;bottom:-20px;left:0;border-top:solid 2px #f0f4f7;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s;transition:.5s}
.posts-pushes:hover h5::after{left:0!important;margin-left:0!important;width:100%!important}
.details-area {position:relative;z-index:1;padding-top:.5rem;}
.details-area p {color:#8480ae;line-height:1.8;font-size:1rem;margin-bottom:1rem;}
.details-area b {font-family:'oswaldregular',sans-serif;padding:0 .5rem;color:#1f0757;}
.details-area code {font-family:"Microsoft Yahei","冬青黑体简体中文 w3";font-size:.875em;color:#d63384;word-wrap:break-word;}
.alert-success {background:#edfbf6;color:#2fb784;padding:10px 15px;margin-bottom:20px;}
.wenda{width: 100%;background-color: #ffffff;position: relative;display: inline-block;border-radius:4px!important;padding:0 2rem;}
.wenda ul {margin-top:-12px;}
.wenda ul li {padding:12px 0;font-size:16px;border-top:1px solid #f7f7f7;line-height: 26px;}
.wenda ul li h4{font-size: 18px;color: #e6b980;margin-bottom: 10px;}
.wenda ul li strong{color: #1f0757;}
.wenda ul li p{margin-bottom: 10px;font-size: 15px;color: #8480ae;line-height: 1.6;}
.wenda ul li:first-child {border:none;}
.posts-pushes ul {margin-top:-12px;}
.posts-pushes ul li {padding:12px 0;font-size:16px;border-top:1px solid #f7f7f7;line-height: 26px;}
.posts-pushes ul li span {font-size:15px;color:#85858a;display:block;margin-top:5px;}
.posts-pushes ul li b {font-size:16px;}
.posts-pushes ul li p{margin-bottom: 10px;font-size: 16px;color: #2f3340;line-height: 1.8;}
.posts-pushes ul li h4{font-size: 18px;}
.posts-pushes ul li:first-child {border:none;}
.continfo{color: #223C61;margin-top:10px;}
.continfo h3{color: #1f0757;margin-top:10px;}
.continfo p{margin:5px 0;line-height:24px;color: #223C61;}
/*foot*/
.foot {background-color:#141727 ;background-image: linear-gradient(310deg,#141727,#3a416f);padding:30px 0;display:block;}
.footer-con {margin-right:-15px;margin-left:-15px;overflow:hidden;}
.widget {text-align:left;float:left;margin-bottom:0!important;max-width:54%;position:relative;width:100%;min-height:1px;padding-right:15px;padding-left:15px;}
.flogo {position:relative;height:45px;margin-right:30px;background-size:contain;background-position:left center;background-repeat:no-repeat;margin-bottom:1.5rem!important;}
.text-sm {font-size:14px !important;line-height:22px;color:rgba(255,255,255,.8);margin-bottom:1rem;}
.text-md-right {text-align:right;float:right;max-width:50%;position:relative;min-height:1px;padding-right:15px;padding-left:15px;padding-top:28px;}
.btn-info-gradiant {background:#0060ed;background-image: linear-gradient(310deg,#0060ed,#2152ff);color:#ffffff;border-right-width:0;border-left-width:0;}
.btn-info-gradiantw {background:#fff;background-image: linear-gradient(310deg,#ffffff,#ffffff);color:#0060ed;border-right-width:0;border-left-width:0;    padding: 0.19rem 1.8rem;}

.btn-info-gradiant:hover {background:#4403ff;background:-webkit-linear-gradient(legacy-direction(to right),#4403ff 0%,#188ef4 100%);background:-webkit-gradient(linear,left top,right top,from(#4403ff),to(#188ef4));background:-webkit-linear-gradient(left,#0060ed 0%,#4403ff 100%);background:-o-linear-gradient(left,#0060ed 0%,#4403ff 100%);background:linear-gradient(to right,#0060ed 0%,#4403ff 100%);color:#FFF;}
.btn-info-gradiant.active,.btn-info-gradiant:active,.btn-info-gradiant:focus {-webkit-box-shadow:0px;box-shadow:0px;opacity:1;}
.text-muted {color:rgba(255,255,255,.8) !important;font-size:12px !important;margin-bottom:1rem!important;margin-top:1rem!important;}
.text-em {font-size:14px !important;color:#fff !important;margin-bottom:.25rem!important;}
.foot .copyright {position:relative;font-size:12px;text-align:left;margin-top:1rem;}
.foot .copyright::after {position:absolute;display:block;content:'';width:32px;top:-26px;left:8px;border-top:solid 2px #f0f4f7;}
.copyright .bq {display:inline-block;font-size:12px;text-align:left;color:rgba(255,255,255,1);}
.copyright .span, .copyright a{font-size:12px;color:rgba(255,255,255,1);}
.copyright .copy {float:right;display:inline-block;text-align:right;}
.copyright .copy a {color:rgba(255,255,255,.8);font-size:12px;display:inline-block;margin-left:10px;}
.copyright .copy a:hover {color:#2d3757;}
.widget {padding:20px;color:#333;border-radius:2px;line-height:24px;margin-right:70px;}
.footer-menu {position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:0 0 0 2rem;}
.footer-menu i {position:absolute;left:0;top:1px;font-size:1.2rem;}
.footer-menu a {position:relative;display:block;color:#ffffff;padding:0 .75rem 0 0;margin:.09rem .75rem 0 0;}
.footer-menu a:after {content:'';position:absolute;right:0;top:50%;width:2px;height:10px;background-color:#777a89;-webkit-transform:translate(0%,-50%);-ms-transform:translate(0%,-50%);transform:translate(0%,-50%);}
.footer-menu a:last-child:after{display:none}
.friendlink {background-color: #141727 ;background-image: linear-gradient(310deg,#141727,#3a416f);padding-bottom: 1rem;display: block;}
.friendlink .links{padding-top: 1rem!important;}
.friendlink .text-muted {color: rgba(255,255,255,.8) !important;}
.rollbar {position:fixed;right:20px;bottom:30%;z-index:99;display:block;}
.rollbar .actions {position:relative;width:100%;list-style-type:none;margin:0;padding:0;}
.rollbar .actions .contbar {position:relative;margin-bottom:10px;background-image: linear-gradient(135deg,#dbe2e9,#fff);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1);border-radius: 30px;}
.rollbar .actions .contbar>a {display:block;cursor:pointer;position:relative;border:0;opacity:1;width:50px;text-align:center;height:50px;}
.rollbar .actions .contbar>a>i {font-size:32px;color:#111010;display:block;padding:0px;}
.rollbar .actions .contbar.tel>a>i{color:#14b6f6;}
.rollbar .actions .contbar.wx>a>i{color:#1abb0d;}
.rollbar .actions .contbar.tel>a>i:hover{color:#14b6f6;}
.rollbar .actions .contbar.wx>a>i:hover{color:#1abb0d;}
.rollbar .rollbar-item {position:absolute;margin-top:10px;border-radius:30px;background-color:#ffffff;color:#555;width:50px;text-align:center;cursor:pointer;-webkit-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out;background-image: linear-gradient(0deg, #ffffff 0%, #f3f5f8 100%);border: 2px solid #fff;box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1);border-radius: 30px;;line-height:50px;height:50px;}
.rollbar .rollbar-item i {line-height:45px;font-weight: 700;}
.rollbar .rollbar-item:hover i{color:#034eff;}
.rtbar_shwx {display:none;width:200px;position:absolute;top:0;right:50px;}
.rtbar_shwx .rtbar_qrimg {background-color:#fff;box-shadow:0 2px 14px 0 rgba(0,0,0,0.08);padding:8px 8px;margin-right:12px;position:relative;text-align:center;}
.rtbar_shwx .rtbar_qrimg span {font-size:12px;color:#758096;}
.rtbar_qrimg::after {content:'';position:absolute;right:-12px;top:26px;width:0;height:0;border:7px solid transparent;border-left:12px solid #fff;border-right:12px;}
/*按钮*/
.btn-all {padding:0.15rem 1.9rem;font-size: 15px;letter-spacing: 2px;line-height:40px;font-weight: 600;border-width:2px;border-radius:4px;display:inline-block;position:relative;}
.btn-all span {display:inline-block;position:relative;-webkit-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out;will-change:transform;}
.btn-all:hover span,.btn-all:focus span {-webkit-transform:translate3d(-.75rem,0,0);transform:translate3d(-.55rem,0,0);}
.btn-all i {position:absolute;width:1.25em;right:0rem;opacity:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}
.btn-all:hover i,.btn-all:focus i {opacity:1;right:-1.6rem;}
.btn-blue{color:#ffffff;background-color:#0060ed;background-image: linear-gradient(310deg,#0060ed,#2152ff);-webkit-transition:0.3s ease-in;-o-transition:0.3s ease-in;transition:0.3s ease-in;}
.btn-blue:hover,.btn-blue.focus {background-color:#fdd76e;color:#fff;}

.btn-info-grenn {background:#1abb0d;background-image: linear-gradient(310deg,#1abb0d,#2aae67);color:#ffffff;border-right-width:0;border-left-width:0;}
.btn-info-grenn:hover {background:#1abb0d;background:-webkit-linear-gradient(legacy-direction(to right),#1abb0d 0%,#2aae67 100%);background:-webkit-linear-gradient(left,#1abb0d 0%,#2aae67 100%);background:-o-linear-gradient(left,#1abb0d 0%,#2aae67 100%);background:linear-gradient(to right,#1abb0d 0%,#2aae67 100%);color:#FFF;}
.btn-info-grenn.active,.btn-info-grenn:active,.btn-info-grenn:focus {-webkit-box-shadow:0px;box-shadow:0px;opacity:1;}

.btn-yellow {color:#1f0757;background-color:#fdd76e;-webkit-transition:0.3s ease-in;-o-transition:0.3s ease-in;transition:0.3s ease-in;margin-left:2px;}
.btn-yellow:hover,.btn-yellow.focus {color:#1f0757;background-color:#fdd76e;}
.btn-wave{position:relative;text-decoration:none;overflow:hidden;border-width:0}
.btn-wave:hover .wave{top:-120px}
.btn-wave .wave{width:200px;height:200px;position:absolute;left:0;top:-80px;transition:0.4s}
.btn-wave .wave::before,a .wave::after{width:200%;height:200%;content:'';position:absolute;top:0;left:50%;transform:translate(-50%,-75%)}
.btn-wave .wave::before{border-radius:45%;background-color:rgba(236,236,236,0.2);animation:wave 5s linear infinite}
.btn-wave .wave::after{border-radius:40%;background-color:#a8bbfa80;animation:wave 10s linear infinite}
@keyframes wave{0%{transform:translate(-50%,-75%) rotate(0deg)}
100%{transform:translate(-50%,-75%) rotate(360deg)}
}
/*公用*/
.le-crumb {position:relative;}
.le-crumb .crumb-inner {color:#333b55;font-size:12px;box-sizing:border-box;display:block;margin-left:auto;margin-right:auto;line-height:30px;}
.le-crumb .crumb-inner i {color: #0060ed !important;padding:0 5px;}
.le-crumb a,.le-crumb span {font-size:12px;color:#333b55;}
.le-crumb a:hover,.le-crumb span:hover {font-size:12px;color:#0060ed;}
/*pagination*/
.pageinfo {padding:20px 10px;text-align:center;background:#fff;border-radius:6px;}
.pageinfo a {background-color:#fff;border-color:#f4f4f4;border-style:solid;border-width:1px;color:#666;margin:2px;padding:8px 20px;text-decoration:none;border-radius:4px;height:36px;line-height:36px;transition:all 0.2s ease 0s;}
.pageinfo a:hover,.pageinfo .active{background-color:#0060ed;border-color:#0060ed;border-style:solid;border-width:1px;color:#fff;}
.pageinfo a:active {border-color:#0060ed;border-style:solid;border-width:1px;color:#000;}
.pageinfo span.thisclass {background-color:#0060ed;border-color:#0060ed;border-style:solid;border-width:1px;color:#fff;font-weight:bold;margin:2px;padding:8px 20px;border-radius:4px;}
.pageinfo span.disabled {border-color:#f4f4f4;border-style:solid;border-width:1px;color:#666;margin-right:2px;padding:8px 20px;border-radius:4px;background-color:#fff;}
.site-boxs{padding:30px;background:#fff none repeat scroll 0 0;border-radius:4px;margin-bottom:30px;}
/*down*/
.downloads{width: 100%;overflow: hidden;padding:14rem 0;background-color: #0811fb;position: relative;text-align: center;min-height: 650px;}
.downloads strong{font-size:2rem;color:#fff;}
.downloads .docs {font-size:18px;font-weight:400;color:#e3e3e3;margin-top:40px;text-align:center;}
.downloads .tiquma {height:40px;color:#fff;}
.downloads .tiquma span {color:#fff;font-weight:bold;font-size:20px;}
.downloads .tiquma input{border:none;cursor: pointer;}
.downloads .tiquma .fuzhitqm {border: 0;width:130px;height:40px;border-radius:8px;text-align:center;line-height:40px;font-size:16px;font-weight:600;background:#fff;color:#1482e6;margin-left:8px;margin-right:10px;cursor:pointer;}
.downloads .tiquma .fuzhitqm:hvover {background:#f7f7ff;}
.downloads .btnd {width:380px;margin:0 auto;margin-top:45px;}
.downloads .btnd a {float:right;display:block;-webkit-border-radius:8px;border-radius:8px;text-align:center;line-height:40px;font-size:16px;font-weight:600;background:#ff6700;color:#fff;}
.downloads .btnd a:hover{background:#fa873a;}


/*按钮*/
.btn-all {text-align: center;font-size: 15px;letter-spacing: 2px;line-height:40px;font-weight: 600;border-width:2px;border-radius:4px;display:inline-block;position:relative;}
.btn-all span {display:inline-block;position:relative;-webkit-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out;will-change:transform;}
.btn-all:hover span,.btn-all:focus span {-webkit-transform:translate3d(-.75rem,0,0);transform:translate3d(-.55rem,0,0);}
.btn-all i {position:absolute;width:1.25em;right:0rem;opacity:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}
.btn-all:hover i,.btn-all:focus i {opacity:1;right:-1.6rem;}
.btn-allfoot {text-align: center;font-size: 15px;letter-spacing: 2px;line-height:40px;font-weight: 600;border-width:2px;border-radius:4px;display:inline-block;position:relative;padding: 0.15rem 1.9rem;}
.btn-allfoot span {display:inline-block;position:relative;-webkit-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out;will-change:transform;}
.btn-allfoot:hover span,.btn-allfoot:focus span {-webkit-transform:translate3d(-.75rem,0,0);transform:translate3d(-.55rem,0,0);}
.btn-allfoot i {position:absolute;width:1.25em;right:0rem;opacity:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}
.btn-allfoot:hover i,.btn-allfoot:focus i {opacity:1;right:-1.6rem;}
.btn-blue{color:#ffffff;background-color:#0060ed;background-image: linear-gradient(310deg,#0060ed,#2152ff);-webkit-transition:0.3s ease-in;-o-transition:0.3s ease-in;transition:0.3s ease-in;}
.btn-blue:hover,.btn-blue.focus {background-color:#fdd76e;color:#fff;}
.btn-yellow {color:#1f0757;background-color:#fdd76e;-webkit-transition:0.3s ease-in;-o-transition:0.3s ease-in;transition:0.3s ease-in;margin-left:2px;}
.btn-yellow:hover,.btn-yellow.focus {color:#1f0757;background-color:#fdd76e;}
.btn-orange{
    background: #ff8400;
    color: #fff;
}
.btn-orange:hover{
    color: #fff;
}

.btn-wave{position:relative;text-decoration:none;overflow:hidden;border-width:0}
.btn-wave:hover .wave{top:-120px}
.btn-wave .wave{width:200px;height:200px;position:absolute;left:0;top:-80px;transition:0.4s}
.btn-wave .wave::before,a .wave::after{width:200%;height:200%;content:'';position:absolute;top:0;left:50%;transform:translate(-50%,-75%)}
.btn-wave .wave::before{border-radius:45%;background-color:rgba(236,236,236,0.2);animation:wave 5s linear infinite}
.btn-wave .wave::after{border-radius:40%;background-color:#a8bbfa80;animation:wave 10s linear infinite}
@keyframes wave{0%{transform:translate(-50%,-75%) rotate(0deg)}
100%{transform:translate(-50%,-75%) rotate(360deg)}
}




/*****视频下载******/
.meihua_1 {
	display: block;
	margin-top: 10px;
	padding: 5px 10px;
	background-color: #f16b6f;
	color: #FFF;
	font-weight: bold;
	font-size: 18px;
	font-family: "Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;
}
.meihua_2 {
	background-color: #fff;
	margin-bottom: 20px;
	box-shadow: 0 1px 2px rgba(15,39,65,0.1);
	font-family: "Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;
}
.meihua_2 .meihua_2_1 {
	height: auto;
	overflow: hidden;
	background-color: #FFF;
	border: 1px solid #DDDDDD;
	border-width: 1px 1px 1px 1px;
	padding: 20px 20px 10px 20px; 
}
.meihua_2 .meihua_2_1 p {
	margin: 5px auto!important;
}
.meihua_2 .meihua_2_1 .meihua_btn {
float: left;
    
    font-size: 14px;
    height: 36px;
    line-height: 36px;
    padding-left: 40px;
    margin: 10px 10px 0 0;
    overflow: hidden;
    border-radius: 2px;
	background: url(../images/30.png) no-repeat 5px 3px #f16b6f;
    border: 1px solid #f16b6f;
    color: #FFF;
    text-decoration: none;    padding-right: 10px;
}
.meihua_2 .meihua_2_1 .meihua_btn i {
	margin-right: 5px
}
.meihua_2 .meihua_2_1 .meihua_btn:hover {
	background-color: #ea4c89
}
.video {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.video iframe,
.video object,
.video embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.short-btn {
    float: left;
    border: 1px solid #8a8a8a;
    font-size: 14px;
    line-height: 36px;
    padding-left: 40px;
    margin: 0px 10px 10px 0;
    overflow: hidden;
    border-radius: 2px;
    background: url(../images/10.png) no-repeat 5px 3px #f16b6f;
    border: 1px solid #f16b6f;
    text-decoration: none;color: #FFF!important;padding-right: 10px;text-decoration: none; 
}
.short-btn:hover {
	background-color: #ea4c89
}


.tagzong{}
.tagzong a{width: auto;}
.tagzong a span{padding: 2px 10px;}

.mod-tags {overflow:hidden;}
.mod-tags>a {float:left;display:block;color:#726161;border-radius:2px;font-size:14px;overflow:hidden;}
.mod-tags>a>span {display:block;width:auto;line-height:25px;margin:4px 3px;padding:3px 8px;text-align:center;background:#f5f6f7;border-radius:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
a.a-tag-1 {color:#f44336;}
a.a-tag-2 {color:#4caf50;}
a.a-tag-3 {color:#0B0B0B;}
a.a-tag-4 {color:#00bcd4;}
a.a-tag-5 {color:#2196f3;}
a.a-tag-6 {color:#e91e63;}
a.a-tag-7 {color:#34495e;}
a.a-tag-8 {color:#003366;}
a.a-tag-9 {color:#B37333;}
a.a-tag-10 {color:#CC0000;}
a.a-tag-1>span:hover {color:#fff;background:#f44336;}
a.a-tag-2>span:hover {color:#fff;background:#4caf50;}
a.a-tag-3>span:hover {color:#fff;background:#0B0B0B;}
a.a-tag-4>span:hover {color:#fff;background:#00bcd4;}
a.a-tag-5>span:hover {color:#fff;background:#2196f3;}
a.a-tag-6>span:hover {color:#fff;background:#e91e63;}
a.a-tag-7>span:hover {color:#fff;background:#34495e;}
a.a-tag-8>span:hover {color:#fff;background:#003366;}
a.a-tag-9>span:hover {color:#fff;background:#B37333;}
a.a-tag-10>span:hover {color:#fff;background:#CC0000;}
@media only screen and (max-width:900px) {
.container {max-width: 100%;padding-right: 15px;padding-left: 15px;}
/*header*/
.hua-navbar h1 {
        float: none;
        margin-top: 0px;
    }
.hua-navbar h1 a{}

.hua-navbar .nav-list{padding:50px 15px;position: fixed;right: -280px;top:0;bottom: 0;width: 250px;margin-left:0;background: #ffffff;z-index: 99999;transition: all .3s ease;}
.hua-navbar .nav-list.show{right: 0px;}
.hua-navbar .nav-list > li {
        float: none;
        display: block;
        text-align: left;
        border-bottom: 1px solid #f3eeee;
    }
.hua-navbar .nav-list > li > a{height: 40px;line-height: 40px;}
.nav-list > li.current a{background-color:initial;}
.canvas-close {display:block;position: absolute;right: 15px;top: 18px;width:30px;height:30px;z-index: 99999;color: #000;transition: all .3s ease;}
.canvas-close i{font-size:25px;transition: all .3s ease;}
.nav-list.show li em.dot {position: absolute;top: 0;right: 0;width: 50px;height: 40px;text-align: center;cursor: pointer;line-height: 40px;}
.nav-list.show li em.dot i{font-size:18px;}
.hua-navbar .nav-list .sub-nav{background: #eaeaea;position: relative;box-shadow: none;text-align: center;}
.hua-navbar .nav-list li:hover > .sub-nav{display:none;}
.hua-navbar .nav-list .sub-nav p:last-child{padding-bottom: 10px;}
.hua-navbar .nav-list .sub-nav p a{  width: auto;display: block;margin: 10px 10px 0 10px;background-color: #f7f7f7;}
.hua-overlay{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,.7);z-index: 9998;-moz-transition: .3s;-o-transition: .3s;-webkit-transition: .3s;transition: .3s;}
.nav-right{font-size: 18px;}
.nav-right .nav-button{display:block;}
.nav-right .nav-button a{padding:7px 0 !important}
.u-fang{display:none;}
.search-box .container{max-width:100%;}
.search-input{width:80%}
.search-btn{width:20%}
.search-button{position: absolute;right: 15px;top: 18px;display: block !important;}
.search-button a{color: #2d3757;}
.search-button .fa{font-size: 18px;}
.search-box{padding:8.5px 30px 8.5px 0;}
.search-box.show{top:7px;}
.search-box .search-input, .search-box .search-btn{height: 35px;}
.search-close{font-size: 24px;top:-1px;right: -30px;}

/*index*/
.page-banner{width:100%;padding:2.5rem 0 2.5rem 0;}
.page-banner .banner-title{font-size:26px; text-align: center;margin-bottom:0px;}
.page-banner .banner-description{font-size:14px;text-align: center;}
    .banner-img {
        width: 100%;
        display: block;
    }
.section-header .page-home-header .inner{padding-left:0px;}
.page-banner .banner-button{margin-top:20px;text-align: center;}
.banner-image{width:90%;padding-top: 2rem;}
.ecms-hot{width:70%;}
.le-e-hot .tit-p{padding: 0rem 0;}
.le-e-hot .tit-p .title{font-size:24px;}
.tit-p{padding: 2rem 0;}
.tit-p .title{font-size:24px;}
.tit-p h2{margin-bottom: .5rem;font-size:24px;}
.tit-p p{font-size:14px;}
.pro-ztlist li{width:100%;margin-right: 0;}
.course-list{max-width:100%;width: 100%;margin-right:0;float:none;margin-top:1rem;}
.fuwu-box{padding: 0px 0 0;}
.fuwu-list ul li{margin-right:0px;float:none;margin-bottom: 15px;width:100%;}
.fuwu-list ul li div{padding: 18px 29px;}
.fuwu-list ul li h2{margin: 0px 0 0px;}
.fuwu-list ul li a{width:100%;}
.friendlink .links{display:block;}
/*listarac-pro*/
.archive-filter {margin-bottom:20px;}
.archive-selects .filter {display:none;}
.archive-filter .filters .recent {display:block;}
.archive-filter .filter {padding-top:0;overflow-x: auto;white-space: nowrap;border-bottom: 0px dashed #e8e8e8;}
.huatheme_left{width:100%;}
.huatheme_right{width:100%;margin-top:20px;}
.theme_title h1{font-size:16px;}
.theme_title p{font-size:14px;}
.theme-price{text-align: center;}
.theme-price .huodong{margin-left:0;margin-top:.5rem;}
.btn-theme{text-align: center;}
.theme-server{margin: 10px 0;}
.theme-item-intro ul li{width:50%;margin-bottom:0px;}
.theme-item-intro ul li p{font-size:1rem !important}
.yuanma-con{padding: 2rem 1.5rem;}
.yuanma-con p{font-size:14px;}
.inner-tit{    margin: 2rem !important;}
.section-box-content {padding: 40px 15px;}
.features li{padding: .5rem 1rem;}
.down-detail{text-align: center;}
.features .avatar span{display: block!important;line-height: 1.5;}
.mod-inner .newstext p{font-size:15px;}
.downloads{min-height: auto;padding: 10rem 0;}
.downloads strong{font-size:1rem;}
.downloads .btnd{margin: 1rem 0;}
.at_list_con{  margin-top: 80px;}
.at_list li{width:100%;  margin: 0 0px 1rem 0;}
/*listarac-news*/
.hide_sm{display:none;}
.newsconleft, .newsconright{width:100%;}
.aboutme{padding:1.5rem!important;margin-bottom: 10px;}
.home-search{height:40px;width:280px;}
.search-input-block{line-height: 40px;}
.search-input-icon{width: 86px;right: 8px;height:35px;line-height: 35px;}
.search-input-icon span{font-size:.5rem;}

/*about*/
.about-infos{padding: 1.5rem 0;}
.posts-pushes{width:100%;margin-right: 0px;max-width:100%;padding:1.5rem!important;}
.about-class{max-width: 100%;width: 100%;margin-top:1rem;}

/*fuwu*/
.service-page{margin-bottom:0px;}
.service-page .service-banner{padding: 40px 0 30px;}
.service-page .standard-left{width:100%;}
.service-page .standard-left h2{font-size:18px;}
.service-page .performance-list li{font-size:14px;}
.service-page .conversion-box{width:100%;margin-bottom:20px;}
.service-head{height:222px;}
.service-head .standard-left h1{font-size:1.8rem;}
.service-head .service-banner{ padding: 60px 0 20px}
.service-head .standard-left h2{font-size:.875rem;}
/**/
.dhinfo a{width:100%;}
/*foot*/
.footer-title {margin: 0 0 10px;}
.widget{max-width: 100%;width: 100%;margin-bottom: 0rem!important;padding:0 20px 20px;margin-right: 0px;}
.text-md-right{max-width: 100%;width: 100%;text-align: center;padding-top: 10px;}
.copyright::after {right: auto;left: 50%;margin-left: -16px;}
.copyright .bq {width:100%;padding-bottom: 1rem;text-align: center;}
.copyright .copy {width:100%;    text-align: center;}
.foot .copyright{margin-top:2.8rem;}
.foot .copyright::after {right: auto;left: 50%;margin-left: -16px;}
.rollbar{right:3px;bottom:10%;}
.live-chat-bar{font-size:0px;padding: 0px 5px;}
.live-chat{top:auto;bottom:10%;}
.go-top{bottom:4%;}

}

html {
-webkit-text-size-adjust: none;
}
*{
	margin: 0;
	padding: 0;
}
*, ::after, ::before {
    box-sizing: border-box;
}
em, i {
    font-style: normal;
}
ol, ul {
	list-style: none;
}
img {
	border: 0;
	max-width: 100%;
    height: auto;
}
p {
    color: #3e506f;
    margin: 0;
    white-space: normal;
    word-break: break-all;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
    line-height: 1.75;
	color: #344767;
    font-size: 24px;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.75;
    color: #000;
    font-size: 24px;
}
table {
    border-spacing: 0;
    border-collapse: collapse;
}
body {font-family:'Microsoft Yahei',"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;background:#ffffff;line-height:1.5;}
@media only screen and (min-width: 900px) {body{background: #fff;}}
@media only screen and (max-width: 900px) {body{background: #fff;padding-top: 0px;}}
a {
	color: #3e506f;
	font-size: 14px;
	text-decoration: none;
	transition: color 0.3s;
	cursor: pointer;
}
a:hover {
	color: #0060ed;
}
::selection{background:#0060ed;color:#fff;}

.font-theme {
    font-family: 'oswaldregular', sans-serif;
}
.container {max-width:1200px;margin:0 auto;}
.linear {
    background-image: linear-gradient(0deg, #ffffff 0%, #f3f5f8 100%);
    border: 2px solid #fff;
    box-shadow: 8px 8px 20px 0 rgba(55,99,170,.1), -8px -8px 20px 0 #fff;
}
.color0{color:#04b9b6;background-color:rgba(8,196,193,.1)}
.color1{color:rgb(202, 109, 220);background-color:rgba(212, 62, 241, 0.1)}
.color2{color:#ff5473;background-color:rgba(255,84,115,.1)}
.color3{color:#6a933e;background-color:rgba(72,135,24,.1)}
.color4{color:#ff6f06;background-color:rgba(255,111,6,.1)}
.color5{color:#8e4aff;background-color:rgba(154,72,245,.1)}
.color6{color:#c58516;background-color:rgba(179,103,8,.1)}
.color7{color:#2997f7;background-color:rgba(41,151,247,.1)}
.color8{color:#5c7cff;background-color:rgba(77,130,249,.1)}
.color9{color:#04b9b6;background-color:rgba(8,196,193,.1)}
.color10{color:#d6064c;background-color:rgba(194,41,46,.1)}
.color11{color:#18a52a;background-color:rgba(18,185,40,.1)}
.color12{color:#e434e1;background-color:rgba(213,72,245,.1)}
.color13{color:#888;background-color:rgba(136,136,136,.1)}
.color14{color:#6a933e;background-color:rgba(72,135,24,.1)}
.color15{color:#c58516;background-color:rgba(179,103,8,.1)}
.color16{color:#d6064c;background-color:rgba(194,41,46,.1)}
.color17{color:#ff5473;background-color:rgba(255,84,115,.1)}
.color18{color:#e434e1;background-color:rgba(213,72,245,.1)}
.color19{color:#04b9b6;background-color:rgba(8,196,193,.1)}
.color20{color:#ff6f06;background-color:rgba(255,111,6,.1)}
.color21{color:#2997f7;background-color:rgba(41,151,247,.1)}
.color22{color:#04b9b6;background-color:rgba(8,196,193,.1)}
.color23{color:#04b9b6;background-color:rgba(8,196,193,.1)}
.color24{color:rgb(202, 109, 220);background-color:rgba(212, 62, 241, 0.1)}
.color25{color:#888;background-color:rgba(136,136,136,.1)}
.color26{color:#d6064c;background-color:rgba(194,41,46,.1)}
.color27{color:#2997f7;background-color:rgba(41,151,247,.1)}
.color28{color:#5c7cff;background-color:rgba(77,130,249,.1)}
.color29{color:#04b9b6;background-color:rgba(8,196,193,.1)}
.color30{color:#d6064c;background-color:rgba(194,41,46,.1)}
.color31{color:#18a52a;background-color:rgba(18,185,40,.1)}
.color32{color:#e434e1;background-color:rgba(213,72,245,.1)}
.color33{color:#888;background-color:rgba(136,136,136,.1)}
.color34{color:#6a933e;background-color:rgba(72,135,24,.1)}
.color35{color:#c58516;background-color:rgba(179,103,8,.1)}
.color36{color:#d6064c;background-color:rgba(194,41,46,.1)}
.color37{color:#ff5473;background-color:rgba(255,84,115,.1)}
.color38{color:#e434e1;background-color:rgba(213,72,245,.1)}
.color39{color:#2997f7;background-color:rgba(41,151,247,.1)}
.color40{color:#5c7cff;background-color:rgba(77,130,249,.1)}
.color41{color:#04b9b6;background-color:rgba(8,196,193,.1)}
.color42{color:#d6064c;background-color:rgba(194,41,46,.1)}
.color43{color:#18a52a;background-color:rgba(18,185,40,.1)}
/*鍥鹃泦*/
.zpjt,.gnsm,.bbgx,.sysm,.xzdz,.lxfs,.tbzy,.xglist,.help,#pl {
    clear: both;
    width: 100%;
    background: #fff;
    padding: 10px 20px;
    border-radius: 10px;
	margin-bottom:20px;
	-webkit-box-shadow: 0 2px 5px 0 rgba(146,146,146,.1);
    -moz-box-shadow: 0 2px 5px 0 rgba(146,146,146,.1);
    box-shadow: 0 2px 5px 0 rgba(146,146,146,.1);
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
	overflow: hidden;
}
.zpjt ul li,.gnsm ul li {
	float: left;
	    margin: 0.5%;
	background: #F4F2EF;
	width: 19%;
	padding: 0.8% 0.8% 0.2% 0.8%;border-radius: 5px;
}
.zpjt ul li img,.zpjt ul li,.gnsm ul li img {
}
.zpjt p,.gnsm p,.bbgx p,.sysm p,.lxfs p,.tbzy p {
    margin-top: 0px;
    margin-bottom: 0px;
    white-space: normal;
    box-sizing: border-box;
    border: 0px;
    vertical-align: baseline;
    font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
    outline: 0px;
    line-height: 1.95em;
    /* text-indent: 2em; */
    text-align: justify;
    color: rgb(42, 42, 42);
    word-break: break-all;
    font-size: 15px;
	padding: 8px 0px;
}
.zpjt h3, #pl h4 {
    white-space: normal;
    box-sizing: border-box;
    margin: 15px 0px;
    padding: 0px 0px 0px 10px;
    border-width: 0px 0px 0px 5px;
    border-top-style: initial;
    border-right-style: initial;
    border-bottom-style: initial;
    border-left-style: initial;
    border-top-color: initial;
    border-right-color: initial;
    border-bottom-color: initial;
    border-left-color: rgb(234, 96, 0);
    border-image: initial;
    vertical-align: baseline;
    font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", sans-serif;
    outline: 0px;
    font-size: 18px;
    line-height: 18px;
    color: rgb(51, 51, 51);
    font-weight: 700;
}
.zpjt .fa{margin-right:10px}
.zpjt h3 .fa{color:rgb(234, 96, 0)}
.zpjt .dxbox{overflow:hidden;margin: 0px -0.5%;}

.zpjt .dxbox li img {

}

.top-wechat-bar {position:relative;z-index:99;width:100%;display:block;}
.wechat-icon {width:20px;height:20px;margin-right:5px;}
.top-wechat-bar-dialog {width:100vw;height:100vh;overflow:hidden;position:fixed;z-index:10001;top:0px;right:0px;left:0px;display:none;justify-content:center;align-items:center;background-color: rgba(94,110,141,0.9);-webkit-transition: opacity 0.3s 0s,visibility 0s 0.3s;
-moz-transition: opacity 0.3s 0s,visibility 0s 0.3s;
transition: opacity 0.3s 0s,visibility 0s 0.3s;}
.dialog-content {width:20%;padding:20px;background-color:#ffffff;border-radius:10px;overflow:hidden;position:relative;display:flex;flex-flow:column nowrap;justify-content:center;align-items:center;}
.copy-icon {width:44px;height:44px;}
.copy-tips {color:#333;font-size:18px;font-weight:700;margin:.625rem 0;}
.dialog-desc {font-size:15px;color:#333;}
.i-see-btn {background-color:#1aad19;border-radius:.25rem;width:9rem;height:2.75rem;display:flex;align-items:center;justify-content:center;font-size:15px;color:#ffffff;cursor: pointer;}
/*20221202*/

/*tags*/
.tags { position: relative; overflow: hidden; }
.tags ul { margin: 0 20px 20px; overflow: hidden }
.tags ul a { display: block; float: left; font-size: 12px; width: 10%; text-align: center; height: 16px; margin-bottom: 4px; background-color: #f1f1f1; color: #615f5f; padding: 10px 0; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tags ul a:after, .tags ul a:before { content: ""; background: #fff; top: 0; width: 2px; height: 100%; position: absolute; }
.tags ul a:after { right: 0; }
.tags ul a:before { left: 0 }
.tags ul a:hover { background: #1487f4; color: #fff; }
.whitebg {background: #fff;border: 1px solid #eee;}
.box, article {
    width: 1170px;
    margin: auto;
    overflow: hidden;
}
/*news-title*/
.news-title {border-bottom: #e4e3e3 1px solid;margin: 20px;padding-bottom: 10px;overflow: hidden;}
.news-title h2 {color: #1487f4;font-size: 16px;font-weight: normal;position: relative;float: left;/* width: 84px; */text-align: center;}
.news-title h2 a { color: #1487f4; }
.news-title h2:after {content: "";background: #1487f4;background: linear-gradient(to right, #0062ff 0%, #00a0ec 100%);width: 100%;height: 2px;position: absolute;bottom: -10px;left: 0;}
.pageinfo b {background-color:#fff;border-color:#f4f4f4;border-style:solid;border-width:1px;color:#666;margin:2px;padding:8px 20px;text-decoration:none;border-radius:4px;height:36px;line-height:36px;transition:all 0.2s ease 0s;background-color: #e1f0ff;
    background-image: -webkit-gradient(linear,left top,right top,from(#fff2ec),color-stop(42%,#f0f1f6),to(#e1f0ff));
    background-image: linear-gradient(90deg,#e1f0ff 0,#f0f1f6 42%,#fff2ec 100%);}
.pageinfo b:hover {border-style:solid;border-width:1px;color:#111;background-color: #e1f0ff;
    background-image: -webkit-gradient(linear,left top,right top,from(#fff2ec),color-stop(42%,#f0f1f6),to(#e1f0ff));
    background-image: linear-gradient(90deg,#e1f0ff 0,#f0f1f6 42%,#fff2ec 100%);}
.pageinfo b:active {border-color:#0060ed;border-style:solid;border-width:1px;color:#000;background-color: #e1f0ff;
    background-image: -webkit-gradient(linear,left top,right top,from(#fff2ec),color-stop(42%,#f0f1f6),to(#e1f0ff));
    background-image: linear-gradient(90deg,#e1f0ff 0,#f0f1f6 42%,#fff2ec 100%);}
.right
{
    float: right;
}
.login {
        float: right;
        margin-left: 10px;
    }
.login i{

        margin-right: 5px;
    }
.login a{
    color: #a9a9ac;
    margin-left: 8px;
}
.login a:hover{
    color: #fff;
    margin-left: 8px;
}

@media (max-width: 600px){
.topinfo{display: none;}
}
@media (min-width: 600px){
    .topinfom{
        display: none;
    }

    }
.topinfom p, .topinfom p a {
        color: #a9a9ac;
        font-size: 12px;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
}
.topinfom{
    float: left;
    height: 38px;
}
.topinfom img{
    height: 32px;
    margin-top: 2px;
}
.topinfom span{
    color: #fff;
}
.lcp-download-button{line-height: 57px;margin-right:5px}
.lcp-download-button a{display:inline-block;padding:8px 15px;border-radius:4px;background-color:#e53e40;color:#fff;line-height: normal;}
.lcp-download-button a:hover{background-color: #1487f4;color: #fff;}
.hua-navbar img {
    width: 48px;
}
.copyright a {
    display: inline-block;
    font-size: 14px;
    color: #000000;
}
.copyright {
    text-align: center;
}
header.hua-header {
    position: sticky;
    background: #ffffff;
}
.hua-navbar .container {
    display: block;
    background: #ffffff;
}
.hua-navbar {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    box-shadow: 0 1px 3px rgb(0 0 0 / 5%);
}
.sp-title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
}
.sp-title p {
    text-align: center;
    display: block;
    color: #ffffff;
    font-size: 28px;
    width: 100%;
}
.sp-title span {
    display: block;
    text-align: center;
    font-size: 16px;
    color: #DBEAFE;
    width: 100%;
}
.sp-title a {
    display: flex;
    margin-top: 20px;
    text-align: center;
    justify-content: center;
}
.sp-title a span {
    font-size: 14px;
    color: #000000;
}
.linkyl-flex {
    display: flex;
    justify-content: center;
        flex-wrap: wrap;
}
.linkyl-flex a {
    padding-right: 5px;
}
.le-crumb .crumb-inner span:last-child {
    display: none;
}
.anqicms-left {
    float: left;
    position: relative;
    width: 20.3333%;
}
.moban {
    background-color: #fff;
    clear: both;
    padding: .8rem;
    z-index: 99;
    position: fixed;
    top: 80px;
    transition: all .2s linear;
    max-height: calc(100% - 109px);
    overflow: auto;
    width: 245px;
    border-right: 1px #eee solid;
}
.moban::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background: transparent
}

.moban::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 4px
}

.moban:hover::-webkit-scrollbar-thumb {
    background: hsla(0,0%,52.9%,.4)
}
.moban-name a {
    display: flex;
    align-items: center;
    height: 44px;
    margin-bottom: 2px;
    font-size: 14px;
    transition: color .3s;
    padding: 0 1rem;
    color: rgba(0, 0, 0, .35);
}
.moban-fl ul li a:hover {
    color: #1e80ff;
    background: #f7f8fa;
    border-bottom: none;
    border-radius: 4px;
}
.moban-fl ul li.active a {
    color: #1e80ff;
    background: #f7f8fa;
    border-bottom: none;
    border-radius: 4px;
}
.moban-name.active a {
    color: #0260ed;
    border-bottom: none;
    border-radius: 4px;
}
.moban-fl ul li a {
    display: block;
    cursor: pointer;
    font-size: 14px;
    line-height: 44px;
    color: #8a919f;
    padding-left: 38px;
    transition: color .3s;
    border-radius: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
}
.anqicms-right {
    float: left;
    position: relative;
    width: 55%;
    margin-left: 22%;
}
.section-anqicms {
    width: 100%;
    overflow: hidden;
    padding: .5rem 0 1rem;
}
.baike_right {
    top: 100px;
    z-index: 1111;
    position: fixed;
    width: 12%;
    background: #fafafa;
    padding: 15px;
    border-radius: 6px;
    right: 20%;
}
.lhr_title {
    font-size: 16px;
    color: #0260ed;
    padding-bottom: 5px;
}
.lhr_baike_menu ul li span {
    line-height: 2;
    cursor: pointer;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
html {
    overflow-x: hidden
}

h1,h2,h3 {
    font-size: 14px
}

::-webkit-input-placeholder {
    color: #999
}

pre {
    margin: 11px 0
}

code {
    font-family: -apple-system, system-ui, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial !important;
}

pre>code {
    display: block;
    line-height: 1.6;
    padding: 16px;
    font-size: 14px
}

pre textarea {
    display: none
}

.ws-content,.ws-menu {
    min-height: calc(100vh - 210px)
}

.ws-menu {
    box-shadow: none;
    border-left: none
}

.ws-content {
    padding: 32px
}

.ws-container {
    padding-top: 60px;
    min-height: calc(100vh - 210px)
}

.ws-header {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    height: 60px;
    background-color: #2f363c;
    box-shadow: 0 1px 3px rgb(0 0 0 / 5%)
}

.ws-header:after {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background-color: #eee;
    content: ''
}

.ws-logo {
    position: absolute;
    width: 240px;
    height: 60px;
    line-height: 60px;
    text-align: center
}

.ws-logo img {
    width: 81px
}

.ws-header-assist {
    position: absolute;
    left: 240px;
    top: 50%;
    height: 32px;
    margin-top: -16px
}

.ws-header-assist>* {
    display: inline-block;
    vertical-align: middle
}

.ws-search {
    position: relative;
    width: 150px
}

.ws-search .layui-input {
    height: 32px;
    padding-left: 32px;
    padding-right: 10px;
    background-color: #fafafa;
    background-color: rgba(255,255,255,.05);
    border: none 0;
    box-shadow: none
}

.ws-search .layui-input::-webkit-focus {
    color: #ccc
}

.ws-search .layui-input::-webkit-input-placeholder {
    color: #ccc
}

.ws-search .layui-form-select .layui-edge {
    display: none;
    border-top-color: #999
}

.ws-search .layui-form-select dl {
    top: 36px
}

.ws-search>.layui-icon {
    position: absolute;
    left: 10px;
    top: 9px;
    font-size: 14px;
    color: #999
}

.ws-notice {
    position: relative;
    height: 32px;
    width: 160px;
    line-height: 32px;
    margin-left: 16px
}

.ws-notice a.nt:after {
    content: 'AD';
    position: absolute;
    right: -7px;
    top: -3px;
    padding: 0 5px;
    line-height: 20px;
    border-radius: 0 3px 0 3px;
    background-color: rgba(255,255,255,.7);
    transform: scale(.6);
    word-wrap: break-word
}

.ws-notice a {
    position: relative;
    display: inline-block
}

.ws-notice a img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 3px
}

.ws-notice a cite {
    display: inline-block;
    padding: 0 15px 0 15px;
    border-radius: 2px;
    transition: all .5s
}

.ws-notice a cite:hover {
    background-color: rgba(255,255,255,.25);
    color: rgba(255,255,255,.9)
}

.ws-notice .layui-carousel,.ws-notice .layui-carousel>[carousel-item]>* {
    background: 0 0
}

.ws-notice .layui-carousel>[carousel-item]:before {
    display: none
}

.ws-header-menu {
    position: absolute;
    right: 16px;
    top: 0
}

.ws-header-menu>*,.ws-header-tool>div {
    display: inline-block;
    vertical-align: middle
}

.ws-header-menu .layui-nav {
    padding: 0
}

.ws-header-menu .layui-nav .layui-nav-item {
    margin-left: 16px
}

.ws-header-menu .layui-nav .layui-nav-item[mobile] {
    display: none
}

.ws-header-menu .layui-nav .layui-nav-item a {
    padding: 0 16px
}

.ws-header-menu .layui-nav .layui-nav-item a span {
    font-size: 12px
}

.ws-header-menu .layui-nav .layui-nav-more {
    right: -3px
}

.ws-header .layui-container {
    height: 100%
}

.ws-header .layui-nav .layui-badge,.ws-header .layui-nav .layui-badge-dot {
    right: 0
}

.ws-header-more {
    display: none;
    line-height: 60px;
    padding: 0 16px;
    cursor: pointer
}

.layui-nav-tree.layui-bg-gray a,.layui-nav.layui-bg-gray .layui-nav-item a {
    color: #373737\9
}

.ws-header-tool {
    margin-left: 16px
}

.ws-header-tool>div {
    margin-left: 16px
}

.ws-header-tool .layui-icon {
    font-size: 21px
}

.ws-header-theme {
    position: relative;
    top: 1px;
    min-width: 44px
}

.ws-header-theme .layui-icon {
    font-size: 16px
}

.ws-header-theme .layui-form-switch {
    top: -1px;
    margin: 0;
    height: 22px;
    line-height: 20px;
    box-sizing: border-box
}

.ws-header-theme .layui-form-switch>div {
    margin-left: 16px
}

.ws-header-theme .layui-form-onswitch>div {
    margin-left: 0;
    margin-right: 16px
}

.ws-header-theme .layui-form-switch>i {
    top: 3px;
    width: 14px;
    height: 14px
}

.ws-header-theme .layui-form-onswitch>i {
    margin-left: -18px
}

.ws-footer {
    padding: 30px 15px;
    line-height: 30px;
    text-align: center;
    color: #777
}

.ws-footer a {
    padding: 0 5px;
    color: #777
}

.ws-footer a:hover {
    color: #1e9fff;
    text-decoration: underline
}

.ws-footer-fixed {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    box-shadow: 0 -1px 3px rgb(0 0 0 / 5%)
}

.ws-footer-fixed:after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background-color: #eee;
    content: ''
}

.ws-footer-fixed .ws-footer {
    height: 60px;
    padding: 15px 0;
    overflow: hidden;
    box-sizing: border-box;
    white-space: nowrap
}

.ws-footer-fixed .ws-footer>* {
    display: inline-block;
    vertical-align: middle;
    padding: 0 15px
}

.ws-index-main {
    position: relative;
    text-align: center
}

.ws-index-main h1 {
    padding-top: 58px;
    font-weight: 500;
    font-size: 68px;
    color: #16baaa
}

.ws-index-main h2 {
    padding: 16px 0;
    line-height: 52px;
    font-size: 32px;
    font-weight: 500;
    color: #16baaa
}

.ws-index-stared {
    padding: 16px 0
}

.ws-index-attach {
    padding: 16px 0;
    line-height: 24px
}

.ws-index-attach span {
    padding: 0 8px
}

.ws-index-attach span a {
    color: #888;
    transition: all .3s
}

.ws-index-attach span a:hover {
    color: #16b777;
    text-decoration: underline
}

.ws-index-attach span em {
    color: #16b777;
    font-style: normal
}

.ws-index-idea {
    margin-top: 40px;
    padding: 0 16px
}

.ws-index-idea>div>div {
    padding: 24px;
    line-height: 24px;
    border: 1px solid #eee
}

.ws-index-idea .layui-field-title {
    border: none
}

.ws-index-idea .layui-field-title legend {
    margin: 0 24px 24px 0;
    padding: 0 16px;
    text-align: center;
    font-size: 16px;
    font-weight: 500
}

.ws-index-idea>div p {
    color: #999
}

.ws-space-16 {
    border: none!important;
    margin: 8px 0
}

.ws-move-elem {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: col-resize;
    opacity: 0;
    z-index: 2147483647
}

body .layui-layer-notice .layui-layer-content {
    padding: 16px;
    line-height: 24px
}

body .layui-layer-notice .layui-layer-title {
    font-weight: 700
}

body .layui-layer-notice .layui-layer-btn .layui-layer-btn0 {
    background-color: #16baaa
}

[lay-tips] {
    cursor: pointer
}

.layui-icon-tips[lay-tips] {
    font-size: 20px
}

.ws-menu {
    position: fixed;
    top: 60px;
    bottom: 0;
    width: 240px;
    z-index: 777;
    min-height: 0;
    border-top: none;
    overflow: hidden;
    background-color: #fff
}

.ws-menu:hover {
    overflow-y: auto;
    overflow-x: hidden
}

.ws-menu .layui-menu-body-title .layui-font-gray {
    padding-left: 6px
}

.ws-menu .layui-menu-body-title .layui-badge-dot {
    left: 6px
}

.ws-menu .layui-menu {
    padding-bottom: 16px
}

.ws-content {
    position: relative;
    margin: 0 226px 0 240px;
    line-height: 1.8;
    box-sizing: border-box
}

.ws-anchor {
    margin-bottom: 16px
}

.ws-anchor.layui-code-preview {
    margin-bottom: 0
}

.ws-anchor,[lay-toc] {
    padding-top: 76px!important;
    margin-top: -76px!important
}

.ws-anchor:not(h1),[lay-toc]:not(h1) {
    padding-top: 86px!important
}

a[lay-toc] {
    display: inline-block
}

.layui-table .ws-anchor {
    pointer-events: none
}

.layui-table .ws-anchor>* {
    pointer-events: auto
}

.ws-detail {
    padding-bottom: 16px
}

.ws-text {
    color: #3a3a3a
}

.ws-text h1,.ws-text h2 {
    font-weight: 700
}

.ws-text h1 {
    margin-bottom: 16px;
    padding-bottom: 11px;
    border-bottom: 1px solid #eee;
    font-size: 24px;
    font-weight: 700
}

.ws-text h2,.ws-text h3,.ws-text h4.ws-anchor {
    margin: 16px 0
}

.ws-text h2 {
    font-size: 21px
}

.ws-text h3 {
    font-size: 18px
}

.ws-text h4 {
    font-size: 16px
}

.ws-text h2 span {
    position: relative;
    top: -2px;
    left: 3px;
    font-weight: 400
}

.ws-text p {
    margin: 16px 0
}

.ws-text .layui-elem-quote p {
    margin: 0
}

.ws-text code:not(.layui-code,.layui-code-wrap) {
    margin: 0 3px;
    padding: 3px 6px;
    background-color: #f7f7f9;
    border-radius: 2px;
    transition: all .3s
}

.ws-text sup {
    position: relative;
    left: 5px;
    margin-right: 10px;
    padding: 1px 3px;
    border-radius: 3px;
    background-color: #ff5722;
    color: #fff;
    font-weight: 700;
    font-size: 12px
}

.ws-bold,.ws-text .ws-bold {
    font-weight: 700
}

.layui-code-preview+.ws-anchor,.layui-code-preview+h2[lay-toc],.layui-code-preview+h3[lay-toc],.ws-text ul+[lay-toc]:not(h1) {
    padding-top: 102px!important
}

.layui-code-preview+ul {
    margin-top: 16px
}

.layui-code-preview ul.layui-rate,.layui-code-preview ul.layui-tab-title,.layui-code-preview ul.layui-transfer-data {
    padding-left: 0
}

.layui-code-preview .laydate-time-list ol li {
    margin: 0
}

.ws-text-tools {
    position: absolute;
    right: 32px;
    top: 42px
}

.ws-text-tools a {
    padding-left: 8px;
    color: #777;
    text-decoration: underline;
    transition: all .3s
}

.ws-text-tools a:hover {
    color: #000
}

.ws-text-tools .layui-icon {
    font-size: 18px
}

.ws-index-showcase {
    position: relative;
    width: 100%;
    margin-top: 16px
}

.ws-index-showcase>div {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 8px;
    box-sizing: border-box;
    box-sizing: border-box
}

.ws-index-showcase>div>.ws-sponsor-link {
    display: block;
    transition: all .3s
}

.ws-index-showcase>div .ws-sponsor-link:hover {
    opacity: .8
}

.ws-index-showcase>div .ws-sponsor-link img {
    max-width: 100%
}

.ws-index-showcase>div .ws-sponsor-link>* {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.ws-docs-showcase>div {
    position: relative;
    margin-top: 5px
}

.ws-docs-showcase>div:first-child {
    margin-top: 0
}

.ws-demo-editor {
    height: 260px;
    padding: 16px;
    border: none;
    border-radius: 3px;
    background-color: #3f3f3f;
    color: #f8f8f2;
    font-family: Courier New
}

.ws-side {
    position: absolute;
    right: -210px;
    top: 32px;
    bottom: 0;
    width: 210px
}

.ws-side-fixed {
    position: fixed;
    z-index: 776;
    width: 210px
}

.ws-dir {
    position: relative
}

.ws-dir:before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    border-left: 1px solid #eee;
    content: ''
}

.ws-dir-ul {
    position: relative;
    max-height: calc(100vh - 210px);
    padding-left: 1px;
    box-sizing: border-box;
    overflow: hidden;
    transition: all .3s
}

.ws-dir-ul:hover {
    overflow: auto
}

.ws-dir-ul li {
    position: relative;
    padding-left: 16px;
    line-height: 28px;
    color: rgba(0,0,0,.35)
}

.ws-dir-ul li[level="2"] {
    padding-left: 32px
}

.ws-dir-ul li[level="3"] {
    padding-left: 48px
}

.ws-dir-ul li a {
    display: block
}

.ws-dir-ul li a:hover,.ws-dir-ul li.layui-this a {
    color: #5fb878
}

.ws-dir-ul li.layui-this:before {
    content: '';
    position: absolute;
    left: -1px;
    top: 0;
    bottom: 0;
    border-left: 1px solid #5fb878
}

.ws-dir-ul li .layui-badge-dot {
    top: -2px;
    left: 3px
}

.ws-sponsor {
    position: relative;
    width: 210px;
    padding-top: 16px
}

.ws-sponsor .ws-sponsor-wrapper {
    width: 216px
}

.ws-sponsor-wrapper>div {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 103.5px;
    height: 50px;
    margin-top: 5px;
    margin-right: 3px;
    background-color: #f7f7f7;
    text-align: center;
    border-radius: 3px;
    transition: all .3s;
    box-sizing: border-box
}

.ws-sponsor-wrapper>div>.ws-sponsor-link {
    display: block;
    line-height: 50px;
    border-radius: 3px
}

.ws-sponsor-wrapper>div>.ws-sponsor-link>img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 3px
}

.ws-sponsor:before {
    position: relative;
    display: block;
    padding-bottom: 15px
}

.ws-sponsor-label {
    position: absolute;
    right: 0;
    bottom: 0;
    line-height: 16px;
    border-radius: 11px 0 3px;
    background-color: rgba(0,0,0,.16);
    color: #fff;
    pointer-events: none
}

.ws-sponsor-label cite {
    display: block;
    padding-left: 3px;
    transform: scale(.7);
    font-size: 12px;
    font-style: normal
}

.ws-sponsor-full {
    position: fixed;
    bottom: 0;
    padding-bottom: 3px;
    background-color: #fff
}

.ws-sponsor-show {
    position: absolute;
    left: 50%;
    top: -8px;
    width: 24px;
    height: 24px;
    line-height: 24px;
    margin-left: -12px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    color: #000;
    transition: all .3s
}

.ws-sponsor-show:hover {
    background-color: #eee
}

.ws-docs-color {
    padding: 0!important
}

.ws-docs-color>div {
    margin: 0!important;
    list-style-type: none
}

.ws-docs-color>div div {
    padding: 20px 10px;
    color: #fff;
    text-align: center;
    border-radius: 3px;
    line-height: 1.6;
    font-size: 14px
}

.ws-docs-color>div p {
    margin: 0
}

.ws-docs-necolor>div div {
    border-radius: 0;
    color: #000
}

.ws-docs-bgcolor>div {
    padding: 20px 10px
}

.ws-docs-icon {
    margin-bottom: 16px;
    font-size: 0
}

.ws-docs-icon>div {
    display: inline-block;
    vertical-align: middle;
    width: 16.5%;
    height: 105px;
    line-height: 25px;
    padding: 20px 0;
    margin-right: -1px;
    margin-bottom: -1px;
    border: 1px solid #e2e2e2;
    font-size: 14px;
    text-align: center;
    color: #777;
    cursor: pointer;
    transition: all .3s;
    -webkit-transition: all .3s
}

.ws-docs-icon>div .layui-icon {
    display: inline-block;
    font-size: 36px
}

.ws-docs-icon>div .docs-icon-code,.ws-docs-icon>div .docs-icon-name {
    color: #c2c2c2
}

.ws-docs-icon>div .docs-icon-fontclass {
    height: 40px;
    line-height: 20px;
    padding: 0 5px;
    font-size: 13px;
    color: #333
}

.ws-docs-icon>div:hover {
    background-color: #f2f2f2;
    color: #000
}

.ws-docs-anim>div {
    height: auto
}

.grid-demo {
    padding: 10px;
    line-height: 50px;
    text-align: center;
    background-color: #79c48c;
    color: #fff
}

.grid-demo-bg1 {
    background-color: #63ba79
}

.grid-demo-bg2 {
    background-color: #49a761
}

.grid-demo-bg3 {
    background-color: #38814a
}

.ws-error {
    padding: 96px 0 32px;
    text-align: center
}

.ws-error>h1 {
    line-height: 210px;
    font-size: 160px;
    font-weight: 300
}

.ws-error>p {
    font-size: 24px
}

.layui-fixbar li[lay-type=dir] {
    display: none
}

.ws-bg-light {
    background-color: #fff!important
}

.ws-play * {
    box-sizing: border-box
}

.ws-play-code,.ws-play-view {
    position: fixed;
    top: 60px;
    bottom: 60px;
    width: 50%;
    height: auto!important
}

.ws-play-code {
    left: 0
}

.ws-play-editor,.ws-play-preview,.ws-play-preview>iframe {
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 8
}

.ws-play-editor {
    right: 8px
}

.ws-play-editor .ws-play-init textarea {
    display: none
}

.ws-play-init .layui-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -16px 0 0 -16px;
    font-size: 32px;
    color: #999
}

.ws-play-preview>iframe {
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: none
}

.ws-play-header {
    position: relative;
    z-index: 9;
    height: 40px;
    line-height: 40px;
    padding: 0 16px;
    border-bottom: 1px solid #eee
}

.ws-play-split {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    width: 8px;
    height: 100%;
    border: 1px solid #eee;
    border-top-width: 0;
    border-bottom-width: 0;
    background-color: #fafafa
}

.ws-play-split:hover {
    cursor: col-resize
}

.ws-play-view {
    right: 0
}

@media screen and (max-width: 1399.98px) {
    .layui-container {
        width:auto!important
    }
}

@media screen and (max-width: 991.98px) {
    .ws-container {
        width:100%!important;
        overflow: hidden
    }

    .ws-notice {
        display: none
    }

    .ws-search {
        width: 32px
    }

    .ws-search .layui-input {
        padding: 0
    }

    .ws-search>.layui-icon {
        display: none
    }

    .ws-search .layui-select-group {
        min-width: 100px
    }

    .ws-header-menu .layui-nav .layui-nav-item {
        margin: 0
    }

    .ws-menu {
        top: 0;
        left: -240px;
        transition: all .3s;
        z-index: 1003;
        overflow-y: auto;
        overflow-x: hidden
    }

    .ws-menu-bar {
        display: block!important;
        position: fixed;
        z-index: 999;
        top: 50%;
        left: 0;
        width: 52px;
        height: 52px;
        line-height: 52px;
        margin-top: -26px;
        border-radius: 3px;
        text-align: center;
        color: #fff;
        cursor: pointer;
        box-shadow: 1px 1px 16px rgba(0,0,0,.16)
    }

    .ws-menu-bar .layui-icon {
        font-size: 21px
    }

    .ws-menu-show .ws-menu {
        display: block;
        left: 0
    }

    .ws-shade-show .ws-shade {
        content: '';
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(0,0,0,.7);
        z-index: 1001
    }

    .ws-content {
        margin: 0;
        padding: 16px
    }

    .ws-text-tools {
        display: none
    }

    .ws-text>div {
        overflow-x: auto
    }

    .ws-side {
        position: fixed;
        top: 0;
        right: -240px;
        padding-top: 32px;
        z-index: 1000000;
        background-color: #fff;
        transition: all .3s
    }

    .ws-side-show .ws-side {
        right: 0
    }

    .ws-side-show .ws-side:before {
        content: '目录';
        position: absolute;
        top: 0;
        padding: 0 16px;
        height: 32px;
        line-height: 32px;
        color: #ccc
    }

    .ws-dir-ul {
        overflow: auto
    }

    .layui-fixbar li[lay-type=dir] {
        display: block
    }
}

@media screen and (max-width: 767.98px) {
    .ws-logo {
        left:50%;
        margin-left: -120px
    }

    .ws-header-menu .layui-nav,.ws-header-tool {
        position: fixed;
        top: 61px;
        right: -100%;
        width: 100%;
        text-align: center;
        transition: all .3s
    }

    .ws-header-menu .layui-nav {
        z-index: 1003;
        height: 60px;
        border-radius: 0;
        box-shadow: 0 1px 3px rgb(0 0 0 / 5%)
    }

    .ws-header-tool {
        top: 121px;
        line-height: 60px
    }

    .ws-header-more {
        display: block
    }

    .ws-header-theme .layui-form-switch {
        top: -4px
    }

    .ws-nav-show .layui-header {
        z-index: 1003
    }

    .ws-nav-show .ws-header-menu .layui-nav,.ws-nav-show .ws-header-tool {
        display: block;
        right: 0
    }

    .ws-index-main h1 {
        font-size: 52px
    }

    .ws-index-main h2 {
        font-size: 24px;
        line-height: 38px
    }

    .ws-content {
        padding: 16px 0
    }

    .ws-docs-icon>div {
        width: 33%
    }

    .ws-play {
        position: fixed;
        top: 60px;
        bottom: 60px;
        left: 0;
        width: 100%
    }

    .ws-play-code,.ws-play-view {
        position: absolute;
        top: 0;
        bottom: auto;
        width: 100%!important;
        height: 50%!important
    }

    .ws-play-view {
        top: auto;
        bottom: 0
    }

    .ws-play-editor {
        right: 8px
    }

    .ws-play-split {
        width: 100%;
        height: 8px;
        top: auto;
        bottom: 0;
        border-top-width: 1px;
        border-bottom-width: 1px
    }

    .ws-play-split:hover {
        cursor: unset
    }

    .ws-footer {
        background: #fafafa
    }

    .ws-footer p {
        padding-bottom: 16px
    }

    .ws-footer a {
        display: block
    }

    .ws-footer-fixed .ws-footer {
        overflow: auto
    }

    .ws-footer-fixed .ws-footer a {
        display: unset
    }
}

:root.dark {
    --color-white: #FFFFFF;
    --color-black: #000000;
    --lay-color-white: #FAFAFA;
    --lay-color-black: #333333;
    --lay-color-red-1: #FFF1E8;
    --lay-color-red-2: #FFD7C0;
    --lay-color-red-3: #FFBB99;
    --lay-color-red-4: #FF9C71;
    --lay-color-red-5: #FF7A4A;
    --lay-color-red-6: #FF5722;
    --lay-color-red-7: #D23B15;
    --lay-color-red-8: #A6250B;
    --lay-color-red-9: #791404;
    --lay-color-red-10: #4D0800;
    --lay-color-blue-1: #E8F9FF;
    --lay-color-blue-2: #C0ECFF;
    --lay-color-blue-3: #97DCFF;
    --lay-color-blue-4: #6FCAFF;
    --lay-color-blue-5: #46B5FF;
    --lay-color-blue-6: #1E9FFF;
    --lay-color-blue-7: #1379D2;
    --lay-color-blue-8: #0A58A6;
    --lay-color-blue-9: #043A79;
    --lay-color-blue-10: #00214D;
    --lay-color-lightblue-1: #E8FDFF;
    --lay-color-lightblue-2: #C1F4FB;
    --lay-color-lightblue-3: #9CEAF7;
    --lay-color-lightblue-4: #77DDF4;
    --lay-color-lightblue-5: #53CEF0;
    --lay-color-lightblue-6: #31BDEC;
    --lay-color-lightblue-7: #1F95C4;
    --lay-color-lightblue-8: #10709C;
    --lay-color-lightblue-9: #064E74;
    --lay-color-lightblue-10: #002F4D;
    --lay-color-layuigreen-1: #E8FFF9;
    --lay-color-layuigreen-2: #B5F1E3;
    --lay-color-layuigreen-3: #87E3D1;
    --lay-color-layuigreen-4: #5DD6C1;
    --lay-color-layuigreen-5: #37C8B5;
    --lay-color-layuigreen-6: #16BAAA;
    --lay-color-layuigreen-7: #0E9F95;
    --lay-color-layuigreen-8: #08837F;
    --lay-color-layuigreen-9: #036868;
    --lay-color-layuigreen-10: #004A4D;
    --lay-color-green-1: #E8FFF2;
    --lay-color-green-2: #B5F1D1;
    --lay-color-green-3: #86E2B4;
    --lay-color-green-4: #5CD49C;
    --lay-color-green-5: #37C588;
    --lay-color-green-6: #16B777;
    --lay-color-green-7: #0E9C68;
    --lay-color-green-8: #088259;
    --lay-color-green-9: #036749;
    --lay-color-green-10: #004D38;
    --lay-color-orange-1: #FFFCE8;
    --lay-color-orange-2: #FFF5BA;
    --lay-color-orange-3: #FFEA8B;
    --lay-color-orange-4: #FFDC5D;
    --lay-color-orange-5: #FFCB2E;
    --lay-color-orange-6: #FFB800;
    --lay-color-orange-7: #D29000;
    --lay-color-orange-8: #A66C00;
    --lay-color-orange-9: #794B00;
    --lay-color-orange-10: #4D2D00;
    --lay-color-cyan-1: #E8F6FF;
    --lay-color-cyan-2: #B9CEDD;
    --lay-color-cyan-3: #8FA7BB;
    --lay-color-cyan-4: #6A829A;
    --lay-color-cyan-5: #4A5F78;
    --lay-color-cyan-6: #2F4056;
    --lay-color-cyan-7: #223654;
    --lay-color-cyan-8: #162C51;
    --lay-color-cyan-9: #0B214F;
    --lay-color-cyan-10: #00174D;
    --lay-color-purple-1: #FDE8FF;
    --lay-color-purple-2: #EDBEF4;
    --lay-color-purple-3: #DC97E8;
    --lay-color-purple-4: #C972DD;
    --lay-color-purple-5: #B651D1;
    --lay-color-purple-6: #A233C6;
    --lay-color-purple-7: #8120A8;
    --lay-color-purple-8: #631289;
    --lay-color-purple-9: #48076B;
    --lay-color-purple-10: #2F004D;
    --lay-color-black-1: #E8F8FF;
    --lay-color-black-2: #BFD0D8;
    --lay-color-black-3: #98A8B1;
    --lay-color-black-4: #73818A;
    --lay-color-black-5: #505B63;
    --lay-color-black-6: #2F363C;
    --lay-color-black-7: #23303C;
    --lay-color-black-8: #18293C;
    --lay-color-black-9: #0C213C;
    --lay-color-black-10: #00183C;
    --lay-color-gray-1: #FAFAFA;
    --lay-color-gray-2: #F6F6F6;
    --lay-color-gray-3: #EEEEEE;
    --lay-color-gray-4: #E2E2E2;
    --lay-color-gray-5: #DDDDDD;
    --lay-color-gray-6: #D2D2D2;
    --lay-color-gray-7: #CCCCCC;
    --lay-color-gray-8: #C2C2C2;
    --lay-color-gray-9: #AAAAAA;
    --lay-color-gray-10: #939393;
    --lay-color-gray-11: #858585;
    --lay-color-gray-12: #7b7b7b;
    --lay-color-gray-13: #686868;
    --lay-color-primary: var(--lay-color-layuigreen-6);
    --lay-color-primary-hover: var(--lay-color-layuigreen-5);
    --lay-color-primary-active: var(--lay-color-layuigreen-7);
    --lay-color-primary-disabled: var(--lay-color-layuigreen-3);
    --lay-color-primary-light: var(--lay-color-layuigreen-4);
    --lay-color-secondary: var(--lay-color-green-6);
    --lay-color-secondary-hover: var(--lay-color-green-5);
    --lay-color-secondary-active: var(--lay-color-green-7);
    --lay-color-secondary-disabled: var(--lay-color-green-3);
    --lay-color-secondary-light: var(--lay-color-green-4);
    --lay-color-info: var(--lay-color-lightblue-6);
    --lay-color-info-hover: var(--lay-color-lightblue-5);
    --lay-color-info-active: var(--lay-color-lightblue-7);
    --lay-color-info-disabled: var(--lay-color-lightblue-3);
    --lay-color-info-light: var(--lay-color-lightblue-4);
    --lay-color-normal: var(--lay-color-blue-6);
    --lay-color-normal-hover: var(--lay-color-blue-5);
    --lay-color-normal-active: var(--lay-color-blue-7);
    --lay-color-normal-disabled: var(--lay-color-blue-3);
    --lay-color-normal-light: var(--lay-color-blue-4);
    --lay-color-warning: var(--lay-color-orange-6);
    --lay-color-warning-hover: var(--lay-color-orange-5);
    --lay-color-warning-active: var(--lay-color-orange-7);
    --lay-color-warning-disabled: var(--lay-color-orange-3);
    --lay-color-warning-light: var(--lay-color-orange-4);
    --lay-color-success: var(--lay-color-green-6);
    --lay-color-success-hover: var(--lay-color-green-5);
    --lay-color-success-active: var(--lay-color-green-7);
    --lay-color-success-disabled: var(--lay-color-green-3);
    --lay-color-success-light: var(--lay-color-green-4);
    --lay-color-danger: var(--lay-color-red-6);
    --lay-color-danger-hover: var(--lay-color-red-5);
    --lay-color-danger-active: var(--lay-color-red-7);
    --lay-color-danger-disabled: var(--lay-color-red-3);
    --lay-color-danger-light: var(--lay-color-red-4);
    --lay-color-bg-1: #17171A;
    --lay-color-bg-2: #232324;
    --lay-color-bg-3: #2a2a2b;
    --lay-color-bg-4: #313132;
    --lay-color-bg-5: #373739;
    --lay-color-bg-white: #f6f6f6;
    --lay-color-text-1: rgba(255, 255, 255, 0.9);
    --lay-color-text-2: rgba(255, 255, 255, 0.7);
    --lay-color-text-3: rgba(255, 255, 255, 0.5);
    --lay-color-text-4: rgba(255, 255, 255, 0.3);
    --lay-color-border-1: #2e2e30;
    --lay-color-border-2: #484849;
    --lay-color-border-3: #5f5f60;
    --lay-color-border-4: #929293;
    --lay-color-fill-1: rgba(255, 255, 255, 0.04);
    --lay-color-fill-2: rgba(255, 255, 255, 0.08);
    --lay-color-fill-3: rgba(255, 255, 255, 0.12);
    --lay-color-fill-4: rgba(255, 255, 255, 0.16);
    --lay-color-hover: var(--lay-color-fill-3);
    --lay-color-active: var(--lay-color-fill-3);
    --lay-shadow-1: 0 4px 6px rgba(0, 0, 0, 0.06),0 1px 10px rgba(0, 0, 0, 0.08),0 2px 4px rgba(0, 0, 0, 0.12);
    --lay-shadow-2: 0 8px 10px rgba(0, 0, 0, 0.12),0 3px 14px rgba(0, 0, 0, 0.1),0 5px 5px rgba(0, 0, 0, 0.16);
    --lay-shadow-3: 0 16px 24px rgba(0, 0, 0, 0.14),0 6px 30px rgba(0, 0, 0, 0.12),0 8px 10px rgba(0, 0, 0, 0.2)
}

.dark blockquote,.dark body,.dark button,.dark dd,.dark div,.dark dl,.dark dt,.dark form,.dark h1,.dark h2,.dark h3,.dark h4,.dark h5,.dark h6,.dark input,.dark li,.dark ol,.dark p,.dark pre,.dark td,.dark textarea,.dark th,.dark ul {
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

.dark body {
    color: var(--lay-color-text-2);
    background-color: var(--lay-color-bg-1);
    color-scheme: dark
}

.dark hr {
    border-bottom: 1px solid var(--lay-color-border-2)!important
}

.dark a {
    color: var(--lay-color-text-1)
}

.dark a:hover {
    color: var(--lay-color-text-3)
}

.dark .layui-edge {
    border-color: transparent
}

.dark .layui-edge-top {
    border-bottom-color: var(--lay-color-border-4)
}

.dark .layui-edge-right {
    border-left-color: var(--lay-color-border-4)
}

.dark .layui-edge-bottom {
    border-top-color: var(--lay-color-border-4)
}

.dark .layui-edge-left {
    border-right-color: var(--lay-color-border-4)
}

.dark .layui-disabled,.dark .layui-disabled:hover {
    color: var(--lay-color-text-4)!important
}

.dark .layui-icon {
    -moz-osx-font-smoothing: grayscale
}

.dark .layui-layout-admin .layui-header {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-layout-admin .layui-footer {
    box-shadow: -1px 0 4px rgba(0,0,0,.12);
    background-color: var(--lay-color-bg-2)
}

.dark .layui-layout-admin .layui-logo {
    color: var(--lay-color-primary);
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.15)
}

.dark .layui-elem-quote {
    border-left: 5px solid var(--lay-color-secondary);
    background-color: var(--lay-color-fill-1)
}

.dark .layui-quote-nm {
    border-color: var(--lay-color-fill-1)
}

.dark .layui-progress {
    background-color: var(--lay-color-bg-3)
}

.dark .layui-progress-bar {
    background-color: var(--lay-color-secondary)
}

.dark .layui-progress-text {
    color: var(--lay-color-text-2)
}

.dark .layui-progress-big .layui-progress-text {
    color: var(--lay-color-text-1)
}

.dark .layui-colla-title {
    color: var(--lay-color-text-1);
    background-color: var(--lay-color-bg-2)
}

.dark .layui-colla-content {
    color: var(--lay-color-text-2)
}

.dark .layui-card {
    background-color: var(--lay-color-bg-2);
    box-shadow: var(--lay-shadow-1)
}

.dark .layui-card-header {
    border-bottom: 1px solid var(--lay-color-border-2);
    color: var(--lay-color-text-1)
}

.dark .layui-panel {
    box-shadow: var(--lay-shadow-1);
    background-color: var(--lay-color-bg-2);
    color: var(--lay-color-text-1)
}

.dark .layui-menu-body-panel {
    box-shadow: var(--lay-shadow-2)
}

.dark .layui-panel-window {
    border-top: 5px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-2)
}

.dark .layui-bg-red {
    background-color: var(--lay-color-red-6)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-bg-orange {
    background-color: var(--lay-color-orange-6)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-bg-green {
    background-color: var(--lay-color-layuigreen-6)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-bg-cyan {
    background-color: var(--lay-color-cyan-6)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-bg-blue {
    background-color: var(--lay-color-blue-6)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-bg-black {
    background-color: var(--lay-color-black-6)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-bg-purple {
    background-color: var(--lay-color-purple-6)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-bg-gray {
    background-color: var(--lay-color-gray-1)!important;
    color: var(--lay-color-black-6)!important
}

.dark .layui-badge-rim,.dark .layui-border,.dark .layui-colla-content,.dark .layui-colla-item,.dark .layui-collapse,.dark .layui-elem-field,.dark .layui-form-pane .layui-form-item[pane],.dark .layui-form-pane .layui-form-label,.dark .layui-input,.dark .layui-input-split,.dark .layui-panel,.dark .layui-select,.dark .layui-tab-bar,.dark .layui-tab-card,.dark .layui-tab-title,.dark .layui-tab-title .layui-this:after,.dark .layui-textarea {
    border-color: var(--lay-color-border-1)
}

.dark .layui-border {
    color: var(--lay-color-text-1)!important
}

.dark .layui-border-red {
    border-color: var(--lay-color-red-6)!important;
    color: var(--lay-color-red-6)!important
}

.dark .layui-border-orange {
    border-color: var(--lay-color-orange-6)!important;
    color: var(--lay-color-orange-6)!important
}

.dark .layui-border-green {
    border-color: var(--lay-color-layuigreen-6)!important;
    color: var(--lay-color-layuigreen-6)!important
}

.dark .layui-border-cyan {
    border-color: var(--lay-color-cyan-6)!important;
    color: var(--lay-color-cyan-6)!important
}

.dark .layui-border-blue {
    border-color: var(--lay-color-blue-6)!important;
    color: var(--lay-color-blue-6)!important
}

.dark .layui-border-purple {
    border-color: var(--lay-color-purple-6)!important;
    color: var(--lay-color-purple-6)!important
}

.dark .layui-border-black {
    border-color: var(--lay-color-black-6)!important;
    color: var(--lay-color-text-1)!important
}

.dark .layui-text {
    color: var(--lay-color-text-3)
}

.dark .layui-text-em,.dark .layui-word-aux {
    color: var(--lay-color-text-2)!important
}

.dark .layui-text a:not(.layui-btn) {
    color: var(--lay-color-lightblue-6)
}

.dark .layui-text blockquote:not(.layui-elem-quote) {
    border-left: 5px solid var(--lay-color-border-4)
}

.dark .layui-font-red {
    color: var(--lay-color-red-6)!important
}

.dark .layui-font-orange {
    color: var(--lay-color-orange-6)!important
}

.dark .layui-font-green {
    color: var(--lay-color-layuigreen-6)!important
}

.dark .layui-font-cyan {
    color: var(--lay-color-cyan-6)!important
}

.dark .layui-font-blue {
    color: var(--lay-color-lightblue-6)!important
}

.dark .layui-font-black {
    color: var(--lay-color-black)!important
}

.dark .layui-font-purple {
    color: var(--lay-color-purple-6)!important
}

.dark .layui-font-gray {
    color: var(--lay-color-gray-7)!important
}

.dark .layui-btn {
    border: 1px solid transparent;
    background-color: var(--lay-color-primary);
    color: var(--lay-color-text-1)
}

.dark .layui-btn:hover {
    color: var(--lay-color-text-2)
}

.dark .layui-btn-primary {
    border-color: var(--lay-color-border-2);
    color: var(--lay-color-text-1);
    background-color: var(--lay-color-bg-4)
}

.dark .layui-btn-primary:hover {
    border-color: transparent;
    color: var(--lay-color-text-2)
}

.dark .layui-btn-normal {
    background-color: var(--lay-color-normal)
}

.dark .layui-btn-warm {
    background-color: var(--lay-color-warning)
}

.dark .layui-btn-danger {
    background-color: var(--lay-color-danger)
}

.dark .layui-btn-checked {
    background-color: var(--lay-color-success)
}

.dark .layui-btn-disabled,.dark .layui-btn-disabled:active,.dark .layui-btn-disabled:hover {
    border-color: var(--lay-color-border-2)!important;
    background-color: var(--lay-color-bg-2)!important;
    color: var(--lay-color-text-4)!important
}

.dark .layui-btn-group .layui-btn {
    border-left: 1px solid var(--lay-color-border-2)
}

.dark .layui-btn-group .layui-btn-primary:hover {
    border-color: var(--lay-color-border-2);
    color: var(--lay-color-primary)
}

.dark .layui-btn-group .layui-btn-primary:first-child {
    border-left: 1px solid var(--lay-color-gray-5)
}

.dark .layui-input,.dark .layui-select,.dark .layui-textarea {
    background-color: var(--lay-color-fill-2);
    color: var(--lay-color-text-2)
}

.dark .layui-input:hover,.dark .layui-textarea:hover {
    border-color: var(--lay-color-border-2)!important
}

.dark .layui-input:focus,.dark .layui-textarea:focus {
    border-color: var(--lay-color-secondary-hover)!important;
    background-color: var(--lay-color-bg-2);
    box-shadow: 0 0 0 3px rgba(22,183,119,.08)
}

.dark .layui-input.layui-disabled,.dark .layui-input[disabled],.dark .layui-select[disabled],.dark .layui-textarea.layui-disabled,.dark .layui-textarea[disabled] {
    background-color: var(--lay-color-fill-1);
    color: var(--lay-color-text-4);
    border-color: var(--lay-color-border-1)!important;
    box-shadow: 0 0
}

.dark .layui-form-danger+.layui-form-select .layui-input,.dark .layui-form-danger:focus {
    border-color: var(--lay-color-danger)!important;
    box-shadow: 0 0 0 3px rgba(255,87,34,.08)
}

.dark .layui-input-prefix .layui-icon,.dark .layui-input-split .layui-icon,.dark .layui-input-suffix .layui-icon {
    color: var(--lay-color-gray-8)
}

.dark .layui-input-wrap .layui-input:hover+.layui-input-split {
    border-color: var(--lay-color-border-2)
}

.dark .layui-input-wrap .layui-input[disabled]:hover+.layui-input-split {
    border-color: var(--lay-color-border-1)
}

.dark .layui-input-wrap .layui-input:focus+.layui-input-split {
    border-color: var(--lay-color-secondary-hover)
}

.dark .layui-input-wrap .layui-input.layui-form-danger:focus+.layui-input-split {
    border-color: var(--lay-color-danger)
}

.dark .layui-input-affix .layui-icon {
    color: var(--lay-color-text-2)
}

.dark .layui-input-affix .layui-icon-clear {
    color: var(--lay-color-text-2)
}

.dark .layui-input-affix .layui-icon:hover {
    color: var(--lay-color-text-3)
}

.dark .layui-input-wrap .layui-input-number .layui-icon-up {
    border-bottom-color: var(--lay-color-border-1)
}

.dark .layui-input-wrap .layui-input[type=number].layui-input-number-out-of-range {
    color: var(--lay-color-danger)
}

.dark .layui-form-select {
    color: var(--lay-color-text-2)
}

.dark .layui-form-select .layui-edge {
    border-top-color: var(--lay-color-gray-8)
}

.dark .layui-form-select dl {
    border: 1px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-5);
    box-shadow: var(--lay-shadow-2)
}

.dark .layui-form-select dl dt {
    color: var(--lay-color-gray-8)
}

.dark .layui-form-select dl dd:hover {
    background-color: var(--lay-color-active)
}

.dark .layui-form-select dl dd.layui-select-tips {
    color: var(--lay-color-text-2)
}

.dark .layui-form-select dl dd.layui-this {
    background-color: var(--lay-color-active);
    color: var(--lay-color-text-1)
}

.dark .layui-form-select dl dd.layui-disabled,.dark .layui-form-select dl dd:hover.layui-disabled {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-select-none {
    color: var(--lay-color-black-8)
}

.dark .layui-select-disabled .layui-disabled {
    border-color: var(--lay-color-border-1)!important
}

.dark .layui-select-disabled .layui-edge {
    border-top-color: var(--lay-color-gray-6)
}

.dark .layui-form-checkbox {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-form-checkbox>div {
    background-color: var(--lay-color-fill-3);
    color: var(--lay-color-text-2)
}

.dark .layui-form-checkbox:hover>div {
    background-color: var(--lay-color-active)
}

.dark .layui-form-checkbox>i {
    background-color: var(--lay-color-fill-1);
    border-top-color: var(--lay-color-border-1);
    border-right-color: var(--lay-color-border-1);
    border-bottom-color: var(--lay-color-border-1);
    border-left-color: initial;
    color: var(--lay-color-text-1)
}

.dark .layui-form-checkbox:hover>i {
    border-color: var(--lay-color-border-2);
    color: var(--lay-color-text-4)
}

.dark .layui-form-checked,.dark .layui-form-checked:hover {
    border-color: var(--lay-color-secondary-active)
}

.dark .layui-form-checked:hover>div,.dark .layui-form-checked>div {
    background-color: var(--lay-color-secondary)
}

.dark .layui-form-checked:hover>i,.dark .layui-form-checked>i {
    color: var(--lay-color-secondary-hover)
}

.dark .layui-form-checkbox.layui-checkbox-disabled>div {
    background-color: var(--lay-color-fill-3)!important
}

.dark .layui-form-checkbox[lay-skin=primary] {
    background-image: none;
    background-color: initial;
    border-color: initial!important
}

.dark .layui-form-checkbox[lay-skin=primary]>div {
    background-image: none;
    background-color: initial;
    color: var(--lay-color-text-2)
}

.dark .layui-form-checkbox[lay-skin=primary]>i {
    border-color: var(--lay-color-border-1);
    background-color: var(--lay-color-fill-2)
}

.dark .layui-form-checkbox[lay-skin=primary]:hover>i {
    border-color: var(--lay-color-secondary-hover);
    color: var(--lay-color-text-1)
}

.dark .layui-form-checked[lay-skin=primary]>i {
    background-color: var(--lay-color-secondary);
    color: var(--lay-color-text-1);
    border-color: var(--lay-color-secondary-active)!important
}

.dark .layui-checkbox-disabled[lay-skin=primary]>div {
    background: 0 0!important;
    color: var(--lay-color-text-4)!important
}

.dark .layui-form-checked.layui-checkbox-disabled[lay-skin=primary]>i {
    background-color: var(--lay-color-fill-1)!important;
    border-color: var(--lay-color-border-2)!important
}

.dark .layui-checkbox-disabled[lay-skin=primary]:hover>i {
    border-color: var(--lay-color-border-1)
}

.dark .layui-form-checkbox[lay-skin=primary]>.layui-icon-indeterminate:before {
    background-color: var(--lay-color-secondary-hover);
    opacity: 1
}

.dark .layui-form-checkbox[lay-skin=primary]:hover>.layui-icon-indeterminate:before {
    opacity: 1
}

.dark .layui-form-checkbox[lay-skin=primary]>.layui-icon-indeterminate {
    border-color: var(--lay-color-secondary-hover)
}

.dark .layui-form-switch {
    border-color: var(--lay-color-border-2);
    background-color: var(--lay-color-fill-2)
}

.dark .layui-form-switch>i {
    background-color: var(--lay-color-gray-4)
}

.dark .layui-form-switch.layui-checkbox-disabled>i {
    background-color: var(--lay-color-gray-7)
}

.dark .layui-form-switch>div {
    color: var(--lay-color-gray-8)!important
}

.dark .layui-form-onswitch {
    border-color: var(--lay-color-secondary-active);
    background-color: var(--lay-color-secondary)
}

.dark .layui-form-onswitch>i {
    background-color: var(--lay-color-gray-4)
}

.dark .layui-form-onswitch>div {
    color: var(--lay-color-text-1)!important
}

.dark .layui-checkbox-disabled {
    border-color: var(--lay-color-border-2)!important
}

.dark .layui-checkbox-disabled>div {
    background-color: var(--lay-color-fill-3)!important;
    color: var(--lay-color-text-4)!important
}

.dark .layui-checkbox-disabled>i {
    border-color: var(--lay-color-border-2)!important
}

.dark .layui-checkbox-disabled:hover>i {
    color: var(--lay-color-text-1)!important
}

.dark .layui-form-switch.layui-checkbox-disabled>div {
    background-color: initial!important;
    color: var(--lay-color-text-3)!important
}

.dark .layui-form-checkbox>i:before {
    opacity: 0;
    filter: alpha(opacity=0)
}

.dark .layui-form-checkbox:hover>i:before {
    opacity: 1;
    filter: alpha(opacity=100)
}

.dark .layui-form-checked.layui-checkbox-disabled:hover>i:before,.dark .layui-form-checked:hover>i:before,.dark .layui-form-checked>i:before {
    opacity: 1;
    filter: alpha(opacity=100)
}

.dark .layui-form-checkbox[lay-skin=primary]:hover>i:before {
    opacity: 0;
    filter: alpha(opacity=0)
}

.dark .layui-form-checked[lay-skin=primary]:hover>i:before {
    opacity: 1;
    filter: alpha(opacity=100)
}

.dark .layui-checkbox-disabled:hover>i:before {
    opacity: 0;
    filter: alpha(opacity=0)
}

.dark .layui-form-radio>i {
    color: var(--lay-color-gray-8)
}

.dark .layui-form-radio:hover>*,.dark .layui-form-radioed,.dark .layui-form-radioed>i {
    color: var(--lay-color-secondary)
}

.dark .layui-radio-disabled>i {
    color: var(--lay-color-text-4)!important
}

.dark .layui-radio-disabled>* {
    color: var(--lay-color-text-4)!important
}

.dark .layui-form-pane .layui-form-label {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-laypage a,.dark .layui-laypage button,.dark .layui-laypage input,.dark .layui-laypage select,.dark .layui-laypage span {
    border: 1px solid var(--lay-color-border-2)
}

.dark .layui-laypage a,.dark .layui-laypage span {
    background-color: var(--lay-color-bg-2);
    color: var(--lay-color-text-2)
}

.dark .layui-laypage a[data-page] {
    color: var(--lay-color-text-2)
}

.dark .layui-laypage a:hover {
    color: var(--lay-color-primary)
}

.dark .layui-laypage .layui-laypage-spr {
    color: var(--lay-color-text-3)
}

.dark .layui-laypage .layui-laypage-curr em {
    color: var(--lay-color-white)
}

.dark .layui-laypage .layui-laypage-curr .layui-laypage-em {
    background-color: var(--lay-color-primary)
}

.dark .layui-laypage .layui-laypage-skip {
    color: var(--lay-color-text-3)
}

.dark .layui-laypage button,.dark .layui-laypage input {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-laypage input:focus,.dark .layui-laypage select:focus {
    border-color: var(--lay-color-primary)!important
}

.dark .layui-flow-more {
    color: var(--lay-color-text-1)
}

.dark .layui-flow-more a cite {
    background-color: var(--lay-color-bg-4);
    color: var(--lay-color-text-1)
}

.dark .layui-flow-more a i {
    color: var(--lay-color-text-2)
}

.dark .layui-table {
    background-color: var(--lay-color-bg-2);
    color: var(--lay-color-text-2)
}

.dark .layui-table-mend {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-table-click,.dark .layui-table-hover,.dark .layui-table[lay-even] tbody tr:nth-child(even) {
    background-color: var(--lay-color-fill-3)
}

.dark .layui-table-checked {
    background-color: var(--lay-color-fill-2);
    color: var(--lay-color-text-1)
}

.dark .layui-table-checked.layui-table-click,.dark .layui-table-checked.layui-table-hover {
    background-color: var(--lay-color-fill-3)
}

.dark .layui-table td,.dark .layui-table th,.dark .layui-table-col-set,.dark .layui-table-fixed-r,.dark .layui-table-grid-down,.dark .layui-table-header,.dark .layui-table-mend,.dark .layui-table-page,.dark .layui-table-tips-main,.dark .layui-table-tool,.dark .layui-table-total,.dark .layui-table-view,.dark .layui-table[lay-skin=line],.dark .layui-table[lay-skin=row] {
    border-color: var(--lay-color-border-2)
}

.dark .layui-table-view:after {
    background-color: var(--lay-color-border-2)
}

.dark .layui-table-view .layui-table td[data-edit]:hover:after {
    border: 1px solid var(--lay-color-primary-active)
}

.dark .layui-table-loading-icon .layui-icon {
    color: var(--lay-color-gray-8)
}

.dark .layui-table-page {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-table-tool {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-table-tool .layui-inline[lay-event] {
    color: var(--lay-color-text-3);
    border: 1px solid var(--lay-color-border-2)
}

.dark .layui-table-tool .layui-inline[lay-event]:hover {
    border: 1px solid var(--lay-color-border-3)
}

.dark .layui-table-tool-panel {
    color: var(--lay-color-text-1);
    border: 1px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-5);
    box-shadow: var(--lay-shadow-2)
}

.dark .layui-table-tool-panel li:hover {
    background-color: var(--lay-color-active)
}

.dark .layui-table-col-set {
    background-color: var(--lay-color-white)
}

.dark .layui-table-sort .layui-table-sort-asc {
    border-bottom-color: var(--lay-color-gray-8)
}

.dark .layui-table-sort .layui-table-sort-asc:hover {
    border-bottom-color: var(--lay-color-gray-11)
}

.dark .layui-table-sort .layui-table-sort-desc {
    border-top-color: var(--lay-color-gray-8)
}

.dark .layui-table-sort .layui-table-sort-desc:hover {
    border-top-color: var(--lay-color-gray-11)
}

.dark .layui-table-sort[lay-sort=asc] .layui-table-sort-asc {
    border-bottom-color: var(--lay-color-gray-13)
}

.dark .layui-table-sort[lay-sort=desc] .layui-table-sort-desc {
    border-top-color: var(--lay-color-gray-13)
}

.dark .layui-table-cell .layui-table-link {
    color: var(--lay-color-lightblue-5)
}

.dark .layui-table-body .layui-none {
    color: var(--lay-color-gray-8)
}

.dark .layui-table-fixed-l {
    box-shadow: 1px 0 8px #000
}

.dark .layui-table-fixed-r {
    box-shadow: -1px 0 8px #000
}

.dark .layui-table-edit {
    box-shadow: var(--lay-shadow-1);
    background-color: var(--lay-color-bg-2)
}

.dark .layui-table-edit:focus {
    border-color: var(--lay-color-secondary)!important
}

.dark select.layui-table-edit {
    border-color: var(--lay-color-border-2)
}

.dark .layui-table-grid-down {
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-gray-8)
}

.dark .layui-table-grid-down:hover {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-table-cell-c {
    background-color: var(--lay-color-gray-13);
    color: var(--lay-color-text-1);
    border-color: var(--lay-color-border-3)
}

.dark .layui-table-cell-c:hover {
    border-color: var(--lay-color-secondary-hover)
}

.dark body .layui-table-tips .layui-layer-content {
    box-shadow: var(--lay-shadow-3)
}

.dark .layui-table-tips-main {
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-3)
}

.dark .layui-table-tips-c {
    background-color: var(--lay-color-gray-13);
    color: var(--lay-color-text-1)
}

.dark .layui-table-tips-c:hover {
    background-color: var(--lay-color-gray-10)
}

.dark .layui-upload-choose {
    color: var(--lay-color-gray-8)
}

.dark .layui-upload-drag {
    border: 1px dashed var(--lay-color-border-2);
    background-color: var(--lay-color-bg-4);
    color: var(--lay-color-text-2)
}

.dark .layui-upload-drag .layui-icon {
    color: var(--lay-color-primary)
}

.dark .layui-upload-drag[lay-over] {
    border-color: var(--lay-color-primary)
}

.dark .layui-menu {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-menu li {
    color: var(--lay-color-text-1)
}

.dark .layui-menu li:hover {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-menu li.layui-disabled,.dark .layui-menu li.layui-disabled * {
    color: var(--lay-color-text-4)!important
}

.dark .layui-menu .layui-menu-item-group>.layui-menu-body-title {
    color: var(--lay-color-text-3)
}

.dark .layui-menu .layui-menu-item-none {
    color: var(--lay-color-text-3)
}

.dark .layui-menu .layui-menu-item-divider {
    border-bottom: 1px solid var(--lay-color-border-2)
}

.dark .layui-menu .layui-menu-item-divider:hover,.dark .layui-menu .layui-menu-item-group:hover,.dark .layui-menu .layui-menu-item-none:hover {
    background: 0 0
}

.dark .layui-menu .layui-menu-item-up>.layui-menu-body-title {
    color: var(--lay-color-text-1)
}

.dark .layui-menu .layui-menu-item-down:hover>.layui-menu-body-title>.layui-icon,.dark .layui-menu .layui-menu-item-up>.layui-menu-body-title:hover>.layui-icon {
    color: var(--lay-color-text-1)
}

.dark .layui-menu .layui-menu-item-checked,.dark .layui-menu .layui-menu-item-checked2 {
    background-color: var(--lay-color-active)!important;
    color: var(--lay-color-secondary)
}

.dark .layui-menu .layui-menu-item-checked a,.dark .layui-menu .layui-menu-item-checked2 a {
    color: var(--lay-color-secondary)
}

.dark .layui-menu .layui-menu-item-checked:after {
    border-right: 3px solid var(--lay-color-secondary)
}

.dark .layui-menu-body-title a {
    color: var(--lay-color-text-1)
}

.dark .layui-menu-lg .layui-menu-body-title a:hover,.dark .layui-menu-lg li:hover {
    color: var(--lay-color-secondary)
}

.dark .layui-dropdown {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-dropdown .layui-panel,.dark .layui-dropdown.layui-panel {
    background-color: var(--lay-color-bg-5);
    box-shadow: var(--lay-shadow-2)
}

.dark .layui-dropdown.layui-panel .layui-menu {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-nav {
    background-color: var(--lay-color-black-6);
    color: var(--lay-color-white)
}

.dark .layui-nav .layui-nav-item a {
    color: var(--lay-color-text-1)
}

.dark .layui-nav .layui-this:after,.dark .layui-nav-bar {
    background-color: var(--lay-color-secondary)
}

.dark .layui-nav .layui-nav-item a:hover,.dark .layui-nav .layui-this a {
    color: var(--lay-color-text-1)
}

.dark .layui-nav-child {
    box-shadow: var(--lay-shadow-2);
    border: 1px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-5)
}

.dark .layui-nav .layui-nav-child a {
    color: var(--lay-color-text-1)
}

.dark .layui-nav .layui-nav-child a:hover {
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-1)
}

.dark .layui-nav-child dd.layui-this {
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-1)
}

.dark .layui-nav-tree .layui-nav-child dd.layui-this,.dark .layui-nav-tree .layui-nav-child dd.layui-this a,.dark .layui-nav-tree .layui-this,.dark .layui-nav-tree .layui-this>a,.dark .layui-nav-tree .layui-this>a:hover {
    background-color: var(--lay-color-primary);
    color: var(--lay-color-white)
}

.dark .layui-nav-itemed>a,.dark .layui-nav-tree .layui-nav-title a,.dark .layui-nav-tree .layui-nav-title a:hover {
    color: var(--lay-color-white)!important
}

.dark .layui-nav-tree .layui-nav-bar {
    background-color: var(--lay-color-primary)
}

.dark .layui-nav-tree .layui-nav-child {
    background: 0 0;
    background-color: rgba(0,0,0,.3);
    border: none;
    box-shadow: none
}

.dark .layui-nav-tree .layui-nav-child a {
    color: var(--lay-color-white);
    color: var(--lay-color-text-1)
}

.dark .layui-nav-tree .layui-nav-child a:hover {
    background: 0 0;
    color: var(--lay-color-white)
}

.dark .layui-nav-tree.layui-bg-gray,.dark .layui-nav.layui-bg-gray {
    background-color: var(--lay-color-bg-2)!important;
    color: var(--lay-color-text-1)
}

.dark .layui-nav-tree.layui-bg-gray .layui-nav-child {
    background-color: rgba(0,0,0,.3)!important
}

.dark .layui-nav-tree.layui-bg-gray a,.dark .layui-nav.layui-bg-gray .layui-nav-item a {
    color: var(--lay-color-text-1)
}

.dark .layui-nav.layui-bg-gray .layui-nav-child {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-nav-tree.layui-bg-gray .layui-nav-itemed>a {
    color: var(--lay-color-text-1)!important
}

.dark .layui-nav.layui-bg-gray .layui-this a {
    color: var(--lay-color-secondary)
}

.dark .layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this,.dark .layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this a,.dark .layui-nav-tree.layui-bg-gray .layui-this,.dark .layui-nav-tree.layui-bg-gray .layui-this>a {
    color: var(--lay-color-secondary)!important
}

.dark .layui-nav-tree.layui-bg-gray .layui-nav-bar {
    background-color: var(--lay-color-secondary)
}

.dark .layui-breadcrumb a {
    color: var(--lay-color-gray-7)!important
}

.dark .layui-breadcrumb a:hover {
    color: var(--lay-color-secondary)!important
}

.dark .layui-breadcrumb a cite {
    color: var(--lay-color-gray-8)
}

.dark .layui-breadcrumb span[lay-separator] {
    color: var(--lay-color-gray-7)
}

.dark .layui-tab-title .layui-this {
    color: var(--lay-color-text-2)
}

.dark .layui-tab-title .layui-this:after {
    border-bottom-color: var(--lay-color-border-2)
}

.dark .layui-tab-bar {
    background-color: var(--lay-color-bg-3)
}

.dark .layui-tab-more li.layui-this:after {
    border-bottom-color: var(--lay-color-gray-3)
}

.dark .layui-tab-title li .layui-tab-close {
    color: var(--lay-color-gray-8)
}

.dark .layui-tab-title li .layui-tab-close:hover {
    background-color: var(--lay-color-danger);
    color: var(--lay-color-white)
}

.dark .layui-tab-brief>.layui-tab-title .layui-this {
    color: var(--lay-color-primary)
}

.dark .layui-tab-brief>.layui-tab-more li.layui-this:after,.dark .layui-tab-brief>.layui-tab-title .layui-this:after {
    border-bottom: 2px solid var(--lay-color-secondary)
}

.dark .layui-tab-card {
    box-shadow: var(--lay-shadow-1)
}

.dark .layui-tab-card>.layui-tab-title {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-tab-card>.layui-tab-title .layui-this {
    background-color: var(--lay-color-bg-1)
}

.dark .layui-tab-card>.layui-tab-title .layui-this:after {
    border-bottom-color: var(--lay-color-bg-1)
}

.dark .layui-tab-card>.layui-tab-more .layui-this {
    color: var(--lay-color-secondary)
}

.dark .layui-timeline-axis {
    background-color: var(--lay-color-bg-4);
    color: var(--lay-color-secondary)
}

.dark .layui-timeline-axis:hover {
    color: var(--lay-color-red-6)
}

.dark .layui-timeline-item:before {
    background-color: var(--lay-color-bg-3)
}

.dark .layui-badge,.dark .layui-badge-dot,.dark .layui-badge-rim {
    background-color: var(--lay-color-red-6);
    color: var(--lay-color-white)
}

.dark .layui-badge-rim {
    background-color: var(--lay-color-white);
    color: var(--lay-color-black-6)
}

.dark .layui-carousel {
    background-color: var(--lay-color-gray-2)
}

.dark .layui-carousel>[carousel-item]:before {
    color: var(--lay-color-gray-8);
    -moz-osx-font-smoothing: grayscale
}

.dark .layui-carousel>[carousel-item]>* {
    background-color: var(--lay-color-gray-2)
}

.dark .layui-carousel-arrow {
    background-color: rgba(0,0,0,.2);
    color: var(--lay-color-white)
}

.dark .layui-carousel-arrow:hover,.dark .layui-carousel-ind ul:hover {
    background-color: var(--lay-color-black)
}

.dark .layui-carousel[lay-indicator=outside] .layui-carousel-ind ul {
    background-color: var(--lay-color-black)
}

.dark .layui-carousel-ind ul {
    background-color: rgba(0,0,0,.2)
}

.dark .layui-carousel-ind ul li {
    background-color: var(--lay-color-gray-3);
    background-color: var(--lay-color-text-3)
}

.dark .layui-carousel-ind ul li:hover {
    background-color: var(--lay-color-white)
}

.dark .layui-carousel-ind ul li.layui-this {
    background-color: var(--lay-color-white)
}

.dark .layui-fixbar li {
    background-color: var(--lay-color-black-5);
    color: var(--lay-color-text-1)
}

.dark body .layui-util-face .layui-layer-content {
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-2)
}

.dark .layui-util-face ul {
    border: 1px solid var(--lay-color-border-3);
    background-color: var(--lay-color-bg-5);
    box-shadow: var(--lay-shadow-2)
}

.dark .layui-util-face ul li {
    border: 1px solid var(--lay-color-border-2)
}

.dark .layui-util-face ul li:hover {
    border: 1px solid var(--lay-color-red-7);
    background: var(--lay-color-text-1)
}

.dark .layui-code {
    border: 1px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-white);
    color: var(--lay-color-text-2)
}

.dark .layui-transfer-box,.dark .layui-transfer-header,.dark .layui-transfer-search {
    border-color: var(--lay-color-border-2)
}

.dark .layui-transfer-box {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-transfer-search .layui-icon-search {
    color: var(--lay-color-gray-8)
}

.dark .layui-transfer-active .layui-btn {
    background-color: var(--lay-color-secondary);
    border-color: var(--lay-color-secondary);
    color: var(--lay-color-white)
}

.dark .layui-transfer-active .layui-btn-disabled {
    background-color: var(--lay-color-gray-2);
    border-color: var(--lay-color-gray-3);
    color: var(--lay-color-gray-8)
}

.dark .layui-transfer-data li:hover {
    background-color: var(--lay-color-active)
}

.dark .layui-transfer-data li:hover:has([lay-filter=layTransferCheckbox][disabled]) {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-transfer-data .layui-none {
    color: var(--lay-color-gray-7)
}

.dark .layui-rate li i.layui-icon {
    color: var(--lay-color-orange-6)
}

.dark .layui-colorpicker {
    border: 1px solid var(--lay-color-border-1)
}

.dark .layui-colorpicker:hover {
    border-color: var(--lay-color-border-2)
}

.dark .layui-colorpicker-trigger-span {
    border: 1px solid var(--lay-color-border-1)
}

.dark .layui-colorpicker-trigger-i {
    color: var(--lay-color-white)
}

.dark .layui-colorpicker-trigger-i.layui-icon-close {
    color: var(--lay-color-black-7)
}

.dark .layui-colorpicker-main {
    background: var(--lay-color-bg-2);
    border: 1px solid var(--lay-color-border-2);
    box-shadow: var(--lay-shadow-2)
}

.dark .layui-colorpicker-basis-white {
    background: linear-gradient(90deg,#fff,hsla(0,0%,100%,0))
}

.dark .layui-colorpicker-basis-black {
    background: linear-gradient(0deg,#000,transparent)
}

.dark .layui-colorpicker-basis-cursor {
    border: 1px solid var(--lay-color-white)
}

.dark .layui-colorpicker-side {
    background: linear-gradient(linear-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red))
}

.dark .layui-colorpicker-side-slider {
    box-shadow: var(--lay-shadow-1);
    background: var(--lay-color-white);
    border: 1px solid var(--lay-color-gray-2)
}

.dark .layui-colorpicker-alpha-slider {
    box-shadow: var(--lay-shadow-1);
    background: var(--lay-color-white);
    border: 1px solid var(--lay-color-gray-2)
}

.dark .layui-colorpicker-pre.layui-this {
    box-shadow: var(--lay-shadow-1)
}

.dark .layui-colorpicker-pre.selected {
    box-shadow: var(--lay-shadow-1)
}

.dark .layui-colorpicker-main-input input.layui-input {
    color: var(--lay-color-text-2)
}

.dark .layui-slider {
    background: var(--lay-color-bg-5)
}

.dark .layui-slider-step {
    background: var(--lay-color-fill-4)
}

.dark .layui-slider-wrap-btn {
    background: var(--lay-color-bg-4)
}

.dark .layui-slider-tips {
    color: var(--lay-color-text-1);
    background: var(--lay-color-black);
    box-shadow: var(--lay-shadow-3)
}

.dark .layui-slider-tips:after {
    border-color: var(--lay-color-black) transparent transparent transparent
}

.dark .layui-slider-input {
    border: 1px solid var(--lay-color-border-1)
}

.dark .layui-slider-input-btn {
    border-left: 1px solid var(--lay-color-border-1)
}

.dark .layui-slider-input-btn i {
    color: var(--lay-color-gray-9)
}

.dark .layui-slider-input-btn i:first-child {
    border-bottom: 1px solid var(--lay-color-border-1)
}

.dark .layui-slider-input-btn i:hover {
    color: var(--lay-color-primary)
}

.dark .layui-tree-line .layui-tree-set .layui-tree-set:after {
    border-top: 1px dotted var(--lay-color-gray-7)
}

.dark .layui-tree-entry:hover {
    background-color: var(--lay-color-bg-4)
}

.dark .layui-tree-line .layui-tree-entry:hover {
    background-color: var(--lay-color-black)
}

.dark .layui-tree-line .layui-tree-entry:hover .layui-tree-txt {
    color: var(--lay-color-text-3)
}

.dark .layui-tree-entry:hover:has(span.layui-tree-txt.layui-disabled) {
    background-color: transparent!important
}

.dark .layui-tree-line .layui-tree-set:before {
    border-left: 1px dotted var(--lay-color-gray-7)
}

.dark .layui-tree-iconClick {
    color: var(--lay-color-gray-7)
}

.dark .layui-tree-icon {
    border: 1px solid var(--lay-color-gray-8)
}

.dark .layui-tree-icon .layui-icon {
    color: var(--lay-color-text-1)
}

.dark .layui-tree-iconArrow:after {
    border-color: transparent transparent transparent var(--lay-color-gray-7)
}

.dark .layui-tree-txt {
    color: var(--lay-color-text-2)
}

.dark .layui-tree-search {
    color: var(--lay-color-black-7)
}

.dark .layui-tree-btnGroup .layui-icon:hover {
    color: var(--lay-color-text-2)
}

.dark .layui-tree-editInput {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-tree-emptyText {
    color: var(--lay-color-text-2)
}

.dark .layui-code-view {
    border: 1px solid var(--lay-color-border-1)
}

.dark .layui-code-view:not(.layui-code-hl) {
    background-color: var(--lay-color-bg-2);
    color: var(--lay-color-text-2)
}

.dark .layui-code-header {
    border-bottom: 1px solid var(--lay-color-border-1);
    background-color: var(--lay-color-bg-2)
}

.dark .layui-code-header>.layui-code-header-about {
    color: var(--lay-color-text-2)
}

.dark .layui-code-view:not(.layui-code-hl) .layui-code-ln-side {
    border-color: var(--lay-color-border-1);
    background-color: var(--lay-color-bg-2)
}

.dark .layui-code-nowrap>.layui-code-ln-side {
    background: 0 0!important
}

.dark .layui-code-fixbar>span {
    color: var(--lay-color-text-3)
}

.dark .layui-code-fixbar>span:hover {
    color: var(--lay-color-secondary-hover)
}

.dark .layui-code-theme-dark,.dark .layui-code-theme-dark>.layui-code-header {
    border-color: rgba(126,122,122,.15);
    background-color: #1f1f1f
}

.dark .layui-code-theme-dark {
    border-width: 1px;
    color: #ccc
}

.dark .layui-code-theme-dark>.layui-code-ln-side {
    border-right-color: #2a2a2a;
    background: 0 0;
    color: #6e7681
}

.dark .layui-code-view.layui-code-hl>.layui-code-ln-side {
    background-color: transparent
}

.dark .layui-code-theme-dark.layui-code-hl,.dark .layui-code-theme-dark.layui-code-hl>.layui-code-ln-side {
    border-color: rgba(126,122,122,.15)
}

.dark .layui-code-full {
    background-color: var(--lay-color-bg-1)
}

.dark .layui-laydate-header i {
    color: var(--lay-color-gray-8)
}

.dark .laydate-day-holidays:before {
    color: var(--lay-color-red-6)
}

.dark .layui-laydate .layui-this .laydate-day-holidays:before {
    color: var(--lay-color-white)
}

.dark .layui-laydate-footer span {
    border: 1px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-5)
}

.dark .layui-laydate-footer span:hover {
    color: var(--lay-color-secondary)
}

.dark .layui-laydate-footer span.layui-laydate-preview {
    border-color: transparent!important
}

.dark .layui-laydate-footer span.layui-laydate-preview:hover {
    color: var(--lay-color-black-7)
}

.dark .layui-laydate-shortcut+.layui-laydate-main {
    border-left: 1px solid var(--lay-color-border-2)
}

.dark .layui-laydate .layui-laydate-list {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-laydate-hint {
    color: var(--lay-color-danger)
}

.dark .layui-laydate-range .laydate-main-list-1 .layui-laydate-content,.dark .layui-laydate-range .laydate-main-list-1 .layui-laydate-header {
    border-left: 1px solid var(--lay-color-border-2)
}

.dark .layui-laydate,.dark .layui-laydate-hint {
    border-color: var(--lay-color-border-2);
    box-shadow: var(--lay-shadow-3);
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-1)
}

.dark .layui-laydate {
    box-shadow: var(--lay-shadow-2)
}

.dark .layui-laydate-hint {
    border-color: var(--lay-color-border-1)
}

.dark .layui-laydate-header {
    border-bottom: 1px solid var(--lay-color-border-2)
}

.dark .layui-laydate-header i:hover,.dark .layui-laydate-header span:hover {
    color: var(--lay-color-secondary)
}

.dark .layui-laydate-content th {
    color: var(--lay-color-text-1)
}

.dark .layui-laydate-content td {
    color: var(--lay-color-text-1)
}

.dark .layui-laydate-content td.laydate-day-now {
    color: var(--lay-color-secondary)
}

.dark .layui-laydate-content td.laydate-day-now:after {
    border: 1px solid var(--lay-color-secondary)
}

.dark .layui-laydate-linkage .layui-laydate-content td.laydate-selected>div {
    background-color: var(--lay-color-green-8)
}

.dark .layui-laydate-linkage .laydate-selected:hover>div {
    background-color: var(--lay-color-green-8)!important
}

.dark .layui-laydate-content td>div:hover,.dark .layui-laydate-list li:hover,.dark .layui-laydate-shortcut>li:hover {
    background-color: var(--lay-color-fill-2);
    color: var(--lay-color-text-2)
}

.dark .layui-laydate-content td.laydate-disabled>div:hover {
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-4)
}

.dark .laydate-time-list li ol {
    border: 1px solid var(--lay-color-border-2)
}

.dark .laydate-time-list>li:hover {
    background: 0 0
}

.dark .layui-laydate-content .laydate-day-next,.dark .layui-laydate-content .laydate-day-prev {
    color: var(--lay-color-text-3)
}

.dark .layui-laydate-linkage .laydate-selected.laydate-day-next>div,.dark .layui-laydate-linkage .laydate-selected.laydate-day-prev>div {
    background: 0 0!important
}

.dark .layui-laydate-footer {
    border-top: 1px solid var(--lay-color-border-2)
}

.dark .layui-laydate-hint {
    color: var(--lay-color-danger)
}

.dark .laydate-day-mark::after {
    background-color: var(--lay-color-secondary)
}

.dark .layui-laydate-footer span[lay-type=date] {
    color: var(--lay-color-secondary)
}

.dark .layui-laydate .layui-this,.dark .layui-laydate .layui-this>div {
    background-color: var(--lay-color-secondary)!important;
    color: var(--lay-color-white)!important
}

.dark .layui-laydate .laydate-disabled,.dark .layui-laydate .laydate-disabled:hover {
    color: var(--lay-color-text-4)!important
}

.dark .layui-laydate .layui-this.laydate-disabled,.dark .layui-laydate .layui-this.laydate-disabled>div {
    background-color: var(--lay-color-fill-1)!important;
    color: var(--lay-color-text-4)!important
}

.dark .laydate-theme-molv .layui-laydate-header {
    background-color: var(--lay-color-primary)
}

.dark .laydate-theme-molv .layui-laydate-header i,.dark .laydate-theme-molv .layui-laydate-header span {
    color: var(--lay-color-gray-2)
}

.dark .laydate-theme-molv .layui-laydate-header i:hover,.dark .laydate-theme-molv .layui-laydate-header span:hover {
    color: var(--lay-color-white)
}

.dark .laydate-theme-molv .layui-laydate-content {
    border: 1px solid var(--lay-color-border-2)
}

.dark .laydate-theme-molv .layui-this,.dark .laydate-theme-molv .layui-this>div {
    background-color: var(--lay-color-primary)!important
}

.dark .laydate-theme-molv .layui-laydate-footer {
    border: 1px solid var(--lay-color-border-2)
}

.dark .laydate-theme-grid .laydate-month-list>li,.dark .laydate-theme-grid .laydate-year-list>li,.dark .laydate-theme-grid .layui-laydate-content td,.dark .laydate-theme-grid .layui-laydate-content thead {
    border: 1px solid var(--lay-color-border-2)
}

.dark .layui-laydate-linkage.laydate-theme-grid .laydate-selected,.dark .layui-laydate-linkage.laydate-theme-grid .laydate-selected:hover {
    background-color: var(--lay-color-gray-3)!important;
    color: var(--lay-color-primary)!important
}

.dark .layui-laydate-linkage.laydate-theme-grid .laydate-selected.laydate-day-next,.dark .layui-laydate-linkage.laydate-theme-grid .laydate-selected.laydate-day-prev {
    color: var(--lay-color-gray-6)!important
}

.dark .layui-laydate.laydate-theme-circle .layui-laydate-content table td.layui-this {
    background-color: transparent!important
}

.dark .layui-layer {
    background-color: var(--lay-color-bg-3);
    box-shadow: var(--lay-shadow-3)
}

.dark .layui-layer-border {
    border: 1px solid var(--lay-color-border-2);
    box-shadow: var(--lay-shadow-3)
}

.dark .layui-layer-move {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-layer-title {
    border-bottom: 1px solid var(--lay-color-border-2);
    color: var(--lay-color-text-1)
}

.dark .layui-layer-setwin span {
    color: var(--lay-color-text-1)
}

.dark .layui-layer-setwin .layui-layer-min:before {
    border-bottom-color: var(--lay-color-text-1)
}

.dark .layui-layer-setwin .layui-layer-min:hover:before {
    border-bottom-color: var(--lay-color-info-hover)
}

.dark .layui-layer-setwin .layui-layer-max:after,.dark .layui-layer-setwin .layui-layer-max:before {
    border: 1px solid var(--lay-color-text-3)
}

.dark .layui-layer-setwin .layui-layer-max:hover:after,.dark .layui-layer-setwin .layui-layer-max:hover:before {
    border-color: var(--lay-color-info-hover)
}

.dark .layui-layer-setwin .layui-layer-maxmin:after,.dark .layui-layer-setwin .layui-layer-maxmin:before {
    background-color: var(--lay-color-bg-5)
}

.dark .layui-layer-setwin .layui-layer-close2 {
    color: var(--lay-color-text-1);
    background-color: var(--lay-color-gray-10)
}

.dark .layui-layer-setwin .layui-layer-close2:hover {
    background-color: var(--lay-color-normal)
}

.dark .layui-layer-btn a {
    border: 1px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-3);
    color: var(--lay-color-text-2)
}

.dark .layui-layer-btn .layui-layer-btn0 {
    border-color: transparent;
    background-color: var(--lay-color-normal);
    color: var(--lay-color-text-1)
}

.dark .layui-layer-dialog .layui-layer-content .layui-layer-face {
    color: var(--lay-color-gray-9)
}

.dark .layui-layer-dialog .layui-layer-content .layui-icon-tips {
    color: var(--lay-color-warning)
}

.dark .layui-layer-dialog .layui-layer-content .layui-icon-success {
    color: var(--lay-color-success)
}

.dark .layui-layer-dialog .layui-layer-content .layui-icon-error {
    top: 19px;
    color: var(--lay-color-danger)
}

.dark .layui-layer-dialog .layui-layer-content .layui-icon-question {
    color: var(--lay-color-warning)
}

.dark .layui-layer-dialog .layui-layer-content .layui-icon-lock {
    color: var(--lay-color-gray-10)
}

.dark .layui-layer-dialog .layui-layer-content .layui-icon-face-cry {
    color: var(--lay-color-danger)
}

.dark .layui-layer-dialog .layui-layer-content .layui-icon-face-smile {
    color: var(--lay-color-success)
}

.dark .layui-layer-rim {
    border: 6px solid var(--lay-color-gray-8);
    border: 6px solid var(--lay-color-border-2)
}

.dark .layui-layer-msg {
    border: 1px solid var(--lay-color-border-1)
}

.dark .layui-layer-hui {
    background-color: var(--lay-color-bg-3);
    color: var(--lay-color-text-1)
}

.dark .layui-layer-hui .layui-layer-close {
    color: var(--lay-color-white)
}

.dark .layui-layer-loading-icon {
    color: var(--lay-color-gray-9)
}

.dark .layui-layer-loading-2:after,.dark .layui-layer-loading-2:before {
    border: 3px solid var(--lay-color-gray-6)
}

.dark .layui-layer-loading-2:after {
    border-color: transparent;
    border-left-color: var(--lay-color-normal)
}

.dark .layui-layer-tips .layui-layer-content {
    box-shadow: var(--lay-shadow-3);
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-1)
}

.dark .layui-layer-tips i.layui-layer-TipsG {
    border-color: transparent
}

.dark .layui-layer-tips i.layui-layer-TipsB,.dark .layui-layer-tips i.layui-layer-TipsT {
    border-right-color: var(--lay-color-black)
}

.dark .layui-layer-tips i.layui-layer-TipsL,.dark .layui-layer-tips i.layui-layer-TipsR {
    border-bottom-color: var(--lay-color-black)
}

.dark .layui-layer-lan .layui-layer-title {
    background: var(--lay-color-blue-5);
    color: var(--lay-color-text-1)
}

.dark .layui-layer-lan .layui-layer-btn {
    border-top: 1px solid var(--lay-color-border-3)
}

.dark .layui-layer-lan .layui-layer-btn a {
    background: var(--lay-color-white);
    border-color: var(--lay-color-border-3);
    color: var(--lay-color-black-7)
}

.dark .layui-layer-lan .layui-layer-btn .layui-layer-btn1 {
    background: var(--lay-color-gray-7)
}

.dark .layui-layer-molv .layui-layer-title {
    background: var(--lay-color-layuigreen-6);
    color: var(--lay-color-text-1)
}

.dark .layui-layer-molv .layui-layer-btn a {
    background: var(--lay-color-layuigreen-6);
    border-color: var(--lay-color-layuigreen-6)
}

.dark .layui-layer-molv .layui-layer-btn .layui-layer-btn1 {
    background: var(--lay-color-gray-7)
}

.dark .layui-layer-prompt .layui-layer-input {
    border: 1px solid var(--lay-color-border-2);
    color: var(--lay-color-text-2)
}

.dark .layui-layer-tab {
    box-shadow: var(--lay-shadow-3)
}

.dark .layui-layer-tab .layui-layer-title span.layui-this {
    border-left: 1px solid var(--lay-color-border-2);
    border-right: 1px solid var(--lay-color-border-2);
    background-color: var(--lay-color-bg-3)
}

.dark .layui-layer-photos {
    background: 0 0;
    box-shadow: none
}

.dark .layui-layer-photos-next,.dark .layui-layer-photos-prev {
    color: var(--lay-color-gray-9)
}

.dark .layui-layer-photos-next:hover,.dark .layui-layer-photos-prev:hover {
    color: var(--lay-color-text-1)
}

.dark .layui-layer-photos-toolbar {
    background-color: #333\9;
    background-color: var(--lay-color-bg-5);
    color: var(--lay-color-text-1)
}

.dark .layui-layer-photos-toolbar * {
    color: var(--lay-color-text-1)
}

.dark .layui-layer-photos-toolbar a:hover {
    color: var(--lay-color-text-2)
}

.dark .layui-layer-photos-header>span:hover {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-layer-tips i.layui-layer-TipsB,.dark .layui-layer-tips i.layui-layer-TipsT {
    border-right-color: var(--lay-color-bg-5)
}

.dark .layui-layer-tips i.layui-layer-TipsL,.dark .layui-layer-tips i.layui-layer-TipsR {
    border-bottom-color: var(--lay-color-bg-5)
}

.dark .layui-layer-prompt .layui-layer-input {
    border: 1px solid var(--lay-color-border-2);
    color: var(--lay-color-text-1);
    background-color: var(--lay-color-black)
}

.dark .layui-layer-prompt .layui-layer-input:focus {
    outline: 0
}

.dark .layui-layer-loading {
    background: 0 0;
    box-shadow: 0 0
}

.dark .layui-btn-primary {
    border-color: transparent
}

.dark .layui-btn-group .layui-btn:first-child {
    border-left: none
}

.dark .layui-btn-group .layui-btn-primary:hover {
    border-top-color: transparent;
    border-bottom-color: transparent
}

.dark .layui-menu li:hover {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-nav-child dd.layui-this {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-nav .layui-nav-child a:hover {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-nav .layui-nav-item a:hover,.dark .layui-nav .layui-this a {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-nav-child dd.layui-this {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-tab-card>.layui-tab-title .layui-this:after,.dark .layui-tab-title .layui-this:after {
    border-bottom-color: var(--lay-color-bg-1)
}

.dark .layui-form-select dl dd:hover {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-form-select dl dd.layui-this {
    background-color: var(--lay-color-fill-2)
}

.dark .layui-laypage button {
    color: var(--lay-color-text-1)
}

.dark .layui-table[lay-even] tbody tr:nth-child(even) {
    background-color: var(--lay-color-fill-4)
}

.dark .layui-menu .layui-menu-item-checked,.dark .layui-menu .layui-menu-item-checked2 {
    background-color: var(--lay-color-fill-2)!important
}

.dark .layui-input-split {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-input-wrap .layui-input-prefix.layui-input-split {
    border-width: 1px
}

.dark .layui-input-wrap .layui-input-split:has(+.layui-input:hover) {
    border-color: var(--lay-color-border-2)
}

.dark .layui-input-wrap .layui-input-split:has(+.layui-input:focus) {
    border-color: var(--lay-color-secondary-hover)
}

.dark .layui-layer-tab .layui-layer-title span:first-child {
    border-left: none!important
}

.dark .layui-slider-input .layui-input,.dark .layui-slider-input.layui-input {
    background-color: var(--lay-color-bg-2)
}

:root.dark {
    --lay-color-black-1: #d1d1d1;
    --lay-color-text-1: rgba(255,255,255,.8)
}

html.dark {
    background-color: var(--lay-color-bg-1);
    color: var(--lay-color-text-2);
    color-scheme: dark
}

.dark a {
    color: var(--lay-color-text-1)
}

.dark iframe {
    background-color: transparent;
    color-scheme: light
}

.layui-code-preview iframe {
    color-scheme: dark
}

.dark .layui-code,.dark pre>code {
    background-color: var(--lay-color-bg-2)
}

.dark .layui-btn-primary {
    border-color: transparent!important
}

.dark .layui-border-black {
    color: var(--lay-color-text-1)!important
}

.dark .layui-nav-tree.layui-bg-gray a,.dark .layui-nav.layui-bg-gray .layui-nav-item a {
    color: var(--lay-color-black-1)
}

.dark .layui-nav .layui-nav-item a:hover,.dark .layui-nav .layui-this a {
    background: 0 0;
    color: #16b777
}

.dark .layui-card-body {
    color: rgba(255,255,255,.7)
}

.dark .layui-table-page .layui-laypage a,.dark .layui-table-page .layui-laypage span {
    border: none
}

.dark .layui-carousel,.dark .layui-carousel>[carousel-item]>* {
    background: 0 0
}

.dark .ws-bg-light,.dark .ws-header-menu .layui-nav.ws-bg-light {
    background-color: var(--lay-color-bg-1)!important
}

.dark .ws-header:after {
    background-color: var(--lay-color-border-1)
}

.dark .ws-header-menu .layui-nav.layui-bg-gray .layui-nav-child {
    background-color: var(--lay-color-bg-5)
}

.dark .ws-header-menu .layui-nav.layui-bg-gray .layui-nav-child dd:hover a {
    background-color: var(--lay-color-fill-2);
    color: var(--lay-color-black-1)
}

.dark .ws-header-theme .layui-form-onswitch {
    border-color: var(--lay-color-border-1);
    background: 0 0
}

.dark .ws-dir:before,.dark .ws-docs-icon>div,.dark .ws-index-idea>div>div,.dark .ws-text h1 {
    border-color: var(--lay-color-border-1)
}

.dark .ws-container .layui-menu,.dark .ws-container .layui-panel {
    background: 0 0
}

.dark .ws-docs-icon>div .docs-icon-fontclass {
    color: var(--lay-color-black-4)
}

.dark .ws-docs-anim>div:hover,.dark .ws-docs-icon>div:hover {
    background-color: var(--lay-color-bg-3)
}

.dark .ws-docs-anim>div:hover {
    color: var(--lay-color-text-1)
}

.dark .flow-demo li,.dark .ws-text code:not(.layui-code,.layui-code-wrap) {
    background-color: var(--lay-color-bg-2)!important
}

.dark .ws-space-16 {
    border: none!important
}

.dark .layui-code-preview div[carousel-item]>:nth-child(2n) {
    background-color: #16b777
}

.dark .layui-code-preview div[carousel-item]>:nth-child(2n+1) {
    background-color: #16baaa
}

.dark .ws-sponsor-wrapper>div,.dark .ws-sponsor-wrapper>div a {
    background-color: #999;
    color: #333
}

.dark .ws-sponsor-show {
    color: var(--lay-color-text-1)
}

.dark .ws-sponsor-show:hover {
    color: #333
}

.dark .ws-sponsor-full {
    background-color: var(--lay-color-bg-1)
}

.dark body .wwads-horizontal,.dark body .wwads-vertical {
    background-color: var(--lay-color-fill-1)!important
}

.dark body .wwads-content .wwads-text,.dark body .wwads-horizontal .wwads-text {
    color: #fff!important
}

.dark .layui-code-preview .layui-bg-gray,.dark .ws-anchor .layui-badge-rim,.dark .ws-text h2 .layui-badge-rim,.dark .ws-text-notes .layui-badge-rim {
    background-color: var(--lay-color-fill-2)!important
}

.dark .ws-anchor .layui-badge-rim,.dark .ws-text h2 .layui-badge-rim,.dark .ws-text-notes .layui-badge-rim {
    color: var(--lay-color-text-3)
}

.dark .laytpl-demo,.dark .laytpl-demo>div:first-child,.dark .laytpl-demo>textarea {
    background: 0 0!important
}

.dark .ws-play-header {
    border: none
}

.dark .ws-play .ws-banner-showcase,.dark .ws-play-split {
    background: 0 0;
    border-color: var(--lay-color-border-1)!important
}

.dark .ws-footer-fixed:after {
    background-color: var(--lay-color-border-1)!important
}

.dark .ws-play-preview>iframe {
    color-scheme: light;
    background-color: #fff
}

@media screen and (max-width: 991.98px) {
    .dark .ws-search .layui-input {
        background:0 0
    }

    .dark .ws-search .layui-input::-webkit-input-placeholder {
        color: var(--lay-color-text-3)
    }

    .dark .ws-container .layui-panel,.dark .ws-side-show .ws-side {
        background-color: var(--lay-color-bg-2)
    }

    .dark .ws-dir-ul li,.dark .ws-side-show .ws-side:before {
        color: var(--lay-color-text-4)
    }
}

@media screen and (max-width: 767.98px) {
    .dark .ws-header-menu .layui-nav {
        box-shadow:0 1px 1px rgb(255 255 255 / 5%)
    }

    .dark .ws-footer {
        background: 0 0
    }
}


.layui-elem-quote {
    border-left: 5px solid #1262ed;
}
footer.footer.mobanscxq {
    margin-top: 2rem;
}
.layui-text blockquote:not(.layui-elem-quote) {
    margin: 15px 0;
    margin-bottom: 10px;
    padding: 15px;
    line-height: 1.8;
    border-left: 5px solid #0260ed;
    border-radius: 0 2px 2px 0;
    background-color: #fafafa;
}

.ws-text code:not(.layui-code,.layui-code-wrap) {
    color: #000;
    background-color: #e1f0ff94;
    border-radius: 4px;
}
.layui-form-label {
    float: none;
    width: 100%;
    text-align: left;
    padding: 9px 12px;
}
.layui-form-item .layui-input-inline {
    width: 100% !important;
    float: none;
    margin-right: 0 !important;
    left: 0;
    margin-left: 0 !important;
}
.layui-input-block {
    width: 100%;
    margin-left: 0;
}
.comment-content {
    font-size: 16px;
    margin: 10px 0;
}
.comment-item {
    margin: 20px 0;
    border-bottom: 1px solid #f8f8f8;
    padding-bottom: 20px;
}
.comment-control {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}
/*.comment-control a:last-child {*/
/*    margin-left: 20px;*/
/*}*/


.layui-text.ws-text table {
    width: 100%;
    background-color: #fff;
    color: #666
}

.layui-text.ws-text table tr {
    transition: all .3s;
    -webkit-transition: all .3s
}

.layui-text.ws-text table th {
    text-align: left;
    font-weight: 400
}

.layui-text.ws-text table tbody tr:hover,
.layui-text.ws-text table thead tr {
    background-color: #f6f6f7
}

.layui-text.ws-text table td,
.layui-text.ws-text table th {
    border-width: 1px;
    border-style: solid;
    border-color: #eee
}

.layui-text.ws-text table td,
.layui-text.ws-text table th {
    position: relative;
    padding: 8px 16px;
    min-height: 20px;
    line-height: 20px;
    font-size: 14px
}

.layui-text.ws-text tr:nth-child(2n) {
    background-color: #f5f6f7;
}

.layui-text.ws-text table img {
    max-width: 100px
}

.plan {
    padding: 30px 0;
}

.plan h1 {
    font-size: 36px;
    color: #000000;
    text-align: center;
}
.plan p {
    text-align: center;
    color: #141727;
    font-size: 16px;
}

.plan-flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.plan-item {
    width: 32%;
    margin-top: 60px;
    position: relative;
    background-color: #fff;
    padding: 2rem;
    border-radius: 4px;
    clear: both;
    overflow: hidden;
    margin-bottom: 30px;
    border: 1px solid #f4f4ff !important;
    border-width: 2px !important;
}
.plan-item h2 {
    font-size: 1.25rem;
    position: relative;
    margin-bottom: 30px !important;
}

.plan-item h2:after {
    position: absolute;
    display: block;
    content: '';
    width: 32px;
    bottom: -20px;
    left: 0;
    border-top: solid 2px #dde8f5;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}
.plan-item:hover h2:after {
    left: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
}
.plan-item p:nth-child(2) {
    text-align: left;
    font-size: 15px;
    margin-bottom: 10px;
    color: #212733;
    margin-top: 40px;
}
.plan-item ul {
    padding-left: 15px;
}
.plan-item ul li {
    list-style: circle;
    line-height: 1.5;
    color: #383e6b;
    margin-bottom: 10px;
}

.plan-item:hover {
    box-shadow: 0 0 0px #0000, 0 0 0px #0000, 2px 3px 20px rgba(0, 0, 0, .16);
}
.plan-item p:last-child {
    font-size: 1.5rem !important;
    color: #d6064c;
    font-weight: 600;
    text-align: left;
    margin-top: 20px;
}
.plan-tips span {
    color: #d6064c;
}
.plan-tips p {
    text-align: left;
}
.explaintable {
    margin: 30px 0 0;
}
.price-table th {
    padding-top: 20px;
    padding-bottom: 30px;
    text-align: center;
    font-size: 18px;
}

.price-table th:nth-child(1) {
    border-top: 8px solid #ccc;
}

.price-table th:nth-child(2) {
    border-top: 8px solid #312a91;
}

.price-table th:nth-child(3) {
    border-top: 8px solid #3384ae;
}

.price-table th:nth-child(4) {
    border-top: 8px solid #f70;
}

.price-table th:nth-child(5) {
    border-top: 8px solid #f70;
}

.price-table th:nth-child(6) {
    border-top: 8px solid #f70;
}

.price-table th:nth-child(7) {
    border-top: 8px solid #f70;
}

.price-table th .table-tag {
    display: inline-block;
    font-size: 12px;
    background-color: #e2b819;
    border-radius: 20px;
    color: #fff;
    padding: 3px 10px;
    margin-bottom: 10px;
}

.price-table th .table-tag.none {
    background-color: transparent;
}

.price-table th h5 {
    margin-top: 10px;
    color: #f50;
    font-size: 22px;
}

.price-table td {
    text-align: center;
    line-height: 1.8;
}

.price-table td p {
    text-align: left;
    margin-bottom: 10px;
}

.price-table .bg-table {
    background-color: #eee;
}

.plan-flex.explaininner {
    justify-content: center;
    gap: 30px;
}
.comparison-section {
    position: relative;
    background-color: #fff;
    padding: 2rem;
    border-radius: 4px;
    clear: both;
    overflow: hidden;
    margin-bottom: 30px;
    border: 1px solid #f4f4ff !important;
    border-width: 2px !important;
}
.comparison-header h2 {
    font-size: 1.25rem;
    position: relative;
    margin-bottom: 1.5rem;
}



.comparison-section:hover {
    box-shadow: 0 0 0px #0000, 0 0 0px #0000, 2px 3px 20px rgba(0, 0, 0, .16);
}

.comparison-wrapper {
  font-family: 'Segoe UI', Roboto, sans-serif;
  color: #333;
  line-height: 1.6;
}

/* 表格整体样式 */
.comparison-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: white;
    overflow: hidden;
}

/* 表头样式 */
.comparison-table thead th {
  background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
  color: white;
  padding: 18px 15px;
  text-align: left;
  font-weight: 600;
  font-size: 16px;
  position: relative;
}

.comparison-table thead th:first-child {
  border-top-left-radius: 12px;
}

.comparison-table thead th:last-child {
  border-top-right-radius: 12px;
}

/* 表体样式 */
.comparison-table tbody td {
  padding: 15px;
  border-bottom: 1px solid #f0f0f0;
  vertical-align: middle;
}

/* 功能名称列特殊样式 */
.comparison-table .feature-name {
  font-weight: 500;
  background-color: #f9fafc;
  width: 25%;
}

/* 交替行背景色 */
.comparison-table tbody tr:nth-child(even) td:not(.feature-name) {
  background-color: #fcfdfe;
}

/* 图标样式统一 */
.comparison-table .yes .fas,
.comparison-table .no .fas {
  display: inline-block;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  text-align: center;
  line-height: 22px;
  margin-right: 5px;
  font-size: 12px;
}

.comparison-table .yes .fas {
  background-color: #2ecc71;
  color: white;
}

.comparison-table .no .fas {
  background-color: #e74c3c;
  color: white;
}

/* 有限功能特殊标记 */
.comparison-table .limited {
  color: #f39c12;
  font-weight: 500;
  position: relative;
  padding-left: 20px;
}

.comparison-table .limited:before {
  content: "!";
  display: inline-block;
  width: 18px;
  height: 18px;
  background-color: #f39c12;
  color: white;
  border-radius: 50%;
  text-align: center;
  line-height: 18px;
  font-size: 12px;
  position: absolute;
  left: -5px;
  top: 50%;
  transform: translateY(-50%);
}

/* 推荐标签样式 */
.comparison-table .recommended-tag {
  background: #e74c3c;
  color: white;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  margin-left: 8px;
  display: inline-block;
  transform: translateY(-2px);
}

/* 悬停效果 */
.comparison-table tbody tr:hover td {
  background-color: #f5f9ff !important;
}


.advantages-section {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin: 60px auto;
}
.advantage-card {
    border: 1px solid #f4f4ff !important;
    padding: 2rem;
    transition: all 0.3s ease;
    background-color: #fff;
}
.advantage-card:hover {
  box-shadow: 0 0 0px #0000, 0 0 0px #0000, 2px 3px 20px rgba(0, 0, 0, .16);
  transform: translateY(-5px);
}

.advantage-card h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 15px;
  color: #000;
  position: relative;
  padding-bottom: 10px;
}

.advantage-card h3::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 40px;
  height: 2px;
  background-color: #000;
}
.advantage-card p {
    color: #383e6b;
    font-size: 15px;
    margin: 0;
    text-align: left;
}
/* CTA区域 */
.cta-section {
  background-color: #f8f8f8;
  padding: 70px 20px;
  text-align: center;
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
}

.cta-content {
  max-width: 800px;
  margin: 0 auto;
}

.cta-content h2 {
  font-size: 28px;
  font-weight: 500;
  margin-bottom: 20px;
  color: #000;
}
.cta-content p {
    color: #383e6b;
    font-size: 16px;
    margin-bottom: 30px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.cta-btn {
  display: inline-block;
  padding: 12px 30px;
  background-color: #000;
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  border: 1px solid #000;
  transition: all 0.3s ease;
}

.cta-btn:hover {
  background-color: transparent;
  color: #000;
}
td.custom span.recommend {
    background: #d6064c;
    color: #ffffff;
    padding: 4px 6px;
    border-radius: 10px;
}
.faq-container {
    max-width: 650px;
    margin: 0 auto;
    padding: 60px 0 30px;
}
.faq-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f4f4ff !important;
    padding-bottom: 15px;
    margin-bottom: 15px;
}
.faq-title i {
    font-size: 36px;
    line-height: 1;
}
.faq-item {
    margin-bottom: 0px;
}
.faq-item:last-child {
    margin-bottom: 0;
}
.faq-content p {
    text-align: left;
    font-size: 16px;
    margin: 1em 0;
    color: #383e6b;
}
.faq-content ul {
    padding-left: 20px;
}
.faq-content ul li {
    list-style: circle;
    line-height: 1.5;
    color: #383e6b;
    margin-bottom: 10px;
    font-size: 16px;
}
.faq-title h2 {
    font-size: 18px;
    position: relative;
    font-weight: 400;
    color: #131727;
}
.faq-content {
    max-height: 0;
    overflow: hidden;
}
.faq-item.active .faq-content {
            max-height: 100%;
            margin-bottom: 30px;
}
.faq-item.active .faq-title i {
            transform: rotate(180deg);
}

.faq-content p:first-child {
    margin-top: 0;
}

.faq-content a {
    font-size: 16px;
    color: #d6064c;
}










@media (max-width: 768px){

.hua-navbar img {
    width: 10vw;
}
.hua-navbar .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 12vw;
        width: 100%;
    }
    .nav-right li {
    margin: 0;
}
    .nav-right {
        font-size: 0;
        width: 20%;
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
        .nav-right .nav-button {
        display: block;
        margin-top: 0;
    }
    .copyright a {
    display: block;
}
.copyright span {
    display: block;
}
.sp-title p {
    font-size: 4.2vw;
}

.sp-title span {
    font-size: 3.4vw;
}

.sp-title a {
    margin-top: 3%;
    padding: 0 6vw;
}
.copyright {
    text-align: center;
    padding: 3vw 14vw;
}
.linkyl-flex {
    display: none;
    justify-content: center;
}
.anqicms-left {
    display: none;
}
.anqicms-right {
    width: 100%;
    float: none;
    margin-left: 0;
}
.baike_right {
    display: none;
}

.plan {
    padding: 0rem 0 1rem;
}
.plan h1 {
    font-size: 5.4vw;
}

.plan p {
    font-size: 3.74vw;
}

.plan-item {
    width: 100%;
    margin: 4vw 0;
    padding: 6vw;
}

.plan-item h2 {
    margin-bottom: 6vw !important;
    font-size: 4.8vw;
}
.plan-item p:nth-child(2) {
    font-size: 3.74vw;
    margin-top: 10vw;
    margin-bottom: 3vw;
}
.plan-item ul {
    padding-left: 5vw;
}
.plan-item ul li {
    font-size: 3.74vw;
    margin-bottom: 3vw;
}
.plan-item p:last-child {
    font-size: 5.4vw;
    margin-top: 4vw;
}
.plan-flex.explaininner {
    gap: unset;
}
.comparison-section {
    padding: 0;
    border: none !important;
    margin-bottom: 0;
}
.comparison-header h2 {
    font-size: 4.8vw;
    padding: 0 6vw 5vw;
    text-align: center;
    margin-bottom: 0;
}
.explaintable {
    margin: 4vw 0;
}
.comparison-table thead th {
    font-size: 3.4vw;
    padding: 3vw;
    text-align: center;
}
.comparison-table tbody td {
    padding: 3vw;
    font-size: 3.4vw;
    border-right: 1px solid #f0f0f0;
}
.comparison-table tbody td:first-child {
    border-left: 1px solid #f0f0f0;
}
.comparison-section:hover {
    box-shadow: unset;
}
.advantages-section {
    gap: unset;
    margin: 6vw 0;
}
td.custom span.recommend {
    font-size: 3.4vw;
    color: #d6064c;
    background: unset;
    padding: 0;
}
.advantage-card:first-child {
    margin-top: 0;
}
.advantage-card h3 {
    font-size: 4.8vw;
    margin-bottom: 4vw;
    padding-bottom: 4vw;
}
.advantage-card p {
    font-size: 3.74vw;
}
.cta-section {
    padding: 6vw 3vw;
}
.cta-content h2 {
    font-size: 5.4vw;
    margin-bottom: 4vw;
}
.cta-content p {
    max-width: 100%;
    margin-bottom: 6vw;
}
.cta-btn {
    padding: 3vw 6vw;
    font-size: 3.74vw;
}


.section-bg {
    width: 100%;
    overflow: hidden;
    padding: 4vw  0 1rem;
}

.advantage-card {
    margin: 3vw 0;
}
.faq-container {
    max-width: 100%;
    padding: 0;
    margin: 6vw 0;
}
.faq-title h2 {
    font-size: 4.2vw;
    line-height: 1;
}
.faq-title {
    padding-bottom: 3vw;
    margin-bottom: 3vw;
}
.faq-title i {
    font-size: 8vw;
}
.faq-content ul li {
    font-size: 3.74vw;
    margin: 1em 0;
}
.faq-item.active .faq-content {
    margin-bottom: 4vw;
}

.faq-content a {
    font-size: 3.74vw;
    color: #d6064c;
}








}