#footer-tools [data-v-db6ccf64][data-v-41ba7e2c]{top:unset!important;bottom:0!important;right:44px!important}
.io.icon-fw,.iconfont.icon-fw {
    width: 1.15em;
}
.io.icon-lg,.iconfont.icon-lg{
    font-size: 1.5em;
    line-height: .75em;
    vertical-align: -.125em;
}
.screenshot-carousel .img_wrapper a{display:contents}
.fancybox-slide--iframe .fancybox-content{max-width :1280px;margin:0}
.fancybox-slide--iframe.fancybox-slide{padding:44px 0}
.navbar-nav .menu-item-794 a{background: #ff8116;border-radius: 50px!important;padding: 5px 10px!important;margin: 5px 0!important;color: #fff!important;}
.navbar-nav .menu-item-794 a i{position: absolute;top: 0;right: -10px;color: #f13522;}
.io-black-mode .navbar-nav .menu-item-794 a{background: #ce9412;}
.io-black-mode .navbar-nav .menu-item-794 a i{color: #fff;}
.zerofoam-ad2,
.zerofoam-ad3 {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 24px;
}

.zerofoam-ad2 .zerofoam-grid {
	display: grid;
	grid-column: span 4;
}

.zerofoam-ad2 .zerofoam-grid .zerofoam-section {
	
}

.zerofoam-ad2 .zerofoam-title {
	display: flex;
	gap: 24px;
	align-items: center;
	margin-bottom: 16px;
}

.zerofoam-ad2 .zerofoam-content {
	flex: 1;
	overflow-x: auto;
	scrollbar-width: none;
}

.zerofoam-ad2 .zerofoam-title .zerofoam-listad {
	display: flex;
	gap: 8px;
	align-items: center;
}

.zerofoam-ad2 .zerofoam-title .zerofoam-listad h4 {
	font-weight: 600;
}

.zerofoam-ad2 .zerofoam-title .zerofoam-more {
	color: #7f8792;
	white-space: nowrap;
}

.zerofoam-ad2 .zerofoam-grid .zerofoam-section .zerofoam-list {
	display: grid;
	grid-template-rows: auto 56px;
	grid-template-columns: repeat(auto-fill, minmax(164px, 1fr));
	gap: 8px;
	height: 120px;
	padding: 8px;
	overflow: hidden;
	background: #f6f7f9;
	border-radius: 12px;
}

.zerofoam-ad2 .zerofoam-grid .zerofoam-section .zerofoam-list .zerofoam-item {
	position: relative;
	display: flex;
	gap: 8px;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 8px;
	color: #616365;
	background: #FFF;
	border-radius: 6px;
	transition: cubic-bezier(.2,0,0,1) .3s;
  font-weight: 600;
}

.zerofoam-ad2 .zerofoam-grid .zerofoam-section .zerofoam-list .zerofoam-item img {
	width: 24px;
	height: 24px;
	object-fit: contain;
}

.zerofoam-ad2 .zerofoam-grid .zerofoam-section .zerofoam-list .zerofoam-item .zerofoam-badge {
	position: absolute;
    top: -4px;
    right: -4px;
    display: inline-flex;
    align-items: center;
    height: 16px;
    padding: 0 6px;
    border-top-left-radius: 6px;
    border-bottom-right-radius: 6px;
    font-size: 12px;
    letter-spacing: 0;
    color: #FFF;
  	font-weight: 500;
    background: linear-gradient(to right, #FF4444, #FF795C);
}

.zerofoam-ad2 .zerofoam-r-pic {
	grid-column: calc(4 + 1) / -1;
}

.zerofoam-section-2 .zerofoam-list {
	height: 120px;
	padding: 8px;
	background: #f6f7f9;
	border-radius: 12px;
}

.zerofoam-section-2 .zerofoam-list .zerofoam-content .zerofoam-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	gap: 8px;
}

.zerofoam-section-2 .zerofoam-list .zerofoam-content .zerofoam-grid .zerofoam-grid-ruler {
	display: grid;
	grid-auto-columns: 100%;
	grid-auto-flow: column;
	gap: 8px;
}

.zerofoam-section-2 .zerofoam-list .zerofoam-content .zerofoam-grid .zerofoam-grid-ruler .zerofoam-observer {
	position: absolute;
	left: 0;
}

.zerofoam-section-2 .zerofoam-list .zerofoam-content .zerofoam-grid .zerofoam-grid-ruler .zerofoam-item {
	position: relative;
	display: flex;
	gap: 8px;
	align-items: center;
	height: 104px;
	width: 110px;
	background: #FFF;
	overflow: hidden;
	color: #222529;
	border-radius: 6px;
	transition: cubic-bezier(.2,0,0,1) .2s;
}

.zerofoam-section-2 .zerofoam-list .zerofoam-content .zerofoam-grid .zerofoam-grid-ruler .zerofoam-item img {
	height: 70px;
	width: 70px;
	position: absolute;
	bottom: -10px;
	right: -5px;
	border-radius: 15px;
	transform: rotate(335deg);
}

.zerofoam-section-2 .zerofoam-list .zerofoam-content .zerofoam-grid .zerofoam-grid-ruler .zerofoam-item .zerofoam-span {
	margin: 8px;
	position: absolute;
	top: 0;
	left: 0;
	color: #616365;
  font-weight: 600;
}

.zerofoam-ad3 {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 24px;
}

.zerofoam-ad3 .zerofoam-grid {
	display: grid;
	grid-column: span 4;
}

.zerofoam-ad3 .zerofoam-grid .zerofoam-section {
	
}

.zerofoam-ad3 .zerofoam-title {
	display: flex;
	gap: 24px;
	align-items: center;
	margin-bottom: 16px;
}

.zerofoam-ad3 .zerofoam-content {
	flex: 1;
	overflow-x: auto;
	scrollbar-width: none;
}

.zerofoam-ad3 .zerofoam-title .zerofoam-listad {
	display: flex;
	gap: 8px;
	align-items: center;
}

.zerofoam-ad3 .zerofoam-title .zerofoam-more {
	color: #7f8792;
	white-space: nowrap;
}

.zerofoam-ad3 .zerofoam-card {
	height: 185px;
	overflow: hidden;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 24px;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-recom {
	display: grid;
	overflow: hidden;
	grid: "content" 140px
"footer" 45px / 100%;
	background: #f6f7f9;
	border-radius: 12px;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-recom:nth-child(1) {
	grid-column: auto / span 2;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-background {
	grid-area: 1 / 1 / -1 /-1;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-content {
	transition: transform .3s cubic-bezier(.25,.1,.25,1);
	grid-area: 1 / 1 / -1 /-1;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-content .zerofoam-daily {
	display: flex;
	gap: 4px;
	justify-content: center;
	height: 100%;
	padding-top: 24px;
	overflow: hidden;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-content .zerofoam-daily .zerofoam-item {
	display: grid;
	gap: 4px;
	align-content: start;
	width: 88px;
	border-radius: 6px;
	overflow: hidden;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-content .zerofoam-daily .zerofoam-item .zerofoam-img {
	padding-bottom: 177.778%;
	position: relative;
	display: block;
	line-height: 0;
	width: 100%;
	box-shadow: 0 12px 48px 2px #00000014, 0 2px 8px #0000000a;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-content .zerofoam-daily .zerofoam-item .zerofoam-img img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-footer {
	position: relative;
	display: flex;
	grid-area: footer;
	gap: 8px;
	align-items: center;
	justify-content: space-between;
	padding: 12px 16px;
	backdrop-filter: blur(40px);
	z-index: 99;
	border-radius: 0 0 12px 12px;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-footer .zerofoam-footer-title {
	color: #222529;
	font-size: 14px;
	font-weight: 600;
}

.zerofoam-ad3 .zerofoam-card .zerofoam-footer:after {
	position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background: #f6f7f9;
    opacity: .8;
    content: "";
}
.customize-width{max-width:1900px}.sidebar-nav{width:220px}@media (min-width: 768px){.main-content{margin-left:220px;}.main-content .page-header{left:220px;}}




.index-top-right span i {
	margin-right: 8px;
	font-size: 22px;
	line-height: 30px;
	box-sizing: border-box;
	vertical-align: middle;
	font-weight: 100;
}

.index-top-right ul {
	float: left;
	width: 330px
}

.index-top-right ul li {
	font-size: 16px;
	line-height: 32px;
	height: 32px;
	width: 100%;
	float: left;
	overflow: hidden;
font-weight: 100;
}

.index-top-right ul li a {
	color: #666;
	font-size: 14px;
	line-height: 32px;
font-weight: 100;
}

.index-top-right ul li a:hover {
	color: #0aa770
}

.index-top-right ul li em {
	font-style: inherit;
	line-height: 20px;
	color: #fff;
	width: 20px;
	height: 20px;
	background-color: #0aa770;
	font-size: 12px;
	text-align: center;
	float: left;
	transform: translateY(-50%);
	margin-right: 10px;
	font-family: gotham-medium;
	border-radius: 4px;
	position: relative;
	top: 50%
}

.index-top-right ul li:nth-child(1) em {
	background: #ff6b6d
}

.index-top-right ul li:nth-child(2) em {
	background: #ff9e3a
}

.index-top-right ul li:nth-child(3) em {
	background: #26ced5
}








/**侧栏**/
#rightcolumn {float:right;width:240px}
#rightcolumn p {padding-top:20px}
#rightcolumn h3 {padding:20px 0 4px;font-size:14px}
#rightcolumn li {height:24px;line-height:24px;font-size:14px;overflow:hidden}
#leftcolumn {position:relative;float:left;margin-bottom:65px;width:195px;min-height:600px;_height:600px;z-index:6}
#leftcolumn .menu li {width:164px;height:30px;list-style:none inside none}
#leftcolumn .menu li.active {background:url(../images/arrow_right.png) no-repeat}
#leftcolumn .menu a {display:block;padding-left:12px;width:152px;height:30px;line-height:30px;color:#5A5A5A;font-size:16px;}
#leftcolumn .menu a:hover {	text-decoration:none;color:#0F8BDA;background:url(../images/arrow_right.png) no-repeat}
#leftcolumn .menu a {position:relative}
#leftcolumn .menu a img {position:absolute;top:8.5px;left:65px}

.icon h3 {margin:20px 0;padding-left:45px;height:34px;line-height:34px;font-size:24px;font-weight:100;background:url(/skin/icons.png) no-repeat}
.module-usermenu h3 {	background-position:0 -68px}
.module-coursemenu h3 {	background-position:0 -136px}
.module-faqmenu h3 {background-position:0 -340px}
.module-aboutusmenu h3 {background-position:0 -306px}
.module-discussmenu h3 {background-position:0 -374px}

/**主栏**/
#maincolumn {float:left;margin:20px 0;width:985px}
.sheet {width:100%;min-height:600px;_height:600px;line-height:2.5em;border-left:1px solid #C2C2C2}
.sheet .contentpaneopen, .sheet .contentpane {padding-left:60px;width:870px}
.componentheading h3 {margin-bottom:10px;padding-left:35px;height:34px;line-height:34px;font-size:24px;font-weight:100}
.componentheading h3 a {color:#5A5A5A}
.contentpaneopen {padding-bottom:20px}
.contentpaneopen p {padding-top:5px;line-height:1.8;font-size:14px} 
.contentpaneopen p img{ max-width:100%; margin:15px 0px;}
.contentpaneopen li {float:left;width:49.5%;font-size:14px}
.contentpaneopen h1 {font-size:24px;font-weight:100;text-align:center;color:#4e9601}
.contentpaneopen h3 {font-size:16px;font-weight:100;color:#0F8BDA}


/**--我的账户--**/
.account {padding-left:60px;width:870px}
.account p {clear:both;padding:14px 4px;text-align:left;font-size:14px;border-bottom:dotted 1px #e1e1e1}
.account p.last {border-bottom:none}
.account b {font-size:16px;font-weight:bold;color:#ea192d}
.account input {font-size:12px;cursor:pointer}
.account font {color:#13a2de}
.account span {float:left;width:380px}
.account span.s1 {width:75px}
.account span.s2 {width:110px}
.account span.s3 {width:170px}
.account span.s4 {width:220px}

#login-histroy-data td, #changelog-data td { border-bottom: 1px dotted #dcdcdc; }

#login-histroy-data tr.login-histroy-abnormal, #changelog-data tr.changelog-abnormal { cursor: default; }
#login-histroy-data tr, #changelog-data tr { font-size: 12px; height: 30px; text-align: center; width: 700px; }
.mod-reset-list .login-histroy-title th, .mod-reset-list .changelog-title th { border: medium none; }
.login-histroy-title th, .changelog-title th { border-top: 1px solid #dfdfdf; }
.login-histroy-title, .changelog-title { background: none repeat scroll 0 0 #f3f3f3; }
.mod-reset-list { height: 640px; width: 850px; }
.left { float: left; }
#_fwin_login_background { position: fixed; z-index: 199; left: 0; top: 0; width: 100%; height: 100%; display: none; background-color: #000; }


#gLink { width: 450px;font-size:16px; border: none; cursor: text; color:#f00; }
input.selectall { border: 1px solid #ccc; font-size: 12px; color: #999; width: 40px; height: 24px; box-shadow: 0 0 3px 0 rgba(0,0,0,.35); text-shadow: 1px 1px #fff; border-radius: 2px; }
input.selectall { background: -moz-linear-gradient(top,#fff,#ddd); background: -webkit-linear-gradient(top,#fff,#ddd); background: -o-linear-gradient(top,#fff,#ddd); background: -ms-linear-gradient(top,#fff,#ddd); }
.account span.linktips { color: #aaa; display: inline; float: none; width: auto; margin-left: 20px; }
.componentheading h3, .componentheading h5{margin-bottom:10px;padding-left:10px;height:34px;line-height:34px;font-size:24px;font-weight:100;float:left;border-left: 3px solid #e25453; margin-left:15px;}
.componentheading h5{color:red;font-size:12px;}


.newTxt{background:#fbfbfb url(../images/txtBg.png) repeat-x left top;height:22px;line-height:22px;border:1px solid #abadb3;font-size:14px;padding:0 5px}

.newArea{background:#fbfbfb url(../images/txtBg.png) repeat-x left top;line-height:22px;border:1px solid #abadb3;font-size:14px;padding:5px 5px}
.newTxt.gray{color:#999}
.newTxt.gray.focus{color:#000}
.newTxt.disabled{ background-color:#ececec}

.form-itemt { position: relative; width: 200px; margin: 0 auto; padding-bottom: 30px;}
  .form-itemt button { width: 200px; height: 50px; border: 0; border-radius: 25px; font-size: 18px; color: #ffffff; outline: none; cursor: pointer; background-color: #c36000; }
.form-itemp { position: relative; width: 200px; margin: 0 auto; padding-bottom: 30px;}
  .form-itemp button { width: 200px; height: 50px; border: 0; border-radius: 25px; font-size: 18px; color: #ffffff; outline: none; cursor: pointer; background-color: #075701; }
.form-itemd { position: relative; width: 200px; margin: 0 auto; padding-bottom: 30px;}
  .form-itemd button { width: 200px; height: 50px; border: 0; border-radius: 25px; font-size: 18px; color: #ffffff; outline: none; cursor: pointer; background-color: #091e9d; }

.dowebok {padding-top:0px;margin-left:-150px;}
 .form-item { position: relative; width: 288px; margin: 0 auto; padding-bottom: 30px;}
 .form-item input { width: 288px; height: 48px; padding-left: 70px; border: 1px solid #000; border-radius: 25px; font-size: 18px; color: #000; background-color: transparent; outline: none;}
 .form-item button { width: 288px; height: 50px; border: 0; border-radius: 25px; font-size: 18px; color: #ffffff; outline: none; cursor: pointer; background-color: #2f5b04; }
 #username { background: url(/skin/touxiang.png) 20px 14px no-repeat; }
 #password { background: url(/skin/pass.png) 20px 14px no-repeat; }
 #email{ background: url(/skin/email.png) 20px 14px no-repeat; }
 .tip { display: none; position: absolute; left: 20px; top: 52px; font-size: 14px; color: #ff0000; }
 .reg-bar { width: 360px; margin: 20px auto 0; font-size: 14px; overflow: hidden;}
 .reg-bar a { color: #000; text-decoration: none; }
 .reg-bar a:hover { text-decoration: underline; }
 .reg-bar .reg { float: left; }
 .reg-bar .forget { float: right; }
 .dowebok ::-webkit-input-placeholder { font-size: 18px; line-height: 1.4; color: #666666;}
 .dowebok :-moz-placeholder { font-size: 18px; line-height: 1.4; color: #666666;}
 .dowebok ::-moz-placeholder { font-size: 18px; line-height: 1.4; color: #666666;}
 .dowebok :-ms-input-placeholder { font-size: 18px; line-height: 1.4; color: #666666;}