#tool{
	display: none;
}
.tool-all, .tool-plus{
	position: fixed;
	border-radius: 999em;
	background-color: #9D5C2B;
}
.tool-all:hover, .tool-plus:hover{
	background-color: #c87637;
}
.tool-plus, .tool-all, .tool-text{
	box-shadow: 0 8px 10px 0 rgba(0, 0, 0, 0.5);
}
.tool-plus{
	z-index: 15;
}
.tool-plus-img{
	width: 40%;
	top: 32%;
	left: 30%;
	color: #fff;
	text-align: center;
	transform: rotate(0deg);
	position: absolute;
	transition: 0.5s;
}
.tool-plus-img-click{
	transform: rotate(225deg);
}
.tool-all{
	z-index: 10;
	visibility: hidden;
	transition:  0.5s;
}
.tool-all img{
	width: 40%;
	top: 30%;
	left: 30%;
	position: absolute;
}
.tool-all-click {
	visibility: visible;
}
.tool-text {
	height: 45%;
	width: 0%;
	top: 27.5%;
	right: 140%;
	position: absolute;
	color: #fff;
	text-align: center;
	background-color: #9D5C2B;
	border-radius: 5px;
	transition: 0.3s;
	overflow: hidden;
}


/*post view*/
.post-view{
	z-index: 30;
	visibility: hidden;
	position: fixed;
	background-color: #fff;
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
	border-radius: 20px;
	transition: 0.3s ease-out;
	overflow: hidden;
}
.post-click{
	visibility: visible;
}
.post-cont-all{
	position: relative;
	width: 100%;
	/*height: 90%;*/
}
.post-cont{
	width: 0;
	height: 100%;
	overflow-y: scroll;
	overflow-x: hidden;
	/*transition: 0.3s;*/
	display: none;
	/*vertical-align: top;*/
}
.post-cont:nth-child(1){
	/*height: 0;*/
	/*height: 90%;*/
}
.post-cont:nth-child(2){
	/*height: 0;*/
	/*height: 90%;*/
}
.post-cont:nth-child(3){
	/*height: 0;*/
	/*height: 90%;*/
	position: relative;
}
.post-img,
.post-title,
.post-text,
#tool .select-button,
.post-textarea{
	margin: 5% 8% 5% 10%;
}
.post-title{
	position: relative;
	width: 82%;
	text-align: center;
}
.post-title div{
	display: inline-block;
	vertical-align: middle;
}
.post-title-B{
	position: absolute;
	right: 0;
	width: 8%;
	border-radius: 5px;
}
.time24,.break{
	width: 80%;
	margin: 10%;
}
.post-img{
	position: relative;
	width: 82%;
	border: 2px solid #9D5C2B;
	border-radius: 10px;
	overflow:hidden;
}
.post-img-show{
	height: 100%;
	border-radius: 10px;
}
.post-img-add{
	position: absolute;
	width: 10%;
}
.post-img input{
	display: none;
}
.post-text{
	width: 77%;
	border: 2px solid #9D5C2B;
	border-radius: 5px;
	padding: 2%;
}
.post-text input{
	width: 100%;
	background-color: transparent;
	border: none;
	outline: none;
}
.post-open,
.post-break,
.post-interval{
	display: inline-block;
	margin: 0;
}
.post-open-all{
	text-align: center;
	display: none;
}
.post-interval{
	text-align: center;
}
.post-close{
	width: 81%;
	padding: 0;
	overflow: hidden;
		overflow-x: hidden;
		overflow-y: hidden;
	    white-space: nowrap;
}
.post-day{
	width: 14.5%;
	display: inline-block;
	text-align: center;
	padding: 2.6% 0;
	margin-right: -4px;
}
.post-day-click{
	background-color: #9D5C2B;
	color: #fff;
}
.post-tips{
	width: 5%;
	position: absolute;
	bottom: 10px;
	right: 10px;
	/*border: 2px solid #9D5C2B;
	border-radius: 999em;
	background-color: #fff;
	backdrop-filter: saturate(100%) blur(20px);
 	-webkit-backdrop-filter: saturate(100%) blur(20px);
 	padding: 2%;*/
}
.post-tips img,
.post-tips div{
	width: 100%;
	text-align: center;
}
.post-textarea{
	width: 77%;
	padding: 2%;
	height: 80%;
	border: #9D5C2B solid 2px;
	border-radius: 5px;
}
.post-textarea-input{
	width: 100%;
	height: 100%;
	background-color: transparent;
	border: none;
	outline: none;
	resize: none;
}
.post-cns{
	position: absolute;
	width: 82%;
	height: 50px;
	margin: 5px 8% 5px 10%;
	bottom: 0;
}
.post-error{
	display: none;
	position: absolute;
	text-align: center;
	top: -75%;
	width: 100%;
	color: red;
}
.post-cancel,
.post-prev,
.post-next,
.post-save{
	/*border: 1px solid #000;*/
	width: 40%;
	display: inline-block;
	padding: 2%;
	text-align: center;
}
.post-prev,
.post-save{
	display: none;
}
.post-next,
.post-save{
	color: #fff;
	background: #9D5C2B;
	border-radius: 5px;
}

