@charset "utf-8";


/* -- form.form-area -------------------------------------------------------------------------------- */

form.form-area input[type="file"] {
	max-width: calc( 100% - 4% - 4px );
	padding: 4px 2%;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #fafafa;
	-webkit-appearance: none;
	font-size: 100%;
	font-family: inherit;
}

form.form-area input[type="file"]:focus {
	box-shadow: 0px 0px 5px #55ccff;
	border: 1px solid #55ccff;
	background: #ffffff;
}

form.form-area input[type="file"] + p {
	margin-top: 5px;
}


form#bbs-form blockquote p {
	overflow: hidden;
}

form#bbs-form blockquote p a.overlay-zoombox {
	display: inline-block;
	max-width: 300px;
	float: right;
	margin: 0 0 10px 30px;
}

form#bbs-form blockquote p a.overlay-zoombox:hover {
	opacity: 0.7;
}

form#bbs-form blockquote p a.overlay-zoombox img {
	max-width: 100%;
	height: auto;
	border-radius: 4px;
}


p#exist-image {
	overflow: hidden;
}

p.change-image img,
p#exist-image img {
	max-width: 200px;
	height: auto;
	border-radius: 4px;
	margin-bottom: 10px;
}

p#exist-image span#reset {
	display: none;
	float: right;
	width: auto;
	height: auto;
	color: #ffffff;
	line-height: 1;
	padding: 11px 20px;
	border-radius: 3px;
	background: #d9534f;
	border: 1px solid #d43f3a;
}

p#exist-image span#reset:hover {
	cursor: pointer;
	background: #c9302c;
	border: 1px solid #ac2925;
}


form.form-area dl dd span.error-filetype {
	display: block;
	color: #ff0000;
	margin-top: 5px;
}




/* -- div.bbs-post -------------------------------------------------------------------------------- */

div.bbs-post p {
	overflow: hidden;
}

div.bbs-post p a.overlay-zoombox {
	display: inline-block;
	max-width: 300px;
	float: right;
	margin: 0 0 10px 30px;
}

div.bbs-post p a.overlay-zoombox:hover {
	opacity: 0.7;
}

div.bbs-post p a.overlay-zoombox img {
	max-width: 100%;
	height: auto;
	border-radius: 4px;
}








/* -- responsive ----------------------------------------------------------------------------------------------------------------------- */

/* 1000pixel start */
@media screen and ( max-width: 1000px ) {


/* -- form.form-area -------------------------------------------------------------------------------- */

form#bbs-form blockquote p a.overlay-zoombox {
	max-width: 40%;
	margin: 0 0 15px 15px
}

p.change-image img,
p#exist-image img {
	max-width: 40%;
}




/* -- div.bbs-post -------------------------------------------------------------------------------- */


div.bbs-post p a.overlay-zoombox {
	max-width: 40%;
	margin: 0 0 15px 15px
}


}
/* 1000pixel end */