/* -------------
 * search form
 * ------------- */
*:focus {
    outline: none;
}
#content-search-wrapper {
	margin: 5px 0 30px 0;
	padding: 30px 20px 140px 20px;
	background-color: #e0e0e0;
	background-image: url("../../../../webengine/engineRes/img/bg-plank-03.jpg");
	border-width: 1px;
	border-style: solid;
	border-color: #dddddd #bbbbbb #bbbbbb #dddddd;
	border-radius: 5px;
}
#search-info {
	margin-bottom: 10px;
}
#str-in {
	margin-bottom: 10px;
	font-size: 22px;
	line-height: 32px;
	color: #003020;
	border-radius: 4px;
}
#str-in::placeholder {
	font-size: 16px;
	font-style: italic;
}
/* ---------
 *  button
 * --------- */
input[type=button] {
	font-size: 17px;
    margin: 1px 0px 1px 0px;
    width: 100px;
    border-radius: 4px;
}
#btn-go {
    line-height: 32px;
	color: #000000;
	background-color: #fa8816;
	border-color: #777777;
}
#btn-go:hover {
	color: #111111;
	background-color: #ff9429;
}
#btn-go:focus {
	margin: 0px 0px 0px 0px;
	border-width: 2px;
	border-color: #6f3c0a;
}
#btn-go:active {
	background-color: #f48210;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *
 *   screen size
 *
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (min-width: 601px) {
	#btn-go {
		position: relative;
		top: -2px;
	}
	#str-in {
		width: 500px;
	}
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media screen and (max-width: 600px) {
	#str-in {
		box-sizing: border-box;
		width: 100%;
	}
}