/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *   page top
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#page-head {
	margin-top: 20px;
	padding-bottom: 10px;
	/*border-bottom: 1px solid #aaaaaa;*/
}
#page-title {
	display: inline-block;
	margin-top: 5px;
	margin-bottom: 0;
	font-size: 26px;
	font-weight: bold;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *   search form
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
*:focus {
    outline: none;
}
#content-search-wrapper {
	margin: 10px 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;
}
@media screen and (min-width: 591px) {
	#content-search-wrapper {
	}
}
#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;
}
@media screen and (min-width: 591px) {
	#str-in { width: 500px; }
}
@media screen and (max-width: 590px) {
	#str-in {
		box-sizing: border-box;
		width: 100%;
	}
}
/* ---------
 *  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;
}
@media screen and (min-width: 591px) {
	#btn-go {
		position: relative;
		top: -2px;
	}
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *   links / filters
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#container-links {
	margin: 50px 0;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *   hashtag area
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.block-title {
	font-weight: bold;
	margin-bottom: 5px;
}
#container-hashtag {
	margin-bottom: 40px;
	padding: 10px;
	background-color: #e6e6e6;
	background-image: url("../../../webengine/engineRes/img/bg-plank-03.jpg");
	border-width: 1px;
	border-style: solid;
	border-color: #dddddd #aaaaaa #aaaaaa #dddddd;
	border-color: #eeeeee #bbbbbb #bbbbbb #eeeeee;
	border-radius: 5px;
}
/* -------
 * table
 * ------- */
.col-0 {
	vertical-align: top;
}
.col-1 {
	padding-right: 10px;
	vertical-align: top;
	border-right: 1px solid #bbbbbb;
}
@media screen and (min-width: 591px) {
	.col-1 { padding-left: 5px;  }
	.col-2 { padding-left: 5px; }
}
@media screen and (max-width: 590px) {
	#row-1 { border-bottom: 1px solid #bbbbbb; }
	#row-2 { border-bottom: 1px solid #bbbbbb; }
	.col-1 { display: none; }
	.col-2 { display: block;
			 padding-left: 5px; }
}
/* --------
 * hashtag
 * -------- */
.a-tag:hover {
	text-decoration-line: none;
}
.hashtag {
	display: inline-block;
	color: #405060;
	line-height: 28px;
	padding: 0 6px;
	border-width: 1px;
	border-style: solid;
	border-radius: 4px;
	border-color: transparent;
}
.hashtag:hover {
	color: #304050;
	background-color: #cccccc;
	border-color: #e0e0e0 #b0b0b0 #b0b0b0 #e0e0e0;
}
.hashtag:active {
	background-color: #c0c0c0;
	border-color: #dddddd #bbbbbb #bbbbbb #dddddd;
}
@media screen and (max-width: 590px) {
	.hashtag {
		line-height: 32px;
	}
}