@charset "utf-8";

/*
	Site Name:
	Description:
	Version: 
	Author: Webproduce Corporation
*/

/*-----------------------------------------------------

	base size

------------------------------------------------------*/
.wrap {
	width: 900px;
	margin: 0 auto;
}

/*-----------------------------------------------------

	header 

------------------------------------------------------*/

#header {
}


#header h1 {
	float: left;
/*	width: 190px;*/
/*	width: 404px;*/
	display: block;
}

#header #logo {
	float: left;
	padding: 20px 0 10px 0;
}


/*- head_link -*/
#head_link { 
	float: right;
/*	width: 500px;*/
	width: 488px;
}
#head_link p { 
	text-align: right;
	margin-bottom: 30px;
}
#head_link p a {
	color: #999999;
/*	border-top: solid 2px #333333;*/
}

#head_link #user_info  {
	text-align: right;
}

#head_link #user_info li{
	display: inline;
	padding: 0 0 0 30px;
}

#user { 
	background: url(/images/img/ico_user.gif) no-repeat 10px 0;
	/*- For IE 6.0 -*/
	_background: url(/images/img/ico_user.gif) no-repeat 10px 0.2em;
}
#log {
	background: url(/images/img/ico_logout.gif) no-repeat 10px 0;
	/*- For IE 6.0 -*/
	_background: url(/images/img/ico_logout.gif) no-repeat 10px 0.2em;
}

#mypage {
	background: url(/images/img/ico_mypage.gif) no-repeat 10px 0;
	/*- For IE 6.0 -*/
	_background: url(/images/img/ico_mypage.gif) no-repeat 10px 0.2em;
}

/*- global_navi -*/
#global_navi {
	background: url(/images/img/bg_global_navi.gif) no-repeat top;
	padding: 5px 5px 0;
	height: 30px;
	clear: both;
	margin-bottom: 15px;
}

#global_navi li {
	display: inline;
	line-height: 0;
	margin: 0 10px 0 0;
	line-height: 0;
}

/* 2010/04/19 add start */
#gnav {
	border-right: 1px solid #BFBFBF;
	border-left: 1px solid #BFBFBF;
	clear: both;
	overflow: hidden;
}

body.top#index #gnav {
	margin-bottom: 1em;
	border-bottom: 1px solid #BFBFBF;
}
#gnav li {
	float: left;
}

#gnav li a {
	display: block;
	width: 132px;
	height: 31px;
	text-indent: -9999px;
	outline: none;
}

#gnav li.top a {
	width: 107px;
	background: url(/images/img/g_navi_top.gif) no-repeat left top;
}

#gnav li.reason a {
	background: url(/images/img/g_navi_reason.gif) no-repeat left top;
}

#gnav li.lesson a {
	background: url(/images/img/g_navi_lesson.gif) no-repeat left top;
}

#gnav li.flow a {
	background: url(/images/img/g_navi_flow.gif) no-repeat left top;
}

#gnav li.qa a {
	background: url(/images/img/g_navi_qa.gif) no-repeat left top;
}

#gnav li.voice a {
	background: url(/images/img/g_navi_voice.gif) no-repeat left top;
}

#gnav li.contact a {
	width: 130px;
	background: url(/images/img/g_navi_inq.gif) no-repeat left top;
}

body.top#index #gnav li.top a,
body.reason#index #gnav li.reason a,
body.lesson#index #gnav li.lesson a,
body.flow#index #gnav li.flow a,
body.qa#index #gnav li.qa a,
body.voice#index #gnav li.voice a,
body.contact#index #gnav li.contact a {
	background-position: left bottom;
}

#gnav li a:hover {
	background-position: left bottom;
}

#topicpath {
	margin-bottom: 15px;
	padding: 0.5em 0;
	border: 1px solid #BEBFBF;
	border-top: none;
	color: #FFF;
	background: #343434 url(/images/img/bg_topcpath.gif) repeat-x left bottom;
}

#topicpath ul li {
	padding: 0 10px 0 6px;
	display: inline;
	background: url(/images/img/ico_topicpath.gif) no-repeat right center;
}

#topicpath ul li.current {
	background: none;
}

#topicpath ul li a:link,
#topicpath ul li a:visited,
#topicpath ul li a:hover,
#topicpath ul li a:active {
	color: #FFF;
	text-decoration: underline;
}
/* 2010/04/19 add end */

/*-----------------------------------------------------

	container

------------------------------------------------------*/
#container {
	width: 900px;
	margin: 0 auto;
	margin-bottom: 1em !important;
	clear: both;
}

#contentbox_left {
	float: left;
	width: 670px;
	margin-bottom: 20px;
}

#contentbox_left p { margin-bottom: 2em; }
#contentbox_left p.nomargin { margin: 0; }

/*- paragraph -*/
.paragraph { padding: 10px 10px 20px;}

#contentbox_right {
	float: right;
	width: 230px;
	margin-bottom: 20px;
}

#contentbox_right p { margin-bottom: 1em; }
#contentbox_right p.nomargin { margin: 0; }

/*- paragraph -*/
#contentbox_right .paragraph { padding: 10px 0 10px;}

.harf {
	width: 435px;
}

/*-----------------------------------------------------

	imagearea

------------------------------------------------------*/
#main_image_area {
	margin-bottom: 15px;
}


/*-----------------------------------------------------

	footer

------------------------------------------------------*/
#footer {
	background: url(/images/img/bg_footer.gif) repeat-x;
	clear: both;
	height: 60px;
	padding: 12px 0 0 0;
	color: #999999;
}

#footer ul {
	border-left: solid 1px #999999;
	
}

#footer ul li {
	display: inline;
	border-right: solid 1px #999999;
	padding: 0 8px;
}

#footer ul li a {
	color: #999999;
}