@charset "utf-8";
/*wap*/
@media screen and (min-width:0px) and (max-width:1199px) {

	html,
	body {
		max-width: 750px;
		margin: 0 auto;
	}

	html {
		font-size: 62.5%
	}

	.pc {
		display: none;
	}

	.wap {
		display: block;
	}

	@media only screen and (min-width:321px) {
		html {
			font-size: 62.5% !important
		}
	}

	@media only screen and (min-width:361px) {
		html {
			font-size: 70.31% !important
		}
	}

	@media only screen and (min-width:376px) {
		html {
			font-size: 73.24% !important
		}
	}

	@media only screen and (min-width:481px) {
		html {
			font-size: 94% !important
		}
	}

	@media only screen and (min-width:561px) {
		html {
			font-size: 109% !important
		}
	}

	@media only screen and (min-width:641px) {
		html {
			font-size: 125% !important
		}
	}


	/* --- 框架 --- */
	html {
		background: #EDEDED;
	}

	/* --- 全局字体样式 --- */
	body{
		font: 400 16px/1.8 'Microsoft YaHei', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, sans-serif;
		color: #333;
		background: #F4F4F4;
	}


	/* --- 首页 --- */

	/* logo */
	.logo {
		margin-bottom: 2rem;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 1rem
	}

	.logo h1 {
		text-align: left;
		font-size: 3rem;
		font-weight: bold;
		color: #fff;
		margin-top: 2rem;
	}

	.logo .home-logo {
		height: 90px;
		width: auto;
		border-radius: 12px
	}

	.home-links {
		margin-top: 2rem;
		display: flex;
		align-items: center;
		gap: .8rem
	}

	.home-links a {
		display: inline-block;
		padding: .6rem .9rem;
		border: 2px solid #06f;
		border-radius: 999px;
		color: #06f;
		background: #fff;
		font-size: 1.4rem;
		transition: all .2s ease
	}

	.home-links a:active {
		background: #06f;
		color: #fff
	}

	.hero-slider {
		max-width: 90%;
		height: 12rem;
		margin: 1rem auto 1.5rem auto;
		position: relative;
		overflow: hidden;
		border-radius: 1.2rem;
		background: #fff;
		box-shadow: 0 4px 16px rgba(0, 0, 0, .08)
	}

	.hero-slides {
		list-style: none;
		margin: 0;
		padding: 0;
		height: 100%
	}

	.hero-slides li {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		transition: opacity .6s
	}

	.hero-slides li.active {
		opacity: 1
	}

	.hero-slides img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block
	}

	.hero-dots {
		position: absolute;
		left: 50%;
		bottom: .8rem;
		transform: translateX(-50%);
		display: flex;
		gap: .6rem;
		z-index: 2
	}

	.hero-dots span {
		display: inline-block;
		width: .8rem;
		height: .8rem;
		border-radius: 50%;
		background: rgba(255,255,255,.5);
		cursor: pointer;
		transition: all .3s ease
	}

	.hero-dots span.active {
		background: #fff
	}

	/* 搜索框（独立于幻灯片） */
	.hero-search {
		max-width: 90%;
		margin: 0 auto 1.8rem auto
	}

	.hero-search .search {
		position: relative;
		display: flex;
		align-items: center;
		background: #fff;
		border: 2px solid #e5e7eb;
		border-radius: 10px;
		box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
		padding: 4px;
		margin: 0;
		transition: border-color .3s ease, box-shadow .3s ease
	}

	.hero-search .search:focus-within {
		border-color: #06f;
		box-shadow: 0 4px 12px rgba(0, 102, 255, .12)
	}

	.hero-search .search input {
		flex: 1;
		min-width: 0;
		height: 4rem;
		padding: 0 1.2rem;
		font-size: 1.5rem;
		color: #333;
		background: transparent;
		border: none;
		outline: none
	}

	.hero-search .search input::-webkit-input-placeholder {
		color: #9ca3af
	}

	.hero-search .search button {
		flex-shrink: 0;
		height: 4rem;
		padding: 0 1.8rem;
		background: linear-gradient(135deg, #06f 0%, #0051d5 100%);
		color: #fff;
		border: none;
		font-size: 1.4rem;
		font-weight: 600;
		cursor: pointer;
		transition: all .3s ease;
		border-radius: 6px
	}

	.hero-search .search button:active {
		background: linear-gradient(135deg, #06f 0%, #0066ff 100%);
		box-shadow: 0 2px 8px rgba(0, 102, 255, .25);
		transform: scale(0.97)
	}


	/* 推荐书籍 */
	.recommend {
		background: #fff;
		max-width: 90%;
		margin: 0 auto;
		background: #fff;
		border-radius: 10px;
		padding: 0 30px;
	}

	.recommend .title {
		padding-top: 20px;
		padding-bottom: 20px;
		overflow: hidden;
		position: relative;
		text-align: center;
	}

	.recommend .title h2 {
		font-size: 1.6rem;
		color: #333;
		margin-bottom: 1rem;
	}

	/* 置顶阅读 */
	.top-read {
		background: #fff;
		margin: 0 auto 1rem auto;
		max-width: 90%;
		border-radius: 10px;
		padding: 0 30px;
		display: none !important;
	}

	.top-read .title {
		border-bottom: 1px solid #efefef;
		padding-top: 20px;
		padding-bottom: 20px;
		overflow: hidden;
		position: relative;
		text-align: center;
	}

	.top-read .title:before {
		display: none;
	}

	.top-read .title h2 {
		font-size: 1.6rem;
		color: #333;
		margin: 0;
		display: inline-block;
		float: none;
	}

	.top-read .bd {
		border-bottom: 1px solid #efefef;
	}

	.top-read .bd ul {
		padding-top: 20px;
		padding-bottom: 20px;
		overflow: hidden;
	}

	.top-read .bd li {
		width: 100%;
		padding-left: 2.5rem;
		box-sizing: border-box;
		font-size: 1.2rem;
		height: 3rem;
		line-height: 3rem;
		overflow: hidden;
		position: relative
	}

	.top-read .bd li::before {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 1.2rem;
		height: 1.2rem;
		background: linear-gradient(135deg, #06f 0%, #0066ff 100%);
		border-radius: 50%;
		box-shadow: 0 2px 6px rgba(0, 102, 255, .15)
	}

	.top-read .bd a {
		color: #333;
		display: block;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		-webkit-tap-highlight-color: transparent;
		text-align: left;
		text-decoration: none;
	}

	.recommend .title h2 em {
		color: #999;
		font-weight: lighter;
		display: block;
		margin-top: 1rem;
	}

	.recommend .title .more {
		display: block;
		background: #f9f9f9;
		padding: .5rem 1rem;
		font-size: 1.4rem;
	}

	.recommend .bd {}

	.recommend .bd ul {
		padding-top: .5rem;
		padding-bottom: .5rem;
		overflow: hidden;
	}

	.recommend .bd li {
		padding-left: 2.5rem;
		font-size: 1.2rem;
		height: 3rem;
		line-height: 3rem;
		overflow: hidden;
		position: relative
	}

	.recommend .bd li::before {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 1rem;
		height: 1rem;
		background: linear-gradient(135deg, #06f 0%, #0066ff 100%);
		border-radius: 50%;
		box-shadow: 0 2px 6px rgba(0, 102, 255, .15)
	}

	.recommend .hd {
		padding-top: 30px;
		padding-bottom: 30px;
		text-align: center;
	}

	.recommend .hd li {
		display: inline-block;
		width: 10px;
		height: 10px;
		background: #efefef;
		border-radius: 100px;
		margin-left: 5px;
		margin-right: 5px;
	}

	.recommend .hd li.on {
		background: #06f;
	}

	.recommend-bottom {
		display: none;
	}

	/* 友情链接 */
	.friends {
		text-align: center;
		padding: 1.5rem;
	}

	.friends a {
		color: #fff;
		font-size: 1.2rem;
		margin-left: 1rem;
		margin-right: 1rem;
	}

	/* 分类导航（移动端适配） */
	.catnav {
		display: block;
		background: #fff;
		padding: 1.5rem;
		margin: 0 auto 1rem auto;
		max-width: 90%;
		border-radius: 10px;
		box-sizing: border-box;
	}

	.catnav .wrap {
		width: 100%;
	}

	.catnav ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.catnav li {
		width: 31%;
		margin-bottom: 1rem;
		text-align: center;
	}

	.catnav li:nth-last-child(-n+3) {
		margin-bottom: 0;
	}

	.catnav a {
		display: block;
		width: 100%;
		padding: 1rem 0;
		background: #f0f2f5;
		color: #333;
		border-radius: 8px;
		font-size: 1.3rem;
		text-decoration: none;
	}

	.catnav a:active {
		background: #06f;
		color: #fff;
	}

	/* 底部 */
	.footer {
		text-align: center;
		font-size: 1.2rem;
		color: #000;
		background: #EDEDED;
		padding: 1.5rem
	}

	.footer a {
		color: #000;
		margin-left: 1rem;
		margin-right: 1rem;
	}




	/* --- 内页 --- */

	/* 头部 */
	.page-header {
		background: #F4F4F4;
		padding: 1.2rem 0;
	}

	.page-top-links {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 1rem;
		margin: 0;
	}

	.page-top-links a {
		display: block;
		padding: .6rem 1.2rem;
		background: #fff;
		color: #06f;
		border-radius: 2rem;
		font-size: 1.3rem;
		font-weight: bold;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
		transition: transform .2s;
	}

	.page-top-links a:active {
		transform: scale(0.95);
		opacity: 0.9;
	}

	/* logo */
	.page-logo {
		text-align: center;
		display: none;
	}

	.page-logo h1 {
		color: #fff;
		font-size: 2.4rem;
		font-weight: bold;
		margin-bottom: 2rem;
	}

	.page-logo h1 a {
		color: #fff;
	}

	/* 搜索 */
	.page-search {
		position: relative;
		display: none;
	}

	.page-search input {
		background: none;
		border: none;
		padding-left: 2rem;
		line-height: 4.5rem;
		color: #fff;
		border-radius: 100px;
		border: 3px solid #fff;
		height: 4.5rem;
		width: 100%;
		transition: all .3s ease;
		font-size: 1.4rem;
	}

	.page-search button {
		width: 20%;
		background: url(./img/search.png) no-repeat center center;
		border: none;
		cursor: pointer;
		position: absolute;
		right: 0;
		height: 4.5rem;
		top: 0;
	}

	.page-search input:focus {
		border: 3px solid #f90;
	}



	/* 框架 */
	.page-box {
		background: #fff;
		margin-top: 1rem;
		overflow: hidden;
		box-shadow: 0px 10px 30px #49403F;
	}

	.box-left {
		background: #f9f9f9;
		padding: 1rem;
	}

	.box-right {
		padding: 1rem;
	}


	/* 广告位 */
	.ad {
		background: #00CCFF;
		text-align: center;
		margin-bottom: 1rem;
	}

	.ad-300-200 {
		line-height: 200px;
		color: #fff;
	}

	.ad-300-100 {
		line-height: 100px;
		color: #fff;
	}

	.ad-840-100 {
		line-height: 100px;
		color: #fff;
		margin-bottom: 30px;
	}


	/* 侧栏 */
	.page-recommend {
		border: 1px solid #efefef;
		background: #fff;
		margin-bottom: 10px;
	}

	.page-recommend h3 {
		border-bottom: 1px solid #efefef;
		padding: 15px;
		font-size: 1.4rem;
		color: #666;
	}

	.page-recommend ul {
		padding: 1rem;
	}

	.page-recommend li {
		font-size: 1.2rem;
		line-height: 200%;
		position: relative;
		padding-left: 1.5rem;
	}

	.page-recommend li:before {
		content: "";
		width: 5px;
		height: 5px;
		background: #ccc;
		border-radius: 100%;
		left: 0;
		top: 11px;
		position: absolute;
	}

	.page-recommend div {
		padding: 0.8em 0 0.5em 1em;
		line-height: 1.5em;
	}


	.page-recommend table {
		width: 96%;
		padding: 0 2% 0 2%;
		text-align: center;
	}

	.page-recommend caption,
	th {
		text-align: center;
	}

	.page-recommend input[type="text"] {
		border: 1px solid #bfd0d7;
		height: 28px;
		line-height: 24px;
		width: 210px;
	}

	.page-recommend input[type="submit"] {
		border: 1px solid #bfd0d7;
		height: 28px;
		line-height: 24px;
		width: 50px;
		margin-left: 0px;
		background: #e5f0f6;
	}

	/* 热门 */
	.page-hot {
		overflow: hidden;
		margin-bottom: 20px;
	}

	.page-hot h3 {
		font-size: 2rem;
		margin-bottom: 1rem;
		color: #333;
	}

	.page-hot li {
		position: relative;
		padding-left: 15px;
		line-height: 220%;
		font-size: 1.2rem;
	}

	.page-hot li:before {
		content: "";
		width: 5px;
		height: 5px;
		background: #ccc;
		border-radius: 100%;
		left: 0;
		top: 11px;
		position: absolute;
	}

	.content-hot {
		background: #f9f9f9;
		padding: 20px;
	}


	/* 列表 */
	.page-list {}

	.page-list li {
		border-bottom: 1px solid #efefef;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}

	.page-list h3 {
		font-size: 1.4rem;
		margin-bottom: 10px;
	}

	.page-list p {
		font-size: 1.2rem;
		line-height: 180%;
		color: #999;
	}


	/* 分页 */
	.showpage {
		text-align: center;
		padding-bottom: 1rem;
		margin-top: 1rem;
	}

	.showpage a {
		background: #efefef;
		padding: .5rem 1rem;
		border-radius: 5px;
		margin-left: 5px;
		margin-right: 5px;
		font-size: 1.2rem;
	}

	.showpage a.now {
		background: #06e;
		color: #fff;
	}


	/* 标题 */
	.title h1 {
		text-align: center;
		font-size: 32px;
		margin-bottom: 30px;
		margin-top: 20px;
	}


	/* 内容 */
	.article {
		padding: 1.5rem;
		overflow-wrap: break-word
	}

	.article img {
		max-width: 100%;
		height: auto;
		display: block;
		margin: 1rem auto
	}

	/* 编辑器内容标题样式 - 只覆盖没有内联样式的标题 */
	.article h1:not([style]), .article h2:not([style]), .article h3:not([style]), .article h4:not([style]), .article h5:not([style]), .article h6:not([style]){
		font-family: 'Microsoft YaHei', 'PingFang SC', 'Helvetica Neue', Helvetica, Arial, sans-serif;
		font-weight: 600;
		color: #333;
		margin: 1.5rem 0 0.8rem 0;
		line-height: 1.5;
	}

	.article h1:not([style]){font-size: 2rem;}
	.article h2:not([style]){font-size: 1.8rem;}
	.article h3:not([style]){font-size: 1.6rem;}
	.article h4:not([style]){font-size: 1.4rem;}
	.article h5:not([style]){font-size: 1.3rem;}
	.article h6:not([style]){font-size: 1.2rem;}

	/* 编辑器表格样式 - 移动端 */
	.article table{
		border-collapse: collapse;
		width: 100%;
		margin: 1rem 0;
		font-size: 1.3rem;
		background: #fff;
		display: block;
		overflow-x: auto;
	}

	.article table th, .article table td{
		border: 1px solid #ddd;
		padding: 0.6rem 1rem;
		text-align: left;
		line-height: 1.5;
		white-space: nowrap;
	}

	.article table th{
		background: #f5f5f5;
		font-weight: 600;
		color: #333;
	}

	.article table tr:nth-child(even){
		background: #f9f9f9;
	}

	/* 编辑器内容样式优化 - 只对没有内联样式的元素应用默认样式 */
	/* 只覆盖没有内联样式的 section */
	.article section:not([style]){
		margin: 1rem 0;
	}

	/* 只覆盖没有内联样式的 p */
	.article p:not([style]){
		margin: 1.2rem 0;
		line-height: 1.8;
		font-size: 1.6rem;
		color: #333;
	}

	.article strong:not([style]){
		font-weight: bold;
	}

	.article button:not([style]), .article input[type="button"]:not([style]), .article input[type="submit"]:not([style]){
		/* 按钮重置，使用编辑器定义的样式 */
		margin: 0;
		padding: 0;
		border: none;
		background: none;
		font: inherit;
		cursor: pointer;
		box-sizing: border-box;
	}

	/* 文章导航 */
	.post-navigation {
		margin: 1rem 0;
		padding: 1rem;
		background: #f9f9f9;
		font-size: 1.2rem;
		border-radius: 5px;
	}

	.post-prev,
	.post-next {
		display: block;
		width: 100%;
		margin-bottom: .5rem;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.post-navigation a {
		color: #06f;
	}

	/* 相关文章 */
	.related-posts {
		margin: 1.5rem 0;
		padding: 1.5rem;
		background: #f9f9f9;
		border-radius: 8px;
	}

	.related-posts h3 {
		font-size: 1.5rem;
		border-bottom: none;
		padding-bottom: 0;
		margin-bottom: 1rem;
		color: #333;
		border-left: 4px solid #06f;
		padding-left: 1rem;
		line-height: 1;
	}

	.related-posts li {
		display: block;
		width: 100%;
		line-height: 3.2rem;
		font-size: 1.3rem;
		padding-left: 1.2rem;
		position: relative;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		border-bottom: 1px dashed #e0e0e0;
	}

	.related-posts li:before {
		content: "";
		width: 4px;
		height: 4px;
		background: #06f;
		border-radius: 50%;
		position: absolute;
		left: 0;
		top: 1.4rem;
	}

	.related-posts a {
		color: #555;
		display: block;
	}


	/* 定制 */
	.write-btn {
		margin-bottom: 5rem;
	}

	.write-btn a {
		background: #06e;
		text-align: center;
		width: 50%;
		height: 4rem;
		line-height: 4rem;
		display: block;
		margin: 0 auto;
		color: #fff;
		border-radius: 10px;
		box-shadow: 0px 10px 20px #A4C8FF;
		transition: all .3s ease;
		font-size: 1.4rem;
	}

	.write-btn a:hover {
		background: #09f;
	}


	/* 免费 */
	.page-free ul {
		padding-bottom: 30px;
		overflow: hidden;
		margin-top: 20px;
	}

	.page-free h3 {
		background: #f9f9f9;
		padding: 1rem;
		font-size: 1.4rem;
		color: #666;
		margin-bottom: 1rem;
	}

	.page-free ul {
		padding: 0 1rem;
		margin-bottom: 1rem;
	}

	.page-free li {
		padding-left: 2.8rem;
		line-height: 250%;
		font-size: 1.2rem;
		position: relative
	}

	.page-free li::before {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 1.2rem;
		height: 1.2rem;
		background: linear-gradient(135deg, #06f 0%, #0066ff 100%);
		border-radius: 50%;
		box-shadow: 0 2px 6px rgba(0, 102, 255, .15)
	}

	.page-pinglun h3 {
		background: #f9f9f9;
		padding: 1rem;
		font-size: 1.4rem;
		color: #666;
		margin-bottom: 1rem;
	}
}

.leftFix {
	position: fixed;
	float: left;
	width: 320px;
	background: #f9f9f9;
	padding: 10px;
	padding-bottom: 0;
}