/**********************************************************************
 Theme Name: Cyber Fellow for www.cyberfellow.com
 Author: サイバーフェロー株式会社(Cyber Fellow Inc.)
 **********************************************************************/

/**********************************************************************
 * 共通のタグ CommonTag
 **********************************************************************/
*{
	margin:				0px;
	padding:			0px;
}

html{
	overflow-y:			scroll;
}

body{
	background-color:	#aaa;
	margin-bottom:		20px;
	color:			#555;
}

h1{
	background-color:	#aaa;
	color: 				#666;
	font-size:			smaller;
	font-weight: 		normal;
}

/**********************************************************************
 * 全体レイアウト定義
 **********************************************************************/
#page{
	width:				900px;
	margin:				20px auto;
	background-color:	#fff;
}

#header{
	background-color:	#eee;
	height:				116px;
}


#main{
	background-color:	#ddd;
	width:				610px;
}

#sideber{
	background-color:	#fff;
	width:				244px;
	padding:			1px;
	margin:				1px;
}

#footer{
	background-color:	#bbb;
	clear:				both;
}

/* 左サイドバー表示用*/
#main{float:	right;}
#sideber{float:	left;}

/* 右サイドバー表示用
#main{float:	left;}
#sideber{float:	right;}
*/


/**********************************************************************
 *ヘッダー Header
 **********************************************************************/
#header{
	background-image:	url("images/header.PNG");
	background-repeat:	no-repeat;
}

/*---------------------------------------------------------------------
 * ヘッダータイトル部？
 *---------------------------------------------------------------------*/
#header_titel{
	float:				left;
	width:				300px;
	height: 			75px;
}

/*---------------------------------------------------------------------
 * ヘッダーリンクメニュー
 *---------------------------------------------------------------------*/
#header_link {
/*	width:				380px;*/
	text-align:			right;
	padding-top: 		10px;
}

#header_link ul {
	/* 特に無し */
}

#header_link li {
	/* 特に無し */
	display:			inline;
}

#header_link ul li {
	display:			inline;
	font-size: 			smaller;
	font-weight:		bold;
	border-left:		solid 2px #88f;
	padding:			2px 0px 0px 7px;
}

#header_link ul li a{
	text-decoration:	none;
}

#header_link ul li a:link{
	color:				#449;
}
#header_link ul li a:visited{
	color:				#449;
}
#header_link ul li a:hover{
	color:				#f00;
}

/*---------------------------------------------------------------------
 * ヘッダーボタンメニュー
 *---------------------------------------------------------------------*/
#header_menu {
	clear:				both;
	margin-left: 2px;
}

#header_menu ul {
	/* 特に無し */
}

#header_menu li {
	/* 特に無し */
	display:			inline;
}

#header_menu ul li {
	float:				left;
	display:			block;
	width:				149px;
/*	background-image:	url("images/header_menu_btn.PNG");*/
}

#header_menu ul li a{
	display:			block;
	height:				31px;
	padding-top:		10px;
	background-image:	url("images/header_menu_btn.PNG");
	
	text-decoration:	none;
	font-weight:		bold;
	text-align:			center;
}

#header_menu ul li a:link{
	color:				#557;
}
#header_menu ul li a:visited{
	color:				#557;
}
#header_menu ul li a:hover{
	background-image:	url("images/header_menu_btn_hover.PNG");
}
#header_menu ul li.current_page_item a{
	background-image:	url("images/header_menu_btn_hover.PNG");
}


/**********************************************************************
 * サイドバー
 **********************************************************************/
#sideber > ul{
	list-style-type:	none;
}

.side_menu{
	background-color:	#fff;
	width:				240px;
}

ul.side_menu,
.side_menu ul{
	list-style-type: none;
}