@media screen and (min-width: 1301px) {
	.tool-plus{
		width: 5%;
		padding-top: 5%;
		right: 2%;
	}
	.tool-all{
		width: 4%;
		padding-top: 4%;
		right: 2.5%;
	}
	.tool-text {
		font-size: 14px;
	}
	.tool-text:last-child {
		right: 120%;
	}
	.post-view .select-icon{
		width: 6%;
		padding: 0 2%;
	}

	.post-view{
		width: 30%;
		height: 0;
		top: 10%;
		left: 35%;
	}
	.post-click{
		height: 80%;
	}
	.post-open,
	.post-break{
		width: 30%;
	}
	.post-interval{
		width: 9.5%;
	}
	.post-day{
		margin-right: -5px;
	}
}
@media screen and (min-width: 1024px) and (max-width: 1300.9px) {
	.tool-plus{
		width: 6%;
		padding-top: 6%;
		right: 2%;
	}
	.tool-all{
		width: 5%;
		padding-top: 5%;
		right: 2.5%;
	}
	.tool-text {
		font-size: 13px;
	}
	.tool-text:last-child {
		right: 125%;
	}
	.post-view .select-icon{
		width: 6%;
		padding: 0 2%;
	}

	.post-view{
		width: 40%;
		height: 0;
		top: 10%;
		left: 30%;
	}
	.post-click{
		height: 80%;
	}
	.post-open,
	.post-break{
		width: 30%;
	}
	.post-interval{
		width: 10%;
	}
}
@media screen and (min-width: 721px) and (max-width: 1023.9px) {
	.tool-plus{
		width: 7%;
		padding-top: 7%;
		right: 3%;
	}
	.tool-all{
		width: 6%;
		padding-top: 6%;
		right: 3.5%;
	}
	.tool-text {
		font-size: 12px;
	}
	.tool-text:last-child {
		right: 130%;
	}
	.post-view .select-icon{
		width: 6%;
		padding: 0 2%;
	}

	.post-view{
		width: 50%;
		height: 0;
		top: 20%;
		left: 25%;
	}
	.post-click{
		height: 60%;
	}
	.post-open,
	.post-break{
		width: 30%;
	}
	.post-interval{
		width: 9.6%;
	}
}
@media screen and (min-width: 721px) {
	.tool-plus{
		bottom: 4%;
	}
	.tool-all:hover > .tool-text{
		width: 150%;
	}
	.tool-plus:hover > .tool-text{
		width: 128%;
	}
}
@media screen and (max-width: 720.9px) {
	.tool-plus{
		right: 3%;
		bottom: 2%;
	}
	.tool-all{
		right: 3.5%;
	}
	.tool-text {
		font-size: 12px;
	}
	.tool-text:last-child {
		right: 130%;
	}
	.post-view .select-icon{
		width: 6%;
		padding: 0 2%;
	}

	.post-view{
		width: 60%;
		height: 0;
		top: 20%;
		left: 20%;
	}
	.post-click{
		height: 60%;
	}
	.post-open,
	.post-break{
		width: 30%;
	}
}
@media screen and (min-width: 500px) and (max-width: 720.9px) {
	.tool-plus{
		width: 10%;
		padding-top: 10%;
	}
	.tool-all{
		width: 8%;
		padding-top: 8%;
	}
	.post-interval{
		width: 8.7%;
	}
}
@media screen and (max-width: 499.9px) {
	.tool-plus{
		width: 15%;
		padding-top: 15%;
	}
	.tool-all{
		width: 12%;
		padding-top: 12%;
	}
	.post-interval{
		width: 6%;
	}
	.post-day{
		width: 14.65%;
	}
}