/**
 *   Common CSS
 *   -------------------------------------------
 *   css/common.css
 *   
 *   Copyright (c) 2011 hokuken
 *   http://hokuken.com/
 *   
 *   created  : 2011-02-17
 *   modified :
 *   
 */

* {
	margin:0;
	padding:0;
}


/* !Block Element ===================== */
ul, li {
	line-height: 1.5em;
	margin: 0 12px;
}

p {
	line-height: 1.5em;
	margin-top: 1em;
	margin-bottom: 1em;
}

p.navi {
	line-height: 1em;
	margin:0px;
	text-align: right;
}

p.err {
	color: #e32;
	font-family: Courier, monospace;
	font-size: 120%;
	line-height: 140%;
	padding: 0pt;
	margin: 0.5em 0;
	text-align:center;
}
p.error {
	background-color: #e32;
	color: #fff;
	font-family: Courier, monospace;
	font-size: 120%;
	line-height: 140%;
	padding: 0.5em;
	margin: 0.5em 0;
}
p.warn {
	margin: 1em;
	padding: .5em;
	line-height: 120%;
	font-size: 110%;
	color: #666;
	background-color: #fee;
	border: 1px solid #f66;
}

p.notice {
    margin: 1em;
    padding: 5px;
    background-color: #ffd;
    border: 1px solid #ff6;
}
p.info {
	color: orange;
	font-family: Courier, monospace;
	font-size: 100%;
	line-height: 120%;
	padding-left: 1em;
	
}
p.success {
	background-color: green;
	color: #fff;
}
pre {
	color: #333;
}
div.error {
	margin:2em auto;
	padding:20px;
	background-color:#ffeeee;
}
div.message {
	clear: both;
	color: #900;
	font-size: 140%;
	font-weight: bold;
	margin: 1em 0;
}
div.error-message {
	clear: both;
	color: #900;
	font-weight: bold;
}

.success {
	background: green;
	color: #fff;
}
.textleft{
	text-align: left;
}
.textright {
	text-align: right;
}
.floatLeft {
	display: block;
	float:left;
}
.floatRight {
	display: block;
	float: right;
}
.clearBoth {
	display: block;
	clear: both;
}
.lineUpper1 {
	margin-top: -20px;
}
.height25 {
	height: 25px;
}

.verticalIndent20 {height:20px}
.verticalIndent50 {height: 50px;}
.verticalIndent100 {height: 100px;}

.marginBottom20 {margin-bottom: 20px}
.marginBottom50 {margin-bottom: 50px}
.marginBottom100 {margin-bottom: 100px}

.textPre {
	white-space: -moz-pre-wrap; /* Mozilla */
	white-space: -pre-wrap;     /* Opera 4-6 */
	white-space: -o-pre-wrap;   /* Opera 7 */
	white-space: pre-wrap;      /* CSS3 */
	word-wrap: break-word;      /* IE 5.5+ */
}

.borderRadius8 {
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
}

.borderRadius10 {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

.borderTopRadius10 {
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}
.borderRightRadius10 {
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-topright: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
}
.borderBottomRadius10 {
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-bottomleft: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
}
.borderLeftRadius10 {
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-bottomleft: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}
.modebox{
	border: 2px solid #66AACC;
	background-color: #EEEEFF;
	margin: 1.5em 0;
	padding: 0 10px;
	width: 450px;
	text-align: left;
}


/* !Tables */
table {
	background: #fff;
	border:1px solid #ccc;
	border-right:0;
	clear: both;
	color: #333;
	margin-bottom: 10px;
	width: 100%;
}
th {
	background: #f2f2f2;
	border:1px solid #bbb;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	text-align: center;
}
th a {
	background:#f2f2f2;
	padding: 2px 4px;
	text-decoration: none;
}
th a:hover {
	background: #ccc;
	color: #333;
	text-decoration: none;
}
table tr td {
	background: #fff;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 4px;
	vertical-align: top;
}
table tr.altrow td {
	background: #f4f4f4;
}
td.actions {
	text-align: center;
	white-space: nowrap;
}
td.actions a {
	margin: 0px 6px;
}

table#admin {
	background-color: transparent;
	border:none;
}
table#admin tr {
	border:none;
}
table#admin td {
	border:none;
	text-align: left;
	background-color: transparent;
}