.side_menu li a,
.side_menu li h3
{
	display:			block;
	height:				20px;
	background-repeat:	repeat-x;
	background-image:	url("images/side_menu_btn.PNG");
	padding-top:		5px;
	padding-left:		5px;
	
	text-decoration:	none;
	font-weight:		bold;
	text-align:			left;
	color:				#557;
}

.side_menu li ul li a{
	padding-left:		25px;
	font-size:			0.8em;
}

.side_menu li a:link{
	color:				#557;
}
.side_menu li a:visited{
	color:				#557;
}
.side_menu li a:hover{
	background-repeat:	repeat-x;
	background-image:	url("images/side_menu_btn_hover.PNG");
}

.side_menu li.current_page_item a{
	border-right:		solid 3px red;
/*	background-repeat:	repeat-x;
	background-image:	url("images/side_menu_btn_hover.PNG");*/
}


/**********************************************************************
 * トップページ：メイン
 **********************************************************************/
#top_main{
}

#top_image{
	width:				900px;
	height:				172px;
	background-image:	url("images/top_image.PNG");
}

#top_service{
	float:				left;
	background-color:	#fff;
	width:				580px;
	padding:			5px;
}


#top_topics{
	float:				right;
	background-color:	#fff;
	width:				300px;
	padding:			5px;
}

/*---------------------------------------------------------------------
 * トップページ：サービス
 *---------------------------------------------------------------------*/
#top_service h2{
	width:				558px;
	height:				30px;
	background-image:	url("images/ico_top_service.PNG");
}

#top_service_position{
	position: relative;	
}

#top_service_x{
	width:				250px;
	height:				126px;
	background-image:	url("images/bak_top_service.PNG");
	margin:				5px;
	padding:			10px;
	overflow:			hidden;
}

#top_service_x h3{
	color:				#555;
	border-bottom:			2px solid #555;
	margin-bottom:			4px;
}

.top_service_1{
	/* ポジション指定無し */
}

.top_service_2{
	position:absolute; 
	top: -5px;
	left: 275px;
}

.top_service_3{
	/* ポジション指定無し */
}

.top_service_4{
	position:absolute; 
	top: 146px;
	left: 275px;
}

/*---------------------------------------------------------------------
 * トップページ：トピックス
 *---------------------------------------------------------------------*/
#top_topics h2{
	width:				300px;
	height:				30px;
	background-repeat:	no-repeat;
	background-image:	url("images/btn_top_topics.PNG");
}

#top_topics ul{
	margin-left:		30px;
}

#top_topics li{
	background-repeat:	no-repeat;
	list-style-image:	url("images/ico_top_topics.PNG");
	margin-top:			10px;
	font-size:			small;
}

/**********************************************************************
 * フッター
 **********************************************************************/
#footer{
	background:			#333 url("images/footer.PNG") no-repeat;
	height:				29px;
	padding-top:		15px;
	padding-left:		10px;
	color:				#666;
}

/*---------------------------------------------------------------------
 * フッタータイトル部？
 *---------------------------------------------------------------------*/
#footer_titel{
	float:				left;
}

/*---------------------------------------------------------------------
 * ヘッダーリンクメニュー
 *---------------------------------------------------------------------*/
#footer_link {
/*	width:				380px;*/
	text-align:			right;
	padding-top: 		0px;
}

#footer_link ul {
	/* 特に無し */
}

#footer_link li {
	/* 特に無し */
	display:			inline;
}

#footer_link ul li {
	display:			inline;
	font-size: 			smaller;
	font-weight:		bold;
	border-left:		solid 2px #88f;
	padding:			2px 0px 0px 7px;
}

#footer_link ul li a{
	text-decoration:	none;
}

#footer_link ul li a:link{
	color:				#449;
}
#footer_link ul li a:visited{
	color:				#449;
}
#footer_link ul li a:hover{
	color:				#f00;
}

/**********************************************************************
 * メイン
 **********************************************************************/
#main{
	padding:			20px;
}

#main_content{
	padding-top:		20px;
}

#main ul{
	padding-left:		20px;
}

