/*
Theme Name:zblogcms
Theme Url:https://www.boke8.net/
*/
* {-webkit-tap-highlight-color:transparent;}
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:#f7f5f5; font:100%/1.5em Arial,"Lucida Grande","Microsoft Yahei","Hiragino Sans GB","Hiragino Sans GB W3",SimSun,"PingFang SC",STHeiti; overflow-x:hidden; transition:padding 0.2s ease 0s;}
a {text-decoration:none; outline:none; color:#333;}
a:hover {color:#F13F3F;}
input {-webkit-appearance:none;}
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;}
/*gold*/
.inner {width:1200px; margin:0 auto;}
.thumbnail {position:relative; overflow:hidden;}
.thumbnail a {display:block; padding-bottom:75%; position:relative; overflow:hidden;}
.thumbnail img {position:absolute; left:0; top:0; width:100%; height:auto; min-height:100%;}
.ad img {display:block; width:100%; height:auto;}
h3.title {font-size:1.125em; font-weight:normal; margin-bottom:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-bottom:1px solid #eee; padding-bottom:10px;}
h3.title.divtitle {text-align:center; font-weight:lighter; color:#888;}
.listad {margin-bottom:20px;}
/*header*/
#header {background-color:#fff; box-shadow:0px 0px 10px #ccc; position:relative; margin-bottom:20px;}
#header .inner {position:relative;}
/*breadcrumb*/
#breadcrumb {clear:both; width:100%; margin-top:-20px; font-size:0.75em; padding:8px 0 5px; color:#888;}
#breadcrumb a {color:#888;}
#breadcrumb i {font-style:normal; font-family:'Simsun'; margin:0 3px;}
/*logo*/
.logo {float:left; padding:15px 0;}
.logo a {display:block; width:170px; height:40px; background:no-repeat left center; background-size:contain; text-indent:-99999em; overflow:hidden;}
/*navbtn*/
.navbtn {position:absolute; left:0; top:13px; font-size:1.5em; color:#F13F3F; cursor:pointer; display:none;}
/*nav*/
.nav {margin-left:170px; margin-right:90px;}
.nav ul {float:right;}
.nav li {float:left; line-height:70px; font-size:18px; padding:0 20px; text-align:center; position:relative; overflow:hidden;}
.nav li.open {overflow:visible;}
.nav li a {display:block; padding:0 5px; transition:color 0.3s ease 0s; position:relative; z-index:5; overflow:hidden; background-color:#fff; white-space: nowrap;}
.nav li a i {font-size:12px; color:#ccc; transition:transform 0.3s ease 0s;}
.nav li a:hover i.fa-caret-down {transform:rotate(180deg);}
.nav li.cur > a,
.nav li a.on {color:#F13F3F;}
.nav li ul {position:absolute; left:50%; top:0; margin-left:-75px; width:150px; background-color:#fff; background:rgba(255,255,255,.9); box-shadow:0px 0px 2px #ddd; padding:0 0 10px; z-index:3; opacity:0; float:none;}
.nav li ul.drop {top:70px; opacity:1; transition:all 0.5s ease 0s; }
.nav li li {float:none; width:auto; text-align:center; line-height:normal;}
.nav li li a {padding:10px 0; background-color:transparent;}

/*another*/
.another {position:absolute; right:0; top:50%; transform:translateY(-50%);}
.another ul {overflow:hidden;}
.another li {font-size:14px; float:left; padding-left:5px; position:relative; overflow:hidden;}
.another li.on {overflow:visible;}
.another li a {display:block; float:left; border:1px solid #dedede; height:35px; line-height:35px; width:35px; text-align:center; transition:all 0.2s ease 0s; border-radius:2px; background-color:#fff; position:relative; overflow:hidden; z-index:6;}
.another li a:hover,.another li.on > a {background-color:#2f3c4e; border-color:#2f3c4e; color:#fff;}
.another li.rss a {border-color:#ff9101; background-color:#ff9101; color:#fff;}
.another li .loginform {position:absolute; right:0; top:22px; width:250px; background-color:#fff; box-shadow:0px 0px 2px #ccc; padding:20px 25px 15px; z-index:5; opacity:0;}
.another li .loginform.open {top:52px; opacity:1; transition:0.3s ease 0s;}
.another li .loginform .arrow {position:absolute; right:25px; top:-6px; border-left:1px solid #ddd; border-top:1px solid #ddd; height:10px; width:10px; display:block; transform:rotate(45deg); background-color:#fff; z-index:1;}
.another li .loginform p {overflow:hidden; padding:5px 0;}
.another li .loginform label {display:block; float:left; font-size:1em; width:44px; height:40px; line-height:40px; border:1px solid #ddd; border-right:0; text-align:center; border-radius:3px 0 0 3px; color:#888;}
.another li .loginform .text {border:1px solid #ddd; padding:8px 5px; float:left; width:193px; border-radius:0 3px 3px 0; font-size:1em; height:24px; line-height:24px; border-left:none; color:#333;}
.another li .loginform .text.verify {width:100px;}
.another li .loginform .submit {display:block; width:100%; background-color:#F13F3F; color:#fff; border:none; padding:10px 0; cursor:pointer; font-size:1em; border-radius:3px;}
.another li .loginform a {border:none; display:inline; float:none; height:auto; line-height:normal; padding:0; border-radius:0; background-color:transparent; color:#555; font-size:0.875em;}
.another li .loginform p span {padding:0 10px; color:#555;}
/*searchform*/
.searchform {position:absolute; left:0; top:71px; width:100%; background:rgba(255,255,255,.8); padding:20px 0; display:none; z-index:3;}
.searchform .inner {width:760px;}
.searchform .s {float:left; height:25px; line-height:25px; padding:8px 5px; border:1px solid #ddd; border-radius:3px; width:670px; font-size:1em;}
.searchform .submit {float:right; display:block; width:60px; background-color:#F13F3F; color:#fff; border:1px solid #F13F3F; height:43px; font-size:1em; border-radius:3px; cursor:pointer;}
/*container*/
#container {overflow:hidden;}
/*main*/
.main {float:left; width:850px;}
/*owl-carousel*/
.owl-carousel {display: none; width: 100%; -webkit-tap-highlight-color: transparent; position: relative; z-index: 1;}
.owl-carousel img {width:100%; height:auto; display:block;}
.owl-carousel .owl-stage {position: relative; -ms-touch-action: pan-Y;
 -moz-backface-visibility: hidden;}
.owl-carousel .owl-stage:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
.owl-carousel .owl-stage-outer {position: relative; -webkit-transform: translate3d(0px, 0px, 0px); }
.owl-carousel .owl-wrapper,.owl-carousel .owl-item {-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); }
.owl-carousel .owl-item {position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; }
.owl-carousel .owl-nav.disabled,.owl-carousel .owl-dots.disabled { display: none;}
.owl-carousel .owl-nav .owl-prev,.owl-carousel .owl-nav .owl-next {cursor: pointer; cursor: hand; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-indent:-9999em; width:14px; height:24px; position:absolute; top:50%; margin-top:-12px;}
.owl-carousel .owl-nav .owl-prev {background:url(images/arrows.png) no-repeat 0 0; left:10px;}
.owl-carousel .owl-nav .owl-next {background:url(images/arrows.png) no-repeat 0 -36px; right:10px;}
.owl-carousel.owl-loaded {display: block; }
.owl-carousel.owl-loading {opacity: 0; display: block; }
.owl-carousel.owl-hidden {opacity: 0; }
.owl-carousel.owl-refresh .owl-item { visibility: hidden; }
.owl-carousel.owl-drag .owl-item {-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; opacity:0.2;}
.owl-carousel.owl-drag .owl-item.active {opacity:1;}
.owl-carousel.owl-grab { cursor: move; cursor: grab;}
.owl-carousel.owl-rtl {direction: rtl; }
.owl-carousel.owl-rtl .owl-item {float: right; }
.no-js .owl-carousel {display: block; }
.owl-carousel .animated {animation-duration: 1000ms; animation-fill-mode: both; }
.owl-carousel .owl-animated-in { z-index: 0; }
.owl-carousel .owl-animated-out { z-index: 1; }
.owl-carousel .fadeOut { animation-name: fadeOut; }
@keyframes fadeOut {0% {opacity: 1; }100% {opacity: 0; }}
.owl-height {transition: height 500ms ease-in-out; }
.owl-carousel .owl-item .owl-lazy {opacity: 0;  transition: opacity 400ms ease; }
.owl-carousel .owl-item img.owl-lazy {transform-style: preserve-3d; } 
.owl-nav .disabled { opacity: 0.5; cursor: default; }
.owl-nav.disabled + .owl-dots { margin-top: 10px; }
.owl-dots { position:absolute; bottom:0px; width:100%; left:0;}
.owl-dots .owl-dot {float:left; cursor:pointer; width:25%;}
.owl-dots .owl-dot span {width:100%; height:8px; background:rgba(0,0,0,.7);  display: block;  -webkit-backface-visibility: visible;  transition: opacity 200ms ease; }
.owl-dots .owl-dot.active span,.owl-dots .owl-dot:hover span {background: #869791;}


/*slides*/
.slides {overflow:hidden; margin-bottom:20px; position:relative; z-index:1; background-color:#fff;}
.slides .load {padding-bottom: 52.942%; position:relative;}
.slides .load i {font-size:14px; color:#ddd; position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; text-align:center; line-height: 1.75em;}
.slides a {display: block; overflow:hidden; position:relative; padding-bottom: 52.942%; background:no-repeat center center; background-size:cover; color:#fff;}
.slides h2 {position:absolute; left:0; bottom:0; width:90%; background:rgba(0,0,0,.7); font-weight:normal; font-size:14px; line-height: 1.75em; padding:5px 5%; white-space: nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff;}
/*home_top*/
.home_top ul {overflow:hidden; width:102%;}
.home_top li {float:left; width:23%; padding-right:2%;}
.home_top li .thumbnail {margin-bottom:5px;}
.home_top li h4 {font-size:14px; line-height:1.75em; height:3.5em;}
.home_top li h4 a {display:block;}
/*catebox*/
.catebox {background-color:#fff; border:1px solid #eee; padding:15px; overflow:hidden; position:relative; margin-bottom:20px;}
.catebox .more {position:absolute; right:15px; top:15px; font-size:0.75em;}
.catebox .more a {color:#999;}
.catebox h4 {font-size:16px; font-weight: normal; line-height: 1.75em; height:3.5em; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin-bottom: 5px;}
.catebox img {transition:transform 0.3s ease 0s;}
.catebox img:hover {transform:scale(1.2,1.2);}
.catebox .meta {color:#999; overflow:hidden; font-size:0; line-height: normal;}
.catebox .meta span {font-size:12px; line-height: 2em; display: inline-block; padding-right:8px; margin-right:8px; position:relative;}
.catebox .meta .cmts {margin-right: 0; padding-right: 0; float:right;}
.catebox .meta .cmts:after {display: none;}
/*boxitem*/
.boxFirst {float:left; width:370px; overflow:hidden;}
.boxFirst .thumbnail {margin-bottom:10px;}
.boxFirst h4 {font-weight: bold;}
.boxFirst .meta span:after {width: 1px; height: 10px; background-color:#eee; content:''; display: block; position:absolute; right:0; top:50%; margin-top:-5px;}
.boxFirst .excerpt {font-size:14px; line-height: 2em; height:8em; color:#666; overflow:hidden; text-align:justify; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical;  border-top:1px solid #eee; padding-top: 8px; margin-top: 8px;}
/*boxitem*/
.boxitem {margin:0 0 15px 385px; overflow:hidden;}
.boxitem:last-child {margin-bottom: 0;}
.boxitem .thumbnail {float:left; width:120px;}
.boxitem .info {margin-left: 130px; overflow: hidden;}
.boxitem .meta .views {float:right;}

/*blogList*/
.blogList,.post,.related,.commentslist,.commentform {background-color:#fff; padding:15px; overflow:hidden; margin-bottom:20px; border:1px solid #eee;}
.blogList .thumbnail {float:left; width:300px;}
.blogList .info {margin-left: 315px; overflow: hidden;}
.blogList h2 {font-size:20px; line-height: 1.5em; font-weight:normal; margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.blogList .meta {font-size:12px; line-height: 2em; color:#999; border-bottom:1px solid #eee; overflow:hidden;}
.blogList .meta span {border-right:1px solid #eee; float:left; padding-right:10px; margin-right:10px;}
.blogList .meta .cmts,.blogList .meta .good {float:right; border:none; padding-right:0; margin-right:0; margin-left:10px;}
.blogList .intro {font-size:14px; line-height: 1.875em; color:#555; overflow:hidden; height:9.375em;}
/*post*/
.post,.related,.commentslist,.commentform {padding:20px;}
.post h1.post-title {font-size:1.75em; font-weight:normal; margin-bottom:10px; line-height:1.5em;}
.post h1.post-title.page-title {text-align:center;}
/*post*/
.postmeta {font-size:12px; line-height: 2em; margin-bottom:10px; border-bottom:1px solid #eee;}
.postmeta span {margin-right:8px; color:#aaa;}
.postmeta span a {color:#aaa;}
/*entry*/
.entry {color:#222; font-size: 16px; line-height: 1.875em;}
.entry a {color:#F13F3F;}
.entry a:hover {text-decoration: underline;}
.entry p {margin-bottom: 2.5%;}
.entry img {max-width:100%; height:auto!important;}
.entry ul,
.entry ol {padding-left:1em; margin-left:2em; margin-bottom: 2.5%;}
.entry ul li {list-style:outside disc none;}
.entry ol li {list-style:outside decimal none;}
.entry li p {margin-bottom: 0;}
.entry blockquote {overflow:hidden; margin:0 2em 2.5%; padding:2.5% 2.5% 0; border:1px solid #bbd2e8; background-color:#eff6fc; box-shadow: 0 2px 0 rgba(158,186,212,.24); border-radius: 5px; color:#0077b5; text-align:justify; font-style:italic;}
.entry h1,
.entry h2,
.entry h3,
.entry h4,
.entry h5,
.entry h6 {margin-bottom: 2.5%;}

.post .tags {font-size:0.75em; clear:both; margin-top:10px; color:#999;}
.post .tags a {color:#999; margin:0 4px;}
.post .tags a:hover {text-decoration:underline;}
.post .ad {margin-top:10px;}
/*postnavi*/
.postnavi {overflow:hidden; font-size:16px; line-height:1.875em; margin-bottom:15px;}
.postnavi a {display:block; color:#999; overflow:hidden;}
.postnavi p {white-space: nowrap; overflow:hidden; text-overflow:ellipsis;}
.postnavi .small {font-size:14px;}
.postnavi .fas {position:absolute; top:50%; transform:translateY(-50%); font-size:3em; display:block; color:#999;}
.postnavi .left {position:relative; float:left; width:48%; overflow:hidden;}
.postnavi .left .fas {left:0;}
.postnavi .left a {padding-left:40px;}
.postnavi .right {position:relative; float:right; width:48%; text-align:right; overflow:hidden;}
.postnavi .right .fas {right:0;}
.postnavi .right a {padding-right:40px;}
/*related*/
.related ul {overflow:hidden; width:102%;}
.related li {float:left; width:31.33%; padding:1% 2% 1% 0;}
.related li .thumbnail {margin-bottom:5px;}
.related li img {transition:transform 0.3s ease 0s;}
.related li img:hover {transform:scale(1.3,1.3);}
.related li h4 {font-weight:normal; font-size:14px; line-height:2em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
/*commentslist*/
.commentslist ol {overflow:hidden;}
.commentslist li {overflow:hidden; padding:10px 0;}
.commentslist li .wrap {position:relative; padding-left:60px; border-bottom:1px solid #eee;}
.commentslist li .gravatar {position:absolute; left:0; top:0;}
.commentslist li img {width:50px; height:50px; border-radius:50%;}
.commentslist li span.date {float:right; font-size:0.75em; color:#999;}
.commentslist li .content {padding:5px 55px 15px 0; font-size:0.875em; color:#555;}
.commentslist li .replay {position:absolute; right:0; bottom:0; font-size:0.75em; overflow:hidden;}
.commentslist li .replay a {background-color:#eee; padding:0 10px; float:right;}
.commentslist li li {margin-left:35px; margin-top:20px; padding:5px 0;}
.commentslist .pagenavi {margin-bottom:0;}
.commentslist .warning {text-align:center; font-size:0.875em; color:#999;}
.commentslist li .content #comment {margin-top:15px;}
.commentslist li .content #comment textarea {font-size:1em;}
.commentslist li .content #comment .text {width:45%;}
.commentslist li .content #comment .text.verify {width:35%;}
.commentslist li .content #comment .clear {clear:both;}
/*comment*/
#comment {background-color:#fff;}
#comment .textarea {border:1px solid #eee; padding:5px;}
#comment textarea {border:none; width:100%; height:150px; resize:vertical; font-size:0.875em;}
#comment .input {background-color:#f9f9f9; position:relative; padding:10px 0; border:1px solid #eee; border-top:none; margin-bottom:5px; overflow:hidden;}
#comment label {font-size:0.75em; color:#555; padding:0 5px 0 10px; display:block; float:left; border:1px solid transparent; height:28px; line-height:28px;}
#comment .text {border:1px solid #ddd; font-size:0.875em; height:18px; line-height:18px; padding:5px 0; text-indent:5px; width:140px; display:block; float:left;}
#comment .text.verify {width:100px;}
#comment img {width:87px; height:29px; cursor:pointer; display:block; float:left; border-radius:0;}
#comment .submit {display:block; width:100%; background-color:#F13F3F; color:#fff; cursor:pointer; border-radius:3px; border:none; padding:8px 0; font-size:0.75em; margin-top:5px;}
.commentform .warning {font-size:0.75em; margin-bottom:10px; color:#888;}
a#cancel-reply {text-align:center; font-size:0.75em; color:#999; padding:5px 0; display:block;}
#comment .clear {clear:none;}
/*pagenavi*/
.pagenavi {overflow:hidden; clear:both; font-size:0; line-height:normal; margin-bottom:20px;}
.pagenavi a,.pagenavi span.now-page {font-size:14px; height:35px; line-height:35px; display:inline-block; background-color:#fff; margin-right:5px; border:1px solid #eee; color:#555; padding:0 14.5px;}
.pagenavi a:hover,.pagenavi span.now-page {background-color:#F13F3F; color:#fff;}
/*sidebar*/
.sidebar {float:right; width:330px;}
.widget {margin-bottom:20px; background-color:#fff; border:1px solid #eee;}
.widget .textwidget img {display:block; width:100%; height:auto; margin:0 auto;}
.widget h3 {padding-top:15px; margin:0 15px;}
.widget ul {padding:7px 15px; overflow:hidden;}
.widget ul li {font-size:0.875em; text-align:justify; padding:5px 0; position:relative; overflow:hidden;}
.widget ul li a {display:block; transition:all 0.2s ease 0s;}
.widget ul.divComments li {font-size:0.75em; color:#999; line-height:1.75em;}
.widget ul.divComments li a {padding-left:43px; position:relative; color:#999;}
.widget ul.divComments li a:hover,.widget ul.divComments li a:hover i {color:#333;}
.widget ul.divComments li a:hover img {transform:rotate(360deg);}
.widget ul.divComments img.avatar {width:35px; height:35px; border-radius:50%; position:absolute; left:0; top:4px; transition:transform 0.5s ease 0s;}
.widget ul.divComments li i {font-style:normal; display:block; color:#666;}
.widget ul.divTags li {float:left; font-size:0.75em;}
.widget ul.divTags li a {display:block; float:left; background-color:#eee; padding:0 8px; border-right:1px solid #fff; transition:all 0.2s ease 0s;}
.widget ul.divTags li a:hover {color:#fff; background-color:#2f3c4e;}
.widget ul.hotposts .thumbnail {float:left; width:100px; margin-top:2px; margin-right:10px; display:inline-block;}
.widget ul.hotposts h4 {font-weight:normal; font-size:1em; height:48px; overflow:hidden;}
.widget ul.hotposts p {font-size:0.75em; color:#999;}
.widget ul.hotposts img {transition:transform 0.3s ease 0s;}
.widget ul.hotposts img:hover {transform:scale(1.2,1.2);}
.widget ul.divLinkage li {float:left; width:50%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.widget form {margin:15px; overflow:hidden;}
.widget input[type='text'] {border:1px solid #ddd; height:18px; line-height:18px; padding:5px 0; text-indent:5px; width:80%; float:left;}
.widget input[type='submit'] {border:none; cursor:pointer; background-color:#F13F3F; color:#fff; height:30px; padding:0 5px; float:right;}
/*nofound*/
.nofound {padding:50px 0; text-align:center; color:#888; font-weight:lighter;}
.nofound h2 {font-size:3em; font-weight:lighter; line-height:1.5em;}
.nofound p {padding:5px 0;}
.nofound a {color:#F13F3F; text-decoration:underline;}
/*footer*/
#footer {background-color:#323232; color:#c2c2c2;}
#footer .inner {overflow:hidden; position:relative; display: table; table-layout: fixed;}

/*btmBox*/
.btmBox {display: table-cell; vertical-align: top; text-shadow:0px 1px 0px #000; padding:35px 0;}
.btmBox h3 {font-size:16px; margin-bottom:15px; text-shadow:0px 1px 0px #000;}
.btmBox p {font-size:14px; line-height: 2em; text-align:justify;}
/*btmBox*/
#about {width: 40%; border-right:1px solid #444; padding-right: 5%;}
/*btmBox*/
#contact {width:40%; padding-left:5%; padding-right:5%; border-right:1px solid #444; border-left:1px solid #222;}
/*btmBox*/
#follow {width:250px; padding-left: 60px; border-left:1px solid #222;}
#follow ul {overflow: hidden;}
#follow li {float:left; width: 47%;}
#follow li:last-child {float:right;}
#follow img {display:block; width:100%; height:auto;}

/*backtop*/
.backtop {position:fixed; right:20px; bottom:50px; background-color:#F13F3F; color:#fff; font-size:2em; width:45px; height:45px; line-height:45px; text-align:center; cursor:pointer; border-radius:3px; opacity:0.8; transition:opacity 0.3s ease 0s; z-index:6;}
.backtop:hover {opacity:1;}

/*footer*/
#copyright {background-color:#222; font-size:12px; line-height: 2em; text-align:center; padding:15px 0; color:#a2a2a2; clear:both;}
#copyright a {color:#a2a2a2;}
#copyright a:hover {color:#eee;}
/*screen width*/
@media only screen and (max-width:1280px){
	/*1280*/
	.nav li {font-size:16px;}
}
@media only screen and (max-width:1240px){
	.inner {width:1060px;}
	.main {width:750px;}
	.sidebar {width:290px;}
	
	
	#comment .text {width:120px;}
	#comment .text.verify {width:80px;}

	/*1280*/
	.boxFirst {width: 320px;}
	/*1280*/
	.boxitem {margin-left: 335px;}
	.boxitem .thumbnail {width: 108px;}
	.boxitem .info {margin-left: 118px;}
	.boxitem h4 {margin-bottom: 0;}
}
@media only screen and (max-width:1100px){
	.inner {width:960px;}
	.main {width:670px;}
	.sidebar {width:270px;}
	#comment .text {width:110px;}
	#comment label {padding:0 5px;}
	#comment .text.verify {width:60px;}

	.nav li {padding:0 12px;}
}
@media only screen and (max-width:1024px){
	/*1024*/
	.logo a {width:150px; height:35px;}
	/*1024*/
	.nav {margin-left:150px;}
	.nav li {line-height: 65px;}
	.nav li ul {width:120px; margin-left:-60px;}
	.nav li ul.drop {top:65px;}
	/*1024*/
	.main,
	.sidebar {width: auto; float:none;}
	/*1024*/
	#footer {padding:3.125% 0;}
	#footer .inner {display: block;}
	/*1024*/
	.btmBox {display: block;}
	/*1024*/
	#about {width: auto; padding:3.125% 0; border-right: 0; border-bottom:1px solid #444; overflow: hidden;}
	/*1024*/
	#follow {float:right; border-left:none; border-top:1px solid #222; width: 35%; padding:3.125% 0;}
	/*1024*/
	#contact {float:left; border:none; border-top:1px solid #222; width: 55%; padding:3.125% 5% 3.125% 0;}
}
@media only screen and (max-width:1000px) and (min-width:860px){
	#comment .text {width:200px; margin:2px 0;}
	#comment label {padding:0 10px; margin:2px 0;}
	#comment img {margin-top:2px;}
	#comment .text.verify {width:100px;}
}
@media only screen and (max-width:1000px){
	.inner {width:820px;}
	#header {margin-bottom:10px;}
	
	
	.searchform {top:67px;}
	.searchform .inner {width:560px;}
	.searchform .s {width:478px;}
	.widget,.catebox,.blogList,.pagenavi {margin-bottom:10px;}
	
	
	h3.title {margin-bottom:10px; padding-bottom:5px;}
	.widget h3 {padding-top:10px; margin:0 10px;}
	.widget ul {padding:5px 10px;}
	.widget ul.hotposts h4 {line-height:1.5em; height:42px;}
	.widget ul.hotposts .thumbnail {width:80px; height:56px; margin-right:5px; margin-top:4px;}
	.widget ul.hotposts li {padding:2px 0;}
	.widget ul.divComments li {line-height:1.5em;}
	

	
	.post, .related, .commentslist, .commentform {padding:15px; margin-bottom:10px;}
	.listad {margin-bottom:10px;}
	/*1000*/
	.slides {margin-bottom: 10px;}
	/*1000*/
	.another li {font-size:12px;}
	.another li a {width:30px; height:30px; line-height:30px;}
	.another li .loginform.open {top:48px;}
	/*1000*/
	.logo a {width:128px; height:30px;}
	/*1000*/
	.nav {margin-left:130px; margin-right:75px;}
	.nav li {line-height: 60px; font-size:14px; padding:0 10px;}
	/*1000*/
	.blogList .thumbnail {width:230px;}
	.blogList .info {margin-left:245px;}
	.blogList h2 {font-size:18px; margin-bottom:5px;}
	.blogList .intro {height: 7.5em;}
	.blogList .meta {margin-bottom:5px;}
	/*1000*/
	.catebox {padding:10px;}	
}
@media only screen and (max-width:860px){
	body.open {position:fixed; left:0px; overflow:hidden; top:0; width:100%; height:100%;}
	body.open #header .inner,body.open #container,body.open #footer {margin-right:-150px;}
	.inner {width:93%;}
	
	
	
	.navbtn {display:block;}
	.searchform {top:51px; padding:10px 0;}
	.searchform .s {padding:5px;}
	.searchform .submit {height:36px; font-size:0.875em;}
	.another li .loginform.open {top:41px;}
	
	
	.home_top li {padding-top:5px; padding-bottom:5px;}
	#breadcrumb {margin-top:-10px;}
	.post h1.post-title {font-size:1.5em;}

	/*860*/
	.logo {float:none;}
	.logo a {width:85px; height:20px; margin:0 auto; overflow:hidden;}
	/*860*/
	.another li a {width:25px; height:25px; line-height: 25px;}
	/*860*/
	.nav {background-color:#fff; position:fixed; left:-160px; top:0; height:100%; width:160px;  z-index:9;  overflow:hidden; overflow-y: auto; -webkit-overflow-scrolling:touch; margin:0;}
	.nav.open {left:0; box-shadow:1px 0px 2px #ddd;}
	.nav ul {margin:20px 0; float:none;}
	.nav li {float:none; width:auto; line-height:normal; text-align:left;}
	.nav li a {padding:10px 10px 10px 20px; background-color:transparent;}
	.nav li a:hover i.fa-caret-down {transform:none;}
	.nav li a.on {color:#333;}
	.nav li ul {position:static; left:auto; top:auto; margin:0; width:auto; background-color:transparent; box-shadow:none; padding:0; opacity:1; border:none; border-bottom:1px solid #eee; border-top:1px solid #eee;}
	.nav li li {text-align:left;}
	.nav li li a {padding:10px 10px 10px 20px;}
	.nav li ul.drop {top:0; margin:0; width:100%;}
}
@media only screen and (max-width:768px) {
	.widget ul {padding-top: 0;}
	/*768px*/
	.entry {font-size:14px; line-height: 1.75em;}
	.entry pre.prism-line-numbers {padding-left:3.2em; font-size:12px;}
	.entry div.prism-show-language > div.prism-show-language-label[data-language] {font-size:0.7em;}
	/*768px*/
	.blogList .thumbnail {width:110px;}
	.blogList .info {margin-left:120px;}
	.blogList .meta {border:none;}
	.blogList .intro, 
	.blogList .meta span {display:none; border:none; padding:0;}
	.blogList h2 {font-size:16px; line-height: 1.75em;white-space: normal; height: auto; margin-bottom: 0;}
	.blogList h2 a {display: block;}
	/*768*/
	.pagenavi {text-align:center;}
	.pagenavi a, .pagenavi span.now-page {height:28px; line-height: 28px; padding:0 10px; margin:2px; font-size:12px;}
	/*768*/
	.related li {width:48%;}
	/*768*/
	.postnavi {font-size:14px;}
	.postnavi .small {font-size:12px; color:#333; font-weight: bold;}
	.postnavi .left, .postnavi .right {float:none; width:auto; text-align:left;}
	.postnavi .fas {display: none;}
	.postnavi .left a, .postnavi .right a {padding:0;}
	/*768*/
	.catebox h4 {font-size:14px;}
	/*768*/
	.boxFirst {width: auto; float:none; margin-bottom: 10px;}
	.boxFirst h4 {height: auto; max-height: 3.5em;}
	.boxFirst .excerpt {font-size:12px; margin-top: 5px; padding-top: 5px;}
	/*768*/
	.boxitem {margin:0 0 10px 0;}
	.boxitem .thumbnail {width: 100px;}
	.boxitem .info {margin-left: 110px;}
	.boxitem h4 {margin-bottom: 2px;}
	/*768*/
	#copyright {line-height: 1.75em;}
	/*768*/
	.btmBox p {font-size:12px;}
	.btmBox h3 {font-size:14px; margin-bottom: 5px;}
	/*768*/
	#about {font-size:12px;}
	/*768*/
	#follow {float:none; width: auto;}
	/*768*/
	#contact {float:none; border-bottom:1px solid #444; width: auto; padding-right:0;}
}

@media only screen and (max-width:760px) {
	#comment .text {width:41%; margin:2px 0;}
	#comment label {padding:0 10px; margin:2px 0;}
	#comment img {margin-top:2px;}
	#comment .text.verify {width:100px;}
}
@media only screen and (max-width:640px) {
	.searchform .inner {width:480px;}
	.searchform .s {width:400px;}
	.searchform .submit {width:50px;}
	h3.title {font-size:1em; margin-bottom:5px;}
	.backtop {display:none;}
	#comment .text {width:39%;}
	.post, .related, .commentslist, .commentform {padding:10px;}
	.post h1.post-title {font-size:1.125em; margin-bottom:5px;}
	.commentslist li li {margin:10px 0 0 20px;}
	.commentslist li {padding:10px 0 5px;}
	
}
@media only screen and (max-width:540px) {
	.another li.rss {display:none;}
	.another li a {border:none; padding:0 5px;}
	.another li a:hover,.another li.on a {background-color:transparent; color:#333;}
	.searchform .inner {width:360px;}
	.searchform .s {width:300px;}
	.searchform .submit {width:40px;}
	.home_top li {width:48%;}
	.blogList {padding:10px;}
	.blogList .thumbnail {width:120px; margin-right:10px;}
	#comment .text {width:37%;}
	#comment .text.verify {width:15%;}
}
@media only screen and (max-width:480px) {
	#comment .text {width:85%;}
	#comment .text.verify {width:35%;}
}
@media only screen and (max-width:420px) {
	.searchform .inner {width:320px;}
	.searchform .s {width:260px;}
	.another li .loginform {padding:10px 15px 5px; width:200px;}
	.another li .loginform .text {width:143px; padding:5px;}
	.another li .loginform label {height:34px; line-height:34px;}
	.another li .loginform .text.verify {width:50px;}
	#comment .text {width:80%;}
}
@media only screen and (max-width:360px) {
	.searchform .inner {width:260px;}
	.searchform .s {width:200px;}
	#comment .text {width:75%;}
}