/* !Paging */
div.paging {
	background:#fff;
	color: #ccc;
	margin-bottom: 2em;
}
div.paging div.disabled {
	color: #ddd;
	display: inline;
}
div.paging span {
}
div.paging span.current {
	color: #000;
}
div.paging span a {
}


/* !Scaffold View */
dl {
	line-height: 2em;
	margin: 0em 0em;
	width: 60%;
}
dl.altrow {
	background: #f4f4f4;
}
dt {
	font-weight: bold;
	padding-left: 4px;
	vertical-align: top;
}
dd {
	margin-left: 10em;
	margin-top: -2em;
	vertical-align: top;
}


/* !Forms */
form {
	clear: both;
	margin-right: 20px;
	padding: 0;
}
fieldset {
	border: 1px solid #ccc;
	margin-top: 30px;
	padding: 10px 20px;
	width:90%;
}
fieldset legend {
	background:#fff;
	color: #638494;
	font-size: 120%;
	font-weight: normal;
	padding: 0pt 10px;
}
fieldset fieldset {
	margin-top: 0px;
	margin-bottom: 20px;
	padding: 16px 0;
}
fieldset fieldset legend {
	font-size: 120%;
	font-weight: normal;
	margin-left: 20px;
}
fieldset fieldset div {
	clear: left;
	margin: 0 20px;
}
form div.input {
	color: #444;
}
form div.required {
	color: #333;
	font-weight: bold;
}
form div.submit {
	border: 0;
	clear: both;
	margin-top: 10px;
	margin-left: 140px;
}
label {
	display: block;
	font-size: 110%;
	padding-right: 20px;
}

select {
	clear: both;
	font-size: 120%;
	vertical-align: text-bottom;
}
select[multiple=multiple] {
	width: 100%;
}
option {
	font-size: 100%;
	padding: 0 3px;
}
input, textarea {
	font-family: "frutiger linotype", "lucida grande", "verdana", sans-serif;
	font-size: 100%;
}
input[type=text],input[type=password],textarea {
	padding: 2px;
	width: 90%;
}
input[type=checkbox] {
	margin: 0px 6px 7px 2px;
}
input[type=radio] {
	margin: 0px 6px -2px 2px;
}
input[type=submit] {
	padding: 2px 5px;
	vertical-align: bottom;
}

/* !Buttons --------------------------------- */
.saveButton {
	width: 92px;
	height: 33px;
	background: url(../img/save_grey_92x33.gif) no-repeat 0 0;
	float:left;
	margin-right: 5px;
	cursor: pointer;
}
.okButton {
	width: 92px;
	height: 33px;
	background: url(../img/ok_grey_92x33.gif) no-repeat 0 0;
	float:left;
	margin-right: 5px;
	cursor: pointer;
}
.cancelButton {
	width: 92px;
	height: 33px;
	background: url(../img/cancel_grey_92x33.gif) no-repeat 0 0;
	float:left;
	margin-right: 5px;
	cursor: pointer;
}

/* !block message ------------------------- */
.error {
	background-color: #e32; 
	color: #fff; 
	font-family: Courier, monospace; 
	font-size: 120%; 
	line-height: 140%; 
	padding: 0.5em; 
	margin: 0.5em 0;
}
.notice {
	background: #ffcc00;
	color: #000;
	display: block;
	font-family: Courier, monospace;
	font-size: 120%;
	line-height: 140%;
	padding: 0.8em;
	margin: 1em 0;
}
.warn {

} 


/* !Inline Elements ======================= */

p.error em {
	color: #000;
	font-weight: normal;
	line-height: 140%;
}

.requiredStar {
	color: red;
	font-weight: bold;
}
.delLink {
	color: red !important;
}

/* !Inline message ------------------------ */
.errorMsg {
	color: #f00;
}
.noticeMsg {
	color: #666;
}
.warnMsg {
	color: #f90;
}

