﻿/*
Theme Name:LeHuo New
新样式文件 - 蓝绿系配色，侧边栏在左布局
*/

/* 重置样式 */
article, aside, details, figcaption, figure, footer, header, main, nav, section {display:block;}
div,html,body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {margin:0; padding:0;}
body {background-color:#ECF0F1; font:100%/1.5em 'Microsoft Yahei',Arial,tahoma; color:#333;}
a {text-decoration:none; outline:none; -webkit-tap-highlight-color:transparent; color: #3498DB;cursor: pointer; transition: color 0.3s ease;}
a:hover {color:#16A085;}
input {-webkit-appearance:none; border:0;}
input:focus {outline:none;}
li {list-style:none;}
.clear {clear:both;}
a img {border:none;}
table {background-color: transparent; border-spacing: 0; border-collapse: collapse; font-size:0.75em; width:100%;border-top:solid 1px #ddd;border-left:solid 1px #ddd; box-sizing: border-box;}
table th{background-color:#f9f9f9;text-align:center; box-sizing: border-box;}
table td,table th{padding:5px 10px;border:1px solid #ddd; box-sizing: border-box;}
hr {border:none; border-bottom:1px solid #eee;}

/* 基础布局 */
.inner {width:1180px; margin:0 auto;}
.thumbnail img {width:100%; display:block;}
.blank {height:15px; width:100%; clear:both; overflow:hidden;}

/* 顶部广告 */
.topad {margin-bottom:20px;}
.topad img {width:100%; height:auto; display:block; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);}

/* Header样式 - 垂直导航结构 */
.header {background: linear-gradient(135deg, #2C3E50 0%, #34495E 100%); width:100%; padding: 15px 0; box-shadow: 0 2px 10px rgba(0,0,0,0.1);}
.logo-container {text-align: center; margin-bottom: 15px;}
.logo {display: inline-block; height:50px; width:auto;}
.logo a {display:block;}
.logo img {display:block; height:50px; width:auto;}

/* 导航菜单 */
.nav {width: 100%;}
.nav .menu ul {display: flex; justify-content: center; flex-wrap: wrap; gap: 0;}
.nav .menu ul li {line-height:40px; color:#fff; font-size:0.95em; position:relative;}
.nav .menu ul li a {color:#fff; padding:8px 20px; display:block; border-radius: 4px; transition: background-color 0.3s ease;}
.nav .menu ul li a:hover {background-color:#3498DB; color:#fff;}
.nav .menu ul li.current a {background-color:#16A085;}

/* 容器布局 - 侧边栏在左 */
.container {overflow:hidden; display: flex; gap: 20px; align-items: flex-start;}

/* 侧边栏 - 左侧 */
.sidebar {width:280px; flex-shrink: 0;}

/* 主内容区 - 右侧 */
.main {flex: 1; min-width: 0;}

/* 内容区域 - 卡片式设计 */
.content {background-color:#fff; margin-bottom:20px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.08); padding: 25px;}

/* 标题样式 */
.section-title {border-bottom: 2px solid #3498DB; padding-bottom: 10px; margin-bottom: 20px;}
.section-title h2, .section-title h3 {font-weight:normal; font-size:1.4em; color:#2C3E50; margin:0; padding-left: 10px; border-left: 4px solid #16A085;}

/* Widget样式 */
.widget {background-color:#fff; margin-bottom:20px; overflow:hidden; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); padding: 20px;}
.widget .section-title {margin-top: 0;}
.widget ul {padding:0; margin: 0;}
.widget ul li {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:0.9em; margin-bottom:12px; padding-bottom: 12px; border-bottom: 1px solid #ECF0F1;}
.widget ul li:last-child {border-bottom: none; margin-bottom: 0; padding-bottom: 0;}
.widget ul li a {color:#555; transition: color 0.3s ease; display: block;}
.widget ul li a:hover {color:#3498DB;}

/* 热门文章 */
.widget ul li .item-index {font-style:normal; font-size:0.8em; background:linear-gradient(135deg, #3498DB, #16A085); color:#fff; padding:4px 10px; margin-right:10px; border-radius: 4px; display: inline-block; min-width: 24px; text-align: center;}

/* 成功案例 */
.widget ul li.list p {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin: 0;}
.widget ul li.list .arrow {font-style:normal; color:#3498DB; margin-right: 8px;}

/* 联系我们 */
.widget .follow {padding:10px 0; text-align:center;}
.widget .follow img {margin:0 auto 15px; width:130px; height:130px; display: block; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);}
.widget .follow p {margin-bottom:10px; color:#555; line-height: 1.6;}

/* 内容列表 - 卡片式 */
.section {padding:20px 0; margin-bottom:25px; border-bottom:1px solid #ECF0F1; display: flex; gap: 20px; align-items: flex-start;}
.section:last-child {border-bottom: none; margin-bottom: 0;}
.section .thumbnail {flex-shrink: 0; width:200px; position:relative; border-radius: 6px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);}
.section .thumbnail img {height:150px; object-fit: cover; transition: transform 0.3s ease;}
.section .thumbnail:hover img {transform: scale(1.05);}
.section-content {flex: 1;}
.section h3 {font-weight:normal; font-size:1.3em; margin-bottom:12px; line-height: 1.4;}
.section h3 a {color:#2C3E50; transition: color 0.3s ease;}
.section h3 a:hover {color:#3498DB;}
.section .excerpt p {font-size:0.95em; color:#666; line-height: 1.8; margin: 0;}

/* 文章元信息 */
.postmeta {margin-bottom:15px; font-size:0.85em; color:#999; display: flex; gap: 15px; flex-wrap: wrap;}
.postmeta span {display: flex; align-items: center;}
.postmeta time {color:#7F8C8D;}

/* 面包屑导航 */
.breadcrumb {font-size:0.9em; color:#666; margin:0 0 20px 0; padding:15px 20px; background-color:#F8F9FA; border-radius: 6px; border-left: 4px solid #3498DB;}
.breadcrumb span {display: flex; align-items: center; gap: 8px;}
.breadcrumb .icon-home {color:#3498DB;}

/* 文章内容 */
.post {overflow:hidden;}
.post h1.post-title {font-size:1.6em; margin-bottom:15px; color:#2C3E50; line-height: 1.4; font-weight: 500;}
.post .postmeta {border-bottom:1px solid #ECF0F1; padding-bottom:12px; margin-bottom: 20px;}
.post .entry {color:#333; line-height: 1.8;}
.post .entry-content {font-size:1em; line-height:1.8em; color:#444;}
.post .entry p {font-size:1em; line-height:1.8em; margin-bottom:20px;}
.post .entry ul,.post .entry ol,.post .entry hr,.post .entry blockquote,.post .entry h1,.post .entry h2,.post .entry h3,.post .entry h4,.post .entry h5,.post .entry h6 {margin-bottom:20px;}
.post .entry h1,.post .entry h2,.post .entry h3,.post .entry h4,.post .entry h5,.post .entry h6 {border-left: 4px solid #16A085; padding-left: 15px; font-weight:500; color:#2C3E50;}
.post .entry li {font-size:1em;}
.post .entry ul,.post .entry ol {padding-left:2em;}
.post .entry ul li {list-style:disc; margin-left:1px;}
.post .entry ol li {list-style:decimal;}
.post .entry blockquote {overflow:hidden; border:1px solid #ECF0F1; border-left:4px solid #3498DB; background-color:#F8F9FA; color:#555; padding:15px 20px; font-size:0.95em; margin:0 0 20px 0; border-radius:4px;}
.post .entry a {color:#3498DB; text-decoration: underline;}
.post .entry a:hover {color:#16A085;}
.post .entry img {max-width:100%; height:auto; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);}

/* 文章导航 - 上一篇/下一篇 */
.postnavi {margin-top:30px; padding-top:20px; border-top:2px solid #ECF0F1; display: flex; justify-content: space-between; gap: 15px;}
.postnavi .prev, .postnavi .next {flex: 1;}
.postnavi .prev {text-align: left;}
.postnavi .next {text-align: right;}
.postnavi a {display: inline-block; padding: 10px 15px; background-color: #F8F9FA; border-radius: 6px; color:#555; font-size:0.9em; transition: all 0.3s ease; border: 1px solid #ECF0F1;}
.postnavi a:hover {background-color: #3498DB; color:#fff; border-color: #3498DB;}
.postnavi i {font-style:normal; margin: 0 5px;}

/* 分页导航 */
.pagenavi {text-align:center; margin-top:30px; padding-top:20px; border-top:2px solid #ECF0F1; display: flex; justify-content: center; gap: 8px; flex-wrap: wrap;}
.pagenavi a,.pagenavi span {background-color:#F8F9FA; border:1px solid #ECF0F1; padding:8px 14px; font-size:0.9em; color:#555; border-radius: 6px; transition: all 0.3s ease; min-width: 40px; text-align: center;}
.pagenavi a:hover {background-color:#3498DB; color:#fff; border-color:#3498DB;}
.pagenavi .page-current {background:linear-gradient(135deg, #3498DB, #16A085); color:#fff; border-color:#3498DB;}

/* Footer样式 - 添加底部导航栏 */
.footer {background: linear-gradient(135deg, #2C3E50 0%, #34495E 100%); color:#ECF0F1; width:100%;}
.footer-nav {border-bottom: 1px solid rgba(255,255,255,0.1); padding: 20px 0;}
.footer-menu ul {display: flex; justify-content: center; flex-wrap: wrap; gap: 30px;}
.footer-menu ul li {list-style: none;}
.footer-menu ul li a {color:#ECF0F1; font-size:1em; padding: 8px 15px; border-radius: 4px; transition: all 0.3s ease;}
.footer-menu ul li a:hover {background-color: rgba(255,255,255,0.1); color:#fff;}

.footer-info {padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,0.1);}
.footer-contact {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px;}
.footer-contact .copyright {display: flex; gap: 20px; flex-wrap: wrap;}
.footer-contact .copyright a, .footer-contact .other a {color:#ECF0F1; font-size:0.95em; transition: color 0.3s ease;}
.footer-contact .copyright a:hover, .footer-contact .other a:hover {color:#3498DB;}

.footer-copyright {padding: 15px 0;}
.footer-copyright .inner {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px;}
.footer-copyright .copyright {font-size:0.85em; color:#BDC3C7;}
.footer-copyright .other a {color:#BDC3C7; font-size:0.85em; transition: color 0.3s ease;}
.footer-copyright .other a:hover {color:#3498DB;}

/* 响应式设计 */
@media only screen and (max-width:1200px){
	.inner {width:1024px;}
	.nav .menu ul li {font-size:0.9em;}
	.sidebar {width:260px;}
	.main {flex: 1;}
}

@media only screen and (max-width:1060px){
	.inner {width:960px;}
	.nav .menu ul li a {padding:8px 15px;}
	.sidebar {width:240px;}
	.section .thumbnail {width:180px;}
	.section .thumbnail img {height:130px;}
}

@media only screen and (max-width:980px){
	.inner {width:96%;}
	.header {padding: 12px 0;}
	.logo img {height:45px;}
	.nav .menu ul {flex-direction: column; gap: 5px;}
	.nav .menu ul li {width: 100%; text-align: center;}
	.nav .menu ul li a {padding: 10px 15px;}
	.container {flex-direction: column;}
	.sidebar {width: 100%;}
	.main {width: 100%;}
	.content {padding: 20px;}
	.section {flex-direction: column;}
	.section .thumbnail {width: 100%;}
	.section .thumbnail img {height: auto; width: 100%;}
	.footer-menu ul {gap: 15px;}
	.footer-contact {flex-direction: column; text-align: center;}
	.footer-copyright .inner {flex-direction: column; text-align: center;}
}

@media only screen and (max-width:800px){
	.inner {width:96%;}
	.logo img {height:40px;}
	.nav .menu ul li a {padding: 8px 12px; font-size: 0.9em;}
	.content {padding: 15px;}
	.section-title h2, .section-title h3 {font-size: 1.2em;}
	.post h1.post-title {font-size: 1.4em;}
	.widget {padding: 15px;}
	.footer-nav {padding: 15px 0;}
	.footer-info {padding: 15px 0;}
	.footer-copyright {padding: 12px 0;}
}

@media only screen and (max-width:640px){
	.header {padding: 10px 0;}
	.logo img {height:35px;}
	.nav .menu ul li a {padding: 8px 10px; font-size: 0.85em;}
	.topad {margin-bottom: 15px;}
	.content {padding: 12px;}
	.section {padding: 15px 0;}
	.section-title h2, .section-title h3 {font-size: 1.1em;}
	.post h1.post-title {font-size: 1.3em;}
	.post .entry p {font-size: 0.95em;}
	.widget {padding: 12px; margin-bottom: 15px;}
	.widget .follow img {width: 100px; height: 100px;}
	.postnavi {flex-direction: column;}
	.postnavi .prev, .postnavi .next {text-align: center;}
	.pagenavi {gap: 5px;}
	.pagenavi a, .pagenavi span {padding: 6px 10px; font-size: 0.85em;}
	.footer-menu ul {flex-direction: column; gap: 10px;}
	.footer-contact .copyright {flex-direction: column; gap: 10px;}
}

@media only screen and (max-width:480px) {
	.header {padding: 8px 0;}
	.logo img {height:30px;}
	.nav .menu ul li a {padding: 6px 8px; font-size: 0.8em;}
	.content {padding: 10px;}
	.section {padding: 12px 0;}
	.section-title h2, .section-title h3 {font-size: 1em; padding-left: 8px;}
	.post h1.post-title {font-size: 1.2em;}
	.post .postmeta {font-size: 0.8em;}
	.post .entry p {font-size: 0.9em; line-height: 1.6;}
	.widget {padding: 10px; margin-bottom: 12px;}
	.widget ul li {font-size: 0.85em; margin-bottom: 10px;}
	.widget .follow img {width: 90px; height: 90px;}
	.breadcrumb {padding: 10px 12px; font-size: 0.85em;}
	.postnavi a {padding: 8px 12px; font-size: 0.85em;}
	.pagenavi a, .pagenavi span {padding: 5px 8px; font-size: 0.8em; min-width: 35px;}
	.footer-nav {padding: 12px 0;}
	.footer-info {padding: 12px 0;}
	.footer-copyright {padding: 10px 0;}
	.footer-copyright .copyright, .footer-copyright .other a {font-size: 0.8em;}
}

@media only screen and (max-width:360px) {
	.widget .follow img {width: 80px; height: 80px;}
	.pagenavi a, .pagenavi span {padding: 4px 6px; font-size: 0.75em; min-width: 30px;}
}

