@charset "UTF-8";

/* ------------------------------------------------------------
HTML5Help 特殊トピック用CSS
Company : FUKUI COMPUTER SMART., Inc.
更新履歴：
------------------------------------------------------------ */

/*============================================================
書式
============================================================*/
#menu-wrapper {
	border-bottom: 1px solid #e7e7e7;
	margin-top: 42px;
	margin-bottom: 25px;
	width: 100%;
	height: auto;
}
.container {
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}

/* #Clearing
================================================== */

/* Self Clearing Goodness */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }
.row:after,
.clearfix:after {
  clear: both; }
.row,
.clearfix {
  zoom: 1; }

/* You can also use a <br class="clear" /> to clear columns */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

#title {
	width: 300px;
	margin-left: 1.0em;
	float: left;
}
#menu {
	margin-top: 0px;
	width: 300px;
	float: left;
}

.fix-fish-menu {
	position:relative;
	padding-top: 17px;
	z-index: 1;
}
.sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; }
.sf-menu { }
.sf-menu ul { position: absolute; top: -999em; text-align:left; }
.sf-menu ul li {
	-webkit-box-shadow: 2px 2px 0px 0px #fff;
	-moz-box-shadow: 2px 2px 0px 0px #fff;
	box-shadow: 2px 2px 0px 0px #fff;
}

.sf-menu li:hover { 
	visibility:	inherit;
	border: 1px solid #cacbcb;
	-webkit-box-shadow:  2px 2px 0px 0px #e2e4e4;
	-moz-box-shadow:  2px 2px 0px 0px #e2e4e4;
	box-shadow:  2px 2px 0px 0px #e2e4e4;
}
.sf-menu li {
	float: left;
	position: relative;
	border: 1px #CACBCB solid;
	-webkit-box-shadow: 2px 2px 0px 0px #fff;
	-moz-box-shadow: 2px 2px 0px 0px #fff;
	box-shadow: 2px 2px 0px 0px #fff;
	margin-right: 5px;
	margin-bottom: 10px;
	font-size: 10pt;
	width: 80px;
	text-align: center;
	letter-spacing: 0.3em;
}

.sf-menu a { display:block; text-decoration: none; 	position:relative; 	text-decoration: none; }
.sf-menu li:hover ul, .sf-menu li.sfHover ul { top: 35px; /* match top ul list item height */ z-index: 199; }
.sf-menu li a {	color: #999; padding: 5px 10px; text-decoration: none; }
.sf-menu li a:hover {  /*color:#bababa; */}
.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top:-999em;z-index: 9999; }
.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left:14.7em; top:-1.7em;  }
.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; z-index:9999;}
.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 11.3em; top: 0;  }

ul.sf-menu li a:hover {
	color: #fff;
	text-decoration: none;
	background-color:  #414141;
}
ul.sf-menu li.active a {
	color: #fff !important;
}
ul.sf-menu li.active {
	border: 1px solid #cacbcb;
	background-color: #414141;
	-webkit-box-shadow:  2px 2px 0px 0px #e2e4e4;
	-moz-box-shadow:  2px 2px 0px 0px #e2e4e4;
	box-shadow:  2px 2px 0px 0px #e2e4e4; }
.sf-menu a, .sf-menu a:visited  { }
.sf-menu li ul li a {
	font-size: 11px !important; 
	text-transform:capitalize !important;
	width:140px;
}
.sf-menu li ul li {
}

.sf-menu ul li a:focus, .sf-menu ul li a:hover, .sf-menu ul li a:active {
	outline: 0;	
	color:#4D4C4C !important;
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
}

.sf-menu li ul li {
	background-color:white;
	border: 1px solid #CACBCB;
	-webkit-box-shadow: 2px 2px 0px 0px #e2e4e4;
	-moz-box-shadow: 2px 2px 0px 0px #e2e4e4;
	box-shadow: 2px 2px 0px 0px #e2e4e4;	
	margin-bottom:4px;
	padding: 5px 10px;	
	width:140px;
}
.sf-menu li ul li ul { margin-left:25px; margin-top:15px;}

.sf-menu li ul li:hover, .sf-menu li:hover { background-color:#f5f5f5; }
.sf-menu li ul li, .sf-menu li {
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
.sf-menu li ul li a { font-size:11px; color:#868787; padding: 0px; }


.fix-fish-menu select {
	display: none;
	width:  100%;
	height: 28px;
	margin: 21px 0;
}