/* !Icons --------------------------------- */
.qn_icon {
	padding: 0 2px;
	padding-left: 18px;
}
.qn_icon_add {
	background: url(../img/add_16.png) no-repeat left center;
}
.qn_icon_hint {
	background: url(../img/hint_16.png) no-repeat left center;
}
.qn_icon_notice {
	background: url(../img/hint_16.png) no-repeat left center;
}
.qn_icon_err {
	background: url(../img/error_16.png) no-repeat left center;
}
.qn_icon_warn {
	background: url(../img/warning_16.png) no-repeat left center;
}
.qn_icon_la {
	background: url(../img/leftarrow_16.png) no-repeat left center;
}
.qn_icon_ra {
	padding: 0 2px;
	padding-right: 18px;
	background: url(../img/rightarrow_16.png) no-repeat right center;
}
.qn_icon_ua {
	background: url(../img/uparrow_16.png) no-repeat left center;
}
.qn_icon_search {
	background: url(../img/search_16.png) no-repeat left center;
}
.qn_icon_mailsend {
	background: url(../img/mail_send_16.png) no-repeat left center;
}
.qn_icon_chart {
	background: url(../img/chart_16.png) no-repeat left center;
}
.qn_icon_down {
	background: url(../img/download_16.png) no-repeat left center;
}
.qn_icon_check {
	background: url(../img/check_16.png) no-repeat left center;
}
.qn_icon_log {
	background: url(../img/log_16.png) no-repeat left center;
}
.qn_icon_maildup {
	background: url(../img/mail_dup_16.png) no-repeat left center;
}

/* !Universal Classes ================== */
.hidden {
	display :none;
}
.gray {
	color: #aaa;
}
.emph {
	font-weight: bold;
}
.nook {
	color: #aaa;
	margin-left:1.5em;
}
.hovercolor {
	background-color: #ffc !important;
}
.focuscolor {
	background-color: #fcc !important;
}


/* !Add-On ========================== */

/* !Loading Image ------------------------ */
#loading {
	width: 32px;
	height: 32px;
	display: none;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -16px;
	margin-top: -16px;
}

/* !jQuery.flash -------------------------- */
#flash {
	color: #234E4C;
	font-size: 24px;
	text-align: center;
	position: fixed;
	width: 500px;
	top: 30px;
	left: 50%;
	margin-left: -250px;
	display: none;
	border: 1px #4EA5A7 solid;
	padding: 2px;
	background-color: #7DF2FF;
	opacity: 0.80;
}
#flashWarn {
	color: #616D1D;
	font-size: 24px;
	text-align: center;
	position: fixed;
	width: 500px;
	top: 30px;
	left: 50%;
	margin-left: -250px;
	display: none;
	border: 1px #A9B32E solid;
	padding: 2px;
	background-color: #FCFD3F;
	opacity: 0.80;
	border-radius: 10px;
}
#flash.warn {
	color: #616D1D;
	font-size: 24px;
	text-align: center;
	position: fixed;
	width: 500px;
	top: 30px;
	left: 50%;
	margin-left: -250px;
	display: none;
	border: 1px #A9B32E solid;
	padding: 2px;
	background-color: #FCFD3F;
	opacity: 0.80;
}
#flashError {
	color: #f33;
	font-size: 24px;
	text-align: center;
	position: fixed;
	width: 500px;
	top: 30px;
	left: 50%;
	margin-left: -250px;
	display: none;
	border: 1px #fdd solid;
	padding: 2px;
	background-color: #fee;
	opacity: 0.80;
	border-radius: 10px;
}
#flash.error {
	color: #f33;
	font-size: 24px;
	text-align: center;
	position: fixed;
	width: 500px;
	top: 30px;
	left: 50%;
	margin-left: -250px;
	display: none;
	border: 1px #fdd solid;
	padding: 2px;
	background-color: #fee;
	opacity: 0.80;
}

