/* 调整一下左侧树的样式 */
body{font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;}

#main {padding-bottom: 100px;}
#main h2 {font-size: 1.6rem;}
#main h3 {font-size: 1.25rem;}

.main-box .markdown-section{ /* padding: 38px 20px; */ max-width: 100%; /* margin-left: 12%; */}
.main-box .markdown-section h4{font-size: 1rem;}



/* ------- 多设备适配 start ------- */
.sub-nav-draw-box{ display: none; }
body{
	--doc-left-width: 300px;
	--doc-context-width: 1000px;
	--doc-right-width: 300px;
}

/* 大于 1100px，就显示左中右结构 */
@media screen and (min-width: 1100px) {
	.doc-right-bj-box{ display: block; }
	.main-box .content{left: 0;}
	.main-box .markdown-section{width: var(--doc-context-width); padding: 38px 20px; border: 0px green solid;}
	.main-box .doc-right-bj-box{left: calc(50% + (var(--doc-context-width) / 2) + 10px);}
	.main-box .sidebar-nav>ul>li>ul>li>.app-sub-sidebar{ 
		position: fixed;
		top: 120px;
		left: calc(50% + (var(--doc-context-width) / 2) + 10px);
		width: var(--doc-right-width) !important;
		border: 0px #000 solid;
		line-height: 1.4em;
		width: calc(300px - 25px);
		max-height: 50vh;
		overflow: auto;
	}
	.main-box .sidebar{width: var(--doc-left-width);}
	.main-box .sidebar-nav>ul>li>ul>li>.app-sub-sidebar::-webkit-scrollbar{ width: 0px; }
	.main-box .sidebar-nav>ul>li>ul>li>.app-sub-sidebar li.active a{ color: #42B983; }
	.main-box .sidebar-nav>ul>li>ul>li>.app-sub-sidebar li a{ font-size: 12px; color: #888; }
	/* .main-box .app-sub-sidebar{display: none;} */
}
/* 小于 1100px时 */
@media screen and (max-width: 1100px) {
	.doc-right-bj-box{ display: none; }
}



/* 大于 1600px */
@media screen and (min-width: 1600px) {
	body{
		--doc-left-width: 300px;
		--doc-context-width: 1000px;
		--doc-right-width: 300px;
	}
}
/* 小于 1100px - 1600px 之间 */
@media screen and (max-width: 1600px) {
	body{
		--doc-left-width: 200px;
		--doc-context-width: calc( 100vw - 400px - 50px);
		--doc-right-width: calc(200px - 20px);
	}
}
/* 小于 1100px时 */
@media screen and (max-width: 1100px) {
	.doc-right-bj-box{ display: none; }
}
/* 小于 800px时 */
/* @media screen and (max-width: 800px) {
	.doc-right-bj-box{ display: none; }
} */


/* 媒体查询 */
@media screen and (max-width: 800px) {
	.nav-left .logo-box .logo-text,
	.nav-left .logo-box sub{display: none;}
	/* .main-box .markdown-section{max-width: 1000px; margin-left: auto; margin-top: 40px;} */
}
/* 手机端不显示广告，和一些其它东西 */
@media (max-width: 576px) {.wwads-cn,.p-none{display:none!important}} 

/* ------- 多设备适配 end ------- */


/* 右侧盒子 */
.doc-right-bj-box{
	width: var(--doc-right-width);
	padding: 10px;
	position: fixed;
	margin-top: 10px;
	top: 60px;
	border: 0px #000 solid;
	font-size: 12px;
}
.doc-right-bj-box-title{ font-size: 14px; color: #888; padding-bottom: 8px; border-bottom: 1px #aaa solid; }
.doc-right-more-item{ position: absolute; border: 0px #000 solid; color: #000; width: 100%;}




/* ------- 头部样式 ------- */
.doc-header{position: fixed; top: 0; z-index: 1000; width: 100%; height: 60px; line-height: 60px;}
.doc-header{/* background-color: hsla(0,0%,100%,0.97); */ background-color: rgba(255, 255, 255, 0.97); box-shadow: 0 1px 3px rgba(26,26,26,0.1);}

/* 左边导航 */
.nav-left{display: inline-block; float: left;}
.logo-box {display: inline-block; cursor: pointer; color: #000; padding-left: 24px; height: 60px; line-height: 60px;}
.logo-box img {width: 50px; height: 50px; vertical-align: middle; position: relative; top: -1px; margin-right: 5px;}
.logo-box .logo-text {display: inline-block; margin: 0; padding: 0; color: #000; vertical-align: middle; font-size: 26px;font-weight: 500;}
.logo-box sub{margin-left: 5px; color: #666;}

/* 右边导航 */
.doc-header .nav-right{margin: 0;  float: right; padding-right: 3em; margin-right: 20px !important;}
.doc-header .nav-right>*{padding: 0px; margin: 0 10px;}
.doc-header .nav-right>*:last-child{position: relative; z-index: 1002;}
.doc-header .nav-right>select{border-color: #999; color: #666; outline: 0; cursor: pointer; transition: all 0.2s; background-color: #FFF; border-width: 1px; outline: 0;}
.doc-header .nav-right>select:hover{box-shadow: 0 0 10px #aaa;}

.github-corner{z-index: 1001 !important;}
.doc-header .nav-right .wzi{font-size: 14px; line-height: 61px; transition: color 0.2s; padding-bottom: 4px;}
.doc-header .nav-right .wzi:hover{border-bottom: 2px var(--a-color) solid;}

.nav-right a{color: #34495E;}

/* 搜索框 */
.sear-box{display: inline-block; width: 180px; margin-right: 20px; line-height: 26px; text-align: left;}
.sear-box{/* position: fixed; */ }
.sear-box .search{margin-bottom: 0px; padding: 0; border: 0;}
.results-panel{border: 1px #aaa solid; border-radius: 2px; padding: 10px; max-height: 60vh; overflow: auto; position: absolute; background-color: #FFF; width: 266px;width: 316px;}
.sear-box .search input{border: 1px solid #e3e3e3; color: #345; border-radius: 15px; line-height: 30px; padding-left: 30px; transition: all 0.2s;}
.sear-box .search input{background: #fff url(./search-icon.svg) 10px 8px no-repeat; background-size: 14px;}
.clear-button{display: none !important;}

/* 工具栏超链接 展开、收缩div */
.zk-box{display: inline-block;}
/* 外层盒 */
.zk-box .zk-context{max-height: 0px; position: absolute; overflow: hidden;}
.zk-box:hover .zk-context{max-height: 300px;}
/* 内层盒 */
.zk-context>div{padding: 1em 0.5em 1em 1em; border: 1px #ccc solid; border-radius: 2px; background-color: #FFF; font-size: 12px; transition: all 0.2s; opacity: 0;}
.zk-box:hover .zk-context>div{opacity: 1;}
/* 小链接 */
.zk-box .zk-context a{font-size: 14px; display: block; line-height: 32px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.zk-box .zk-context a{text-align: left; padding: 0 1.5em 0 1em;}
.zk-box .zk-context .zk-fengexian{border-bottom: 1px #d9d9d9 solid; margin: 10px 0;}

/* 下三角小图标 */
.zk-icon{display: inline-block; width: 0px; height: 0px; position: relative;top: 3px; margin-left: 4px;}
.zk-icon{border-style: solid; border-width: 5px; border-color: #aaa transparent transparent transparent; }

/* 版本选择按钮 */
.select-version{background-color: transparent !important;}


/* ------- 调整一下左侧树的字体样式 ------- */
.main-box .sidebar{padding-top: 25px; margin-top: 60px;}
.sidebar .sidebar-nav>ul>li>p{/* font-size: 1.2em; */ margin-top: 10px;}
.sidebar .sidebar-nav>ul>li> strong{/* font-size: 1.2em; */ margin-top: 10px;}
/* .sidebar ul li a{color: #222;} */
.sidebar .sidebar-nav>ul>li>ul>li>a{/* color: #222; */font-size: 14px; /* font-weight: 700; */}
.main-box .sidebar-nav ul li{margin-top: 0; margin-bottom: 0;}
.main-box .sidebar ul li a{color: #00323c;}

/* 做到悬浮出现下划线的效果 */
.main-box .sidebar>.sidebar-nav>ul{padding-left: 6px;}
.main-box .sidebar li a:hover{color: #42b983;}
/* .main-box .sidebar li{white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin: 5px 0;}
.main-box .sidebar li a{display: inline; line-height: 30px; padding: 5px 0 2px;}
.main-box .sidebar li a:hover{text-decoration: none; color: #42b983; border-bottom: 1px #42b983 solid;}
.main-box .sidebar li.active>a{border: 0px;}
.main-box .sidebar li.active>a:after{content: ''; position: absolute; height: 30px; right: 0; border-right: 3px #42b983 solid;} */

.sidebar .sidebar-nav>ul>li>ul>li.active-rep>a{ color: #42B983; font-weight: 700; }



/* .main-box .sidebar .app-sub-sidebar li:before{float: none;} */

/* ============== code代码样式优化 ================ */

.main-box .markdown-section code, .main-box .markdown-section pre{background-color: rgba(0, 0, 0, 0.04);}

/* 背景变黑 */
.main-box [data-lang]{padding: 0px !important; border-radius: 2px;overflow-x: auto; overflow-y: hidden;}
.main-box [v-pre] code{border: 0px red solid; border-radius: 0px; /* background-color: #282828; */ background-color: #191919; color: #FFF;}
.main-box [v-pre] code{padding: 1.5em 1.3em; margin-left: 40px !important;}
/* .main-box h2{margin-top: 70px;} */

/* 代码行号盒子样式 */
.code-line-box {list-style-type: none; border-right: 1px solid #000; position: absolute; top: 0; left: 0; width: 40px;  user-select: none;}
.code-line-box {padding: calc(1.5em + 1px)  0px !important; padding-bottom: calc(1.5em + 20px) !important; margin: 0px !important;}
.code-line-box {line-height: inherit !important; background-color: #191919; color: #aaa;font-weight: 400;font-size: 0.85em;text-align: center;}

/* xml语言样式优化 */
/* .lang-xml .token.comment{color: #CDAB53;} */
.lang-xml .token.tag *{color: #db2d20;}
.lang-xml .token.attr-value{color: #A6E22E;}

/* html语言样式优化 */
.lang-html .token.comment{color: #CDAB53;}
.lang-html .token.tag *{color: #db2d20;}
.lang-html .token.tag .attr-name,
.lang-html .token.tag .attr-name *{color: #A6E22E; opacity: 0.9;}
.lang-html .token.tag .attr-value,
.lang-html .token.tag .attr-value *{color: #E6DB74; opacity: 0.9;}
.lang-html .token.annotation.punctuation{color: #ddd;}
.lang-html .token.punctuation{color: #ddd;}

/* java语言样式优化 */
.main-box .lang-java{color: #01a252 !important;; opacity: 1;}
.lang-java .token.keyword{color: #db2d20;}
.lang-java .token.namespace,.lang-java .token.namespace *{color: #01A252; opacity: 1;}
.lang-java .token.class-name,.lang-java .cm-variable{color: #55b5db; opacity: 1;}
/* .lang-java .token.comment{color: #CDAB53;} */
.lang-java .token.annotation.punctuation{color: #ddd;}
.lang-java .token.punctuation{color: #ddd;}

/* cmd语言样式优化 */
.main-box .lang-cmd{color: #01A252 !important; opacity: 1;}

/* url语言样式优化 */
.main-box .lang-url{color: #E96917 !important; opacity: 1;}

/* js语言样式优化 */
.main-box .lang-js{color: #01a252 !important;}
/* .lang-js .token.comment{color: #CDAB53;} */
/* .lang-js .token.string{color: #fded02;} */
.lang-js .token.string{color: #ddd;}
.lang-js .token.punctuation{color: #ddd;}

/* yaml 和 properties 语言优化 */
.lang-yaml .token.punctuation{color: #eee;}
.lang-properties .token.attr-name{color: #22a2c9;}


/* ------- markdown 内容样式优化 ------- */

/* GitHub折线图最大宽度 */
[alt=github-chart]{max-width: 897px;}
/* 大屏幕时，某些图片限制一下宽度 */
@media screen and (min-width: 800px) {
	[title=s-w],[title=s-w-sh]{max-width: 80%;}
}
[title=s-w-sh]{display: inline-block; border: 1px #eee solid;}

/* 公众号table */
.gzh-table{ /* table-layout:fixed !important; */}
/* .gzh-table,.gzh-table tr,.gzh-table td{display: block !important;} */
/* .gzh-table tbody{display: block !important; width: 100% !important;} */
#main .gzh-table tr{background-color: #FFF;}
.gzh-table td{padding: 20px !important; width: 20%; border: 0;}
.gzh-table td b{display: block; margin-bottom: 10px; }

/* tab选项卡优化 */
/* .docsify-tabs--classic{background-color: rgba(255, 255, 255, 0.2);} */
.docsify-tabs__tab{outline: 0; cursor: pointer;}
.docsify-tabs--classic .docsify-tabs__tab--active{box-shadow: 0 0 0;}
/* tab卡片插件样式优化 */
.main-box{
	--docsifytabs-border-color: #ddd;
	--docsifytabs-tab-color: #777;
}


/* 调整表格的响应式 */
#main table{margin-left: 0px;}
@media screen and (min-width: 800px) {
	#main table tr th{min-width: 100px;}
}

/* 提示框加上灰色背景 */
.main-box .markdown-section blockquote{padding: 1px 24px 1px 30px; background-color: #f8f8f8;}

/* 行级代码样式 */
blockquote code {font-weight: 400;}

/* 赞助列表 */
.zanzhu-box{margin-top: -10px;}
.zanzhu-box table tr td:nth-child(2){color: red;}
#main .zanzhu-box table tr td:first-child a{border-color: rgba(0,0,0,0); color: inherit;}
#main .zanzhu-box table tr td:first-child a:hover{border-color: var(--a-hover-color); color: var(--a-hover-color);}

/* 展开和收起 */
#main .zanzhu-box{/* height: 500px; */ overflow-y: hidden; transition: all 1.5s;}
#main .zanzhu-box table{display: table;}
.zhankai-btn-box{margin-top: 10px;}
.zk-btn--1,.zk-btn--2{cursor: pointer;}
.zk-btn--2{display: none;}

/* 角标位置修复 */
.badge-box a:nth-child(-n+2) img{position: relative; top: 1px;}

body {
  --a-color: #01a252;
  --a-hover-color: #0969da;
}

/* 超链接样式 */
#main *:not(h1,h2,h3,h4,h5,h6) a{font-weight: 400; text-decoration: none; font-family: "思源黑体";}
#main *:not(h1,h2,h3,h4,h5,h6) a{color: var(--a-color); border-bottom: 1px var(--a-color) solid;}
#main *:not(h1,h2,h3,h4,h5,h6) a:hover{color: var(--a-hover-color); border-bottom: 1px var(--a-hover-color) solid;}

#main .un-dec-a-pre+p a,
#main p[align=center] a{border-bottom:0px;}


/* toc目录树 */
.toc-box>li{margin-bottom: 15px;}
.toc-box .toc-h2{list-style-type: none; font-size: 18px; margin-top: 20px;}
.toc-box .toc-h3,.toc-box .toc-h4{margin-left: 1em;}
.toc-box .toc-h5,.toc-box .toc-h6{margin-left: 2em;}
#main .toc-box .toc-h2 a span{color: #34495e;}
#main .toc-box a{border-color: rgba(0,0,0,0); transition: 0s;}
#main .toc-box a span{color: inherit;}


/* 加载图片的按钮 */
.show-img{
	background-color: #FFF;
	padding: 8px 15px;
	border: 1px #42b983 solid;
	color: #42b983;
	cursor: pointer;
	border-radius: 2px;
	transition: all 0.2s;
}
.show-img:hover{
	background-color: #eaf6eb;
}
.show-to-img{cursor: pointer;}

/* 导航栏悬浮时出现下滑条条 */
/* .doc-header .nav-right .wzi::after {
    content: '';
    width: 0%;
	float: left;
    display: inline-block;
	text-align: center;
	margin-top: -15px;
    border-bottom: 2px var(--a-color) solid;
	transition: all 0.2s;
}
.doc-header .nav-right .wzi:hover::after {width: 100%;} */


/* 保证点开图片时在最上面 */
.medium-zoom-image.medium-zoom-image--opened{
	z-index: 10000;
}


/* -------------  答题按钮 ------------- */
#main .dt-btn,#main .case-btn{
	background-color: #e7ecf3;
	color: #385481;
	display: inline-block;
	border: 1px #d7dce3 solid !important;
	border-radius: 1px;
	/* border-bottom-width: 0px !important; */
	
	margin-top: 10px;
	width: 100%;
	padding: 8px 14px;
	font-size: 14px;
	transition: all 0.15s;
	text-decoration: none !important;
	font-weight: 400;
	
	/* 背景 */
	background-image: url(icon/dati.svg);
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: 1em 12px;
	text-indent: 2em;
}
/* 代码示例按钮 */
#main .case-btn{
	background-color: #feedeb;
	color: #dd4949;
	border: 1px #decdcb solid !important;
	background-size: 18px 18px;
	background-image: url(icon/code.svg);
}
#main .case-btn.case-btn-video{ 
	background-color: #ECF5FF; 
	color: #1979DA; 
	border: 1px #49A9DA solid !important;
	background-image: url(icon/video.svg);
}
#main .dt-btn{display: none;}


/* -------------  背景色相关 ------------- */
/* 侧边栏需要透明 */
.sidebar-toggle{background-color: transparent !important;}
.sidebar{background-color: transparent !important;}

/* 变色的动画 */
.doc-header,body{transition: all 0.5s !important;}

/* 调色按钮 */
.theme-btn{width: 25px; height: 25px; line-height: 60px; vertical-align: middle; position: relative; top: -1px;}
.theme-box{width: 156px; text-align: left; line-height: 20px; margin-top: -20px;}
.theme-box span{
	display: inline-block;
	width: 20px; 
	height: 20px; 
	margin: 1px 2px; 
	border: 1px #ccc solid; 
	cursor: pointer;
	border-radius: 1px;
}

/* -------------  details标签 ------------- */
.main-box details{
	border: 1px #42B983 solid;
	background-color: #f4fdef;
	overflow: hidden;
	max-height: 44px;
	margin-bottom: 1em;
	/* transition: all 1s; */
}
.main-box details[open]{ /* max-height: 1000px; */ overflow: auto; animation: slideDown 0.6s linear both;}
@keyframes slideDown {
    0% { max-height: 44px; overflow: hidden; }
    99% { max-height: 1500px; overflow: hidden; }
    100% { max-height: 1500px; overflow: auto; }
}
.main-box details summary{
	padding: 11px 14px;
	background-color: #f4fdef;
	color: #01a252;
	cursor: pointer;
}
.main-box details pre{
	margin-left: 1em;
	margin-right: 1em;
}
.main-box details table{margin-left: 1em !important; margin-right: 1em; width: auto;}
.main-box details p{padding: 0 14px;}

/* 广告盒子 */
.ad-title{ font-size: 14px; color: #aaa; padding-bottom: 8px; margin-bottom: 14px; border-bottom: 1px #aaa solid; }
.ad-tips{margin-bottom: 5px;}
.ad-close{float: right;}
.ad-close:hover{cursor: pointer; text-decoration: underline; color: red;}

.main-box .top-ad-box{font-size: 12px;}
.main-box .top-ad-box a{border-bottom: 0px; text-decoration: none;}
.main-box .top-ad-box a:hover{border-bottom: 0px;}
.main-box .top-ad-box a img{border: 1px #eee solid; width: 100%; /* max-height: 80px; */ border-radius: 2px; transition: all 0.1s !important;}
.main-box .top-ad-box a img:hover{box-shadow: 0 0 20px #ddd;}

.main-box .top-ad-box2 a img{ width: 48.5%; margin-bottom: 2px; }
.main-box .top-ad-box2 a:nth-child(2n+1) img{margin-right: 2px; }


/* 帮助按钮 */
.help-btn{transition: all 0.5s; text-align: center; border: 1px #42b983 solid; background-color: rgba(255, 255, 255, 0.5); cursor: pointer; font-size: 13px; color: #42b983; line-height: 40px;}
.help-btn:hover{box-shadow: 0 0 20px #D1EEE1 !important;}
.xiaozhushou-intro p{line-height: 14px;}

/* ew-wa */
.ew-wa{ margin-top: 14px; line-height: 18px; color: #aaa; }
.ew-wa a{ margin-right: 5px; text-decoration: none; color: #8693A7; }
.ew-wa a:hover{text-decoration: underline; color: #44f; }

/* 按钮发光动画 */
/* .help-btn{animation: helpbtnanimation 3s infinite;}
@keyframes helpbtnanimation{
    0%{box-shadow: 0 0 1px #42B983;}
    50%{box-shadow: 0 0 20px #42B983;}
    100%{box-shadow: 0 0 20px #FFF;}
} */

/* ********** 赞助者名单 ******** */
.zanzhu-table{text-align: left;}
/* 赞助排序盒子 */
.zanzhu-sort-box{font-size: 14px; margin-bottom: 10px;}
.zanzhu-sort-box .zanzhu-sort-btn{text-decoration: none; color: #999; cursor: pointer;}
.zanzhu-sort-box .zanzhu-sort-btn:hover{text-decoration: underline; color: #557;}
.zanzhu-sort-box .zanzhu-sort-btn.zz-sort-native{text-decoration: underline; color: #557;}
/* 底部按钮盒子 */
.zz-btn-box{color: #666; font-size: 14px;}
.zz-btn-box button{padding: 5px 10px; cursor: pointer; border: 1px #ccc solid; color: #999; background-color: #FFF;}
.zz-btn-box button:hover{box-shadow: 0 0 10px #ddd;}

.syzz-show-btn{border: 1px #ccc solid; padding: 5px 10px; background-color: #FFF; color: #666; cursor: pointer;}
.syzz-show-btn:hover{box-shadow: 0 0 10px #ddd;}

/* ********** 团队成员名单 ******** */
.markdown-section .team-table{ display: table; text-align: left; }
.team-table img{ width: 45px; height: 45px; }

/* ajax加载时的转圈圈样式 */
.ajax-layer-load.layui-layer-dialog{min-width: 0px !important; background-color: rgba(0,0,0,0.85);}
.ajax-layer-load.layui-layer-dialog .layui-layer-content{padding: 10px 20px 10px 40px; color: #FFF;}
.ajax-layer-load.layui-layer-dialog .layui-layer-content .layui-layer-ico{width: 20px; height: 20px; background-size: 20px 20px; top: 12px; }


/* 万维广告 */
.wwads-cn{margin-top: 0px !important;}
.wwads-cn>a>img{width: 80px !important;}

/* 提示框 */
.main-box .alert{ border-radius: 0px !important; }
/* .main-box .alert ul,.main-box .alert ol{ margin-top: -5px; margin-bottom: -10px; } */
.main-box .alert.tip .title .icon.icon-tip{
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' fill='%2301354d' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM8 5.5a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3C/svg%3E");
}
.main-box .alert.flat.note{background-color: #E8F4FF;}
.main-box .alert.flat.tip{background-color: #F0F9EB;}
.main-box .alert.flat.warning{background-color: #FDF6EC;}