.flash_icon {
	padding: 1px;
	padding-left: 18px;
}
.flash_icon_notice {
	background: url(../img/hint_16.png) no-repeat left center;
}
.flash_icon_err {
	background: url(../img/error_16.png) no-repeat left center;
}
.flash_icon_warn {
	background: url(../img/warning_16.png) no-repeat left center;
}

/* !jQuery Ghost ---------------------------- */
.jGhost {
	color: #aaa;
}


/* !Logout Notifier ---------------------------- */
#logoutNotifier {
	border: #999 6px solid;
	border-bottom: none;
	background-color: black;
	position: fixed;
	bottom: 0;
	left: 50%;
	width: 600px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-topright: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	color: white;
	margin-left: -300px;
	opacity: 0.75;
	display: none;
	z-index: 9000;
}
#logoutNotifier:hover {
	background-color: #666;
}
#logoutNotifier a{
	color: white;
}

/* !Topic Path ----------------------------------- */
#topicPath {
	margin: 10px 0;
	float: right;
}
#topicPath li{
	list-style-type: none;
	float: left;
	line-height: 110%;
}

#topicPath li a{
	background: url(topicpath.gif) no-repeat right center;
	margin-right: 5px;
	padding-right: 10px;
}

#topicPath li.activePath {
	font-weight: bold;
}

/* !Pagination ------------------------------------ */
div.pagination{
	width:100%;
	overflow:hidden;
}
div.pagination ul{
	position: relative;
	float:left;
	left:50%;
	list-style-type:none;
}
div.pagination ul li{
	position: relative;
	float: left;
	right: 50%;
	margin-right:3px;
}

/* !Log Viewer ----------------------------------- */
table.log_table {
/* 	width: 530px; */
	border: 1px #E3E3E3 solid;
	border-collapse: collapse;
	border-spacing: 0;
}

table.log_table th {
	padding: 5px;
	border: #E3E3E3 solid;
	border-width: 0 0 1px 1px;
	background: #F5F5F5;
	font-weight: bold;
	line-height: 120%;
	text-align: left;
	padding-left: 4px;
	white-space: nowrap;
}
table.log_table td {
	padding: 5px;
	border: 1px #E3E3E3 solid;
	border-width: 0 0 1px 1px;
	text-align: left;
	white-space: nowrap;
}

/* !ToolBox */
#insertLastName{
	width:30px;
	background-image:url(btn_lastname.gif);
}
#insertFirstName{
	width:30px;
	background-image:url(btn_firstname.gif);
}
#insertMail{
	width:54px;
	background-image:url(btn_email.gif);
}
#insertCancelURL{
	width:54px;
	background-image:url(btn_cancelurl.gif);
}
#insertEncodeLastName{
	width:80px;
	background-image:url(btn_encodelastname.gif);
}
#insertEncodeFirstName{
	width:80px;
	background-image:url(btn_encodefirstname.gif);
}
.insertButtons {
	text-align:right;
	padding:0pt 0pt;
	margin:0pt 0pt;
	width:93%;
	height:30px;
}
.insertCommonButton{
	clear:none;
	background-color:transparent;
	background-image:url(../images/btn.gif);
	background-position:center top;
	background-repeat:no-repeat;
	cursor:pointer;
	float:right;
	height:30px;
	line-height:95%;
	margin:0pt 0px;
	padding:0pt 0pt;
	text-align:center;
	text-decoration:none;
	display:inline;
	color:#444444;
	font-family:Tahoma,Arial,Helvetica,sans-serif;
	font-size:11px;
}


/* !QHM Plugin -------------------------------------- */

/* Hr (hr.inc.php)
----------------------------------------------------------------------------- */
hr.short_line{
	text-align:center;
	width:80%;
	margin:0px auto;
}

/* Image (ref.inc.php)
----------------------------------------------------------------------------- */
div.img_margin{
	margin-left:10px;
	margin-right:10px;
}

div.img_margin_left{
	margin: 0px 1em 0em 0px;
}

div.img_margin_right{
	margin: 0px 0px 0em 1em;
}

/* Clear (clear.inc.php)
----------------------------------------------------------------------------- */
.clear{
	clear:both;
}


