@charset "UTF-8";
@import "base.css";
@import "fonts.css";

/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/

/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/

/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */
h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,th,td,pre,address,li,dt,dd {
	font-size: 140%; line-height: 1.8;
}
	
h1 {} /* Header内で設定 */
h2 {}
h3 { margin-bottom: 15px; }
h4 {}

a { color: #0056ED; }
a:hover,
a:active { color: #61B8FF; text-decoration: none; }
a:visited {
}

ul {
}
li {
}

dl {
}
dt {
	font-weight: bold;
	color: #0000CC;
	font-size: 160%;
}
dd {
margin-bottom: 10px;
}

#content table {
  border: 1px solid #DCDCDC;
  font-size: 100%;
  color: #333;
  margin: 10px 0;
  clear: both;
  }

#content table th,
#content table td {
  padding: 4px 12px;
  border: 1px solid #DCDCDC;
  }

#content table th {
  background: #F0F0F0;
  color: #3F3F3F;
  width: 100px;
  }

p { margin: 0 0 1em; }

dt img,dd img,li img { vertical-align: bottom; }


.section { padding: 15px 0 1em; }
.section .section { padding: .5em 0 1em; }


.section_h4_box { background: url(../images/section_h4_box.jpg) 0 0 repeat-y; }
.section_h4_bottom { background: url(../images/section_h4_bottom.jpg) bottom no-repeat; margin-bottom: 10px; }

.section_h4_box p { padding: 0 20px; }
.section_h4_box ul { padding: 0 20px; }
.section_h4_box dl { padding: 0 20px; }

.image_l { float: left; margin: 0 16px 8px 0; }
.image_r { float: right; margin: 0 0 8px 16px; }

.case {
	margin: 10px 20px;
	background: url(../images/arrow_h.jpg) center center no-repeat;
}
.case-narrow {
	margin: 10px 40px;
	background: url(../images/arrow_h.jpg) center center no-repeat;
}
.case-noimg { margin: 10px 20px; }



#content ul li {
  list-style: none;
  background: url(../images/li_bg.png) 0 3px no-repeat;
  padding-left: 25px;
	line-height: 2.0;
  }

#content ul.li_blue li { background: url(../images/li_bg02.png) 0 6px no-repeat; }
#content ul.li_blue02 li { background: url(../images/li_bg04.png) 0 6px no-repeat; }
#content ul.li_bg05 li {
	background: url(../images/li_bg05.png) 0 6px no-repeat;
	padding-bottom:5px;
	}

#content ul.totop {
	clear: both;
	padding-bottom: 20px;
}
#content ul.totop li {
	float: right;
	list-style: none;
	background: none;
}


/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/

html {
	background: none;
}

body {
  background: url(../images/body_bg.jpg) top repeat-x;
	color: #333;
	text-align: center;
}

#body02 { background: url(../images/body_bg02.jpg) bottom repeat-x; }

#wrapper {
	width: 960px;
	margin: 0 auto;
  background: url(../images/wrapper_bg.jpg) center repeat-y;
}
#main {
	width: 910px;
	margin: 0 auto;
	padding: 40px 25px 0 25px;
	text-align: left;
  background: url(../images/main_bg.jpg) 0 0 no-repeat;
}

*html #main { width: 960px; }
#content {
	width: 690px;
	margin: 0 0 0 20px;
	text-align: left;
  float: right;
}


/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/

#header {
	width: 960px;
	height: 160px;
	margin: 0 auto;
	text-align: left;
  background: url(../images/header_bg.jpg) 0 0 repeat-x;
}
#header #header_title {
	height: 100px;
	width: 360px;
	line-height: 1.0;
	float: left;
	margin: 0;
	padding: 0;
}

	
#header h1 {
	line-height: 20px;
	font-size: 110%;
	width:960px;
	text-align: right;
	}

#header #header02 {
	float: right;
	padding: 20px 15px 0 0;
	margin:0;
  }
	
#header #header_link {
	margin: 0;
	padding: 0;
	width: 540px;
	height: 70px;
	}

/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/

#footer {
	clear: both;
	height: 140px;
	text-align: center;
  background: url(../images/footer_bg.jpg) 0 repeat-x;
}

#footer #footer_title {
	float: left;
	width: 400px;
	height: 70px;
	margin: 20px 17px 0 0;
	}
	
#footer .footer_cost {
	float: left;
	height: 60px;
	margin: 30px 10px 0 0;
	}

#footer .footer_experience {
	float: left;
	height: 60px;
	margin: 30px 0 0 0;
	}

#footer address {
	clear: both;
	margin: 0 auto;
	line-height: 40px;
	font-size: 110%;
}


/*==========================================================================*/
/*                             gnavi                                  */
/*==========================================================================*/

#gnavi {
	height: 40px;
	width: 960px;
	margin: 0;
	padding: 0;
}
#gnavi ul {
	margin: 0 5px;
}
#gnavi ul li {
	float: left;
	list-style: none;
	line-height: 1.0;
}
/*==========================================================================*/
/*                            Navigation                                    */
/*==========================================================================*/

#navi {
	float: left;
	width: 200px;
}

#navi dl {
	margin: 0 0 10px;
	text-align: left;
}

#navi dl dt,
#navi dl dd {
	list-style: none;
	margin: 0;
	vertical-align: top;
}

#navi ul {
	width: 200px;
	border-top: 3px solid #DCDCDC;
	border-bottom: 3px solid #DCDCDC;
	padding: 5px 0;
	margin-bottom: 10px;
	}
#navi ul li {
	list-style: none;
  background: url(../images/li_bg03.jpg) 0 5px no-repeat;
  padding-left: 15px;
	line-height: 1.8;
	}
	
#navi ul li a { color: #3F3F3F; }
#navi ul li a:hover,
#navi ul li a:active { color: #0074E8; text-decoration: underline; }

#navi #navi_title {
	margin: 0;
	padding: 0;
	}
	
#navi #navi_info { background: #F0F0F0; width: 200px; }


/*==========================================================================*/
/*                            Navigation2                                   */
/*==========================================================================*/

#inner {
	width: 470px;
	float: left;
	margin: 0;
}

#navi2 {
	float: right;
	width: 200px;
	padding: 0 0 0 0;
}

#navi2 .navi02_bg {
	background: url(../images/navi02_bg.jpg) 0 repeat-y;
	margin-bottom: 10px;
	}

#navi2 .navi02_bottom { background: url(../images/navi02_bottom.jpg) bottom no-repeat; }

#navi2 .navi02_bg02 {
	background: url(../images/navi02_bg02.jpg) 0 repeat-y;
	margin-bottom: 10px;
	}

#navi2 .navi02_bottom02 { background: url(../images/navi02_bottom02.jpg) bottom no-repeat; }

#bn_campaign {
	margin: 0 10px 10px 10px;
	padding: 0;
	width: 180px;
	height: 50px;
	}
	
#materials_form,
#report_form {
	padding: 0 7px;
	}

.materials p {
	line-height:1.0;
	margin: 5px 0;
	font-size: 110%;
	}
	
#campaign_title,
#materia_title,
#report_title,
#souken_title {
	margin: 0;
	padding: 0;
	}
	
#souken_box {	padding: 0 5px;	}
.souken_img {
	margin: 0;
	padding: 0;
	}


/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/

.bg_blue {
	border: 1px solid #D9EBFF;
	background: #F8FBFF;
	padding: 5px 10px;
	}
	
.bg_orange {
	border: 1px solid #FFC06E;
	background: #FFF3E3;
	padding: 5px 10px;
	}
	
.p_red {
	color: #DD0000;
	font-weight: bold;
	}
	
.p_blue {
	color: #0066cc;
	font-weight: bold;
	}
	
.p_small { font-size: 110%; }

.alpha { float: left; }
.beta { float: right; }


/* index
------------------------------------------------------------------------*/

#index .section { padding: 15px 0 1em; }

#index .index_h3_bg01 {	background: url(../images/index_h3-bg01.jpg) 0 repeat-y;	}
#index .index_h3_bottom01 {
	background: url(../images/index_h3-bottom01.jpg) bottom no-repeat;
	width: 470px;
	}

#index .index_box { padding: 0 15px 15px; }
#index .index_box02 { padding: 0 15px 5px; }

#index .bg_blue01 { padding: 10px 10px 0 10px; }
#index .bg_blue { margin-bottom: 10px; }

#index .bn_voice {
	margin: 0 0 5px 0;
	padding: 0;
	}
	
#index .bg_blue ul { margin-left: 5px; }


/* material
------------------------------------------------------------------------*/

#material #content table {
  border: 1px solid #B2B2B2;
  font-size: 93%;
  color: #000000;
  width: 420px;
  margin-left: 20px;
  }

#material #content table th,
#material #content table td {
  border: 1px solid #B2B2B2;
  line-height: 1.0;
  }

#material #content table th {
  width: 15px;
  text-align: center;
  color: #FFFFFF;
  }



#material .td_os {
  width: 100px;
  }

#material .th_os1 { background: #0066cc; }
#material .th_os2 { background: #009933; }
#material .th_os3 { background: #99cc00; }
#material .th_os4 { background: #ff9900; }
#material .th_os5 { background: #cc66ff; }

#material .th_ps1 { background: #cc9900; }
#material .th_ps2 { background: #ff0033; }
#material .th_ps3 { background: #009999; }
#material .th_ps4 { background: #0033cc; }
#material .th_ps5 { background: #6600cc; }

#material .th_h { background: #999999; }
#material .th_g { background: #F4E921; }

/* target
------------------------------------------------------------------------*/

#target #content ul.li_bg05 { margin: 15px 70px; }

#target #content .bg_blue { margin-bottom: 20px; }

#target #content .bg_blue p {
	padding-left: 10px;
	}

#target #content .bg_blue .target_title {
	margin: 0;
	padding: 0;
	}

/* voice
------------------------------------------------------------------------*/

#voice #content .bg_blue {
	margin: 15px 70px;
	padding: 10px 60px;
	}
	
#voice .voice_title {
	margin: 0;
	padding: 0 0 0 10px;
	}
	
.hide { display: none }

/* faq
------------------------------------------------------------------------*/

#faq #content table a { color: #666666; }
#faq #content table a:hover,
#faq #content table a:active { color: #666666; text-decoration: none; }

#faq .voice_title {
	margin: 0;
	padding: 0 0 0 10px;
	}

#faq #content table {
  border: 1px solid #B2B2B2;
  font-size: 93%;
  color: #000000;
  width: 450px;
  margin-left: 10px;
  }
	
#faq #content th {
	width:26px;
	padding: 3px;
	}	
#faq .th_q01 {
	background: #0066cc;
	color: #FFFFFF;
	
	}
#faq td.td_q01 {
	background: #EBF7FF;
	width: 23px;
	}
	
#faq .th_q02 {
	background: #009933;
	color: #FFFFFF;
	
	}
#faq td.td_q02 {
	background: #DFF4E6;
	width: 23px;
	}
	
#faq .th_q03 {
	background: #99cc00;
	color: #FFFFFF;
	
	}
#faq td.td_q03 {
	background: #EBF4CE;
	width: 23px;
	}
	
#faq .th_q04 {
	background: #ff9900;
	color: #FFFFFF;
	
	}
#faq td.td_q04 {
	background: #FFEFD9;
	width: 23px;
	}
	
#faq .th_q05 {
	background: #cc66ff;
	color: #FFFFFF;
	
	}
#faq td.td_q05 {
	background: #F8EBFF;
	width: 23px;
	}
	
#faq #content dt {
  margin: 0;
  padding: 10px 10px 5px 40px;
	border: 1px solid #F2EFE2;
  border-bottom: 1px dotted #F2EFE2;
  vertical-align: middle;
	color: #FFFFFF;
  }
  
#faq #content dd {
  margin: 0 0 20px 0;
  padding: 10px 10px 10px 40px;
	border: 1px solid #F2EFE2;
	border-top: none;
	background: url(../images/faq_dd01.jpg) 0 0 no-repeat #FFFFFF;
  }
	
#faq #content .q01_q dt { background: url(../images/faq_dt01.jpg) 0 0 no-repeat #0066cc;  }
#faq #content .q02_q dt { background: url(../images/faq_dt02.jpg) 0 0 no-repeat #009933;  }
#faq #content .q03_q dt { background: url(../images/faq_dt03.jpg) 0 0 no-repeat #99cc00;  }
#faq #content .q04_q dt { background: url(../images/faq_dt04.jpg) 0 0 no-repeat #ff9900;  }
#faq #content .q05_q dt { background: url(../images/faq_dt05.jpg) 0 0 no-repeat #cc66ff;  }


/* training
------------------------------------------------------------------------*/

#training .training_title {
	margin: 0;
	padding: 0 0 0 10px;
	}
	
#training .li_bg05 {
	margin: 0 0 0 70px;
	}

/* corporate
------------------------------------------------------------------------*/

#corporate .corporate_title {
	margin: 0;
	padding: 0 0 0 10px;
	}
	
/* guide
------------------------------------------------------------------------*/

#guide #content .guide_title {
	margin: 0;
	padding: 0 0 0 10px;
	}

#guide #content .section .section .bg_blue,
#guide #content .section .section .bg_orange {
	padding: 5px 10px;
	margin: 10px 20px;
	}
	
#guide #content .dt_01 {
  border: 1px solid #CCCCCC;
  border-bottom: none;
  background: #E8F7F2;
  padding: 5px 0 5px 10px;
	color: #006848;
	margin: 0 20px;
	font-weight: bold;
  }
  
#guide #content .dd_01 {
  border: 1px solid #CCCCCC;
	background: #FFFFFF;
	color: #333333;
  border-top: 1px dotted #CCCCCC;
  padding: 10px 10px 10px 10px;
  margin: 0 20px 20px 20px;
  }
	
#guide #content table {
  border: 1px solid #B2B2B2;
  font-size: 93%;
  color: #000000;
  width: 420px;
  margin-left: 20px;
  }

#guide #content table th,
#guide #content table td {
  border: 1px solid #B2B2B2;
  line-height: 1.0;
  }

#guide #content table th {
  width: 15px;
  text-align: center;
  color: #FFFFFF;
	background: #0066CC;
  }
	
#guide #content .th_350 { width: 350px; }
#guide #content .th_70 { width: 70px; }

/* fee
------------------------------------------------------------------------*/

#fee #content .section .section .bg_blue {
	padding: 5px 10px;
	margin: 10px 20px;
	}
	
#fee #content table {
  border: 1px solid #B2B2B2;
  color: #000000;
  width: 470px;
  margin-left: 0px;
  }

#fee #content table th,
#fee #content table td {
  border: 1px solid #B2B2B2;
  line-height: 1.5;
	padding: 4px 5px;
  }

#fee #content table th {
  width: 15px;
	padding: 10px;
  text-align: center;
  color: #FFFFFF;
	background: #0066CC;
  }
	

#fee #content .t_280 { width: 300px; }
#fee #content .t_90 { width: 90px; }
#fee #content .t_100 { width: 75px; text-align: center;}

/* engine
------------------------------------------------------------------------*/

#engine .alpha { float: left; width: 133px; }
#engine .alpha p {
	margin: 0;
	padding: 0;
	}
#engine .beta { float: right; width: 290px; }
#engine .beta ul {
	margin: 0;
	padding: 0;
	}
 
#engine .engine_box {
	margin: 10px 10px;
	padding: 10px;
	}
	
#engine #content table th { width: 150px; }

/* experience
------------------------------------------------------------------------*/

#experience #content .bg_blue ul {
	margin: 10px 40px;
	}
	
#experience #content table { font-size: 100%; }

#experience #content th,
#experience #content td { padding: 4px 5px; }
	
#experience #content .t_280 { width: 300px; }
#experience #content .t_90 { width: 90px; }
#experience #content .t_100 { width: 75px; text-align: center;}

/* flow
------------------------------------------------------------------------*/

#flow .flow_box {
	margin: 10px;
	}

#flow .flow_box01 {
	margin: 0 0 30px 0;
	}

#flow .alpha01 {
	float: left;
	margin-right: 20px;
	}
	
#flow #content .dt_01 {
  border: 1px solid #CCCCCC;
  border-bottom: none;
  background: #E8F7F2;
  padding: 5px 0 5px 10px;
	color: #006848;
	margin: 0 20px;
	font-weight: bold;
  }
  
#flow #content .dd_01 {
  border: 1px solid #CCCCCC;
	background: #FFFFFF;
	color: #333333;
  border-top: 1px dotted #CCCCCC;
  padding: 10px 10px 10px 10px;
  margin: 0 20px 20px 20px;
  }
	
#flow #content .dt_02 {
  border: 1px solid #CCCCCC;
  border-bottom: none;
  background: #FFD4D4;
  padding: 5px 0 5px 10px;
	color: #FF4040;
	margin: 0 20px;
	font-weight: bold;
  }
  
#flow #content .dd_02 {
  border: 1px solid #CCCCCC;
	background: #FFFFFF;
	color: #333333;
  border-top: 1px dotted #CCCCCC;
  padding: 10px 10px 10px 10px;
  margin: 0 20px 20px 20px;
  }
	
#flow .flow_arrow {
	background: url(../images/flow_arrow.jpg) center bottom no-repeat;
	padding-bottom: 50px;
	}
	
/* system
------------------------------------------------------------------------*/

#system #content .dt_01 {
  border: 1px solid #CCCCCC;
  border-bottom: none;
  background: #FFD4D4;
  padding: 5px 0 5px 10px;
	color: #FF4040;
	margin: 0 20px;
	font-weight: bold;
  }
  
#system #content .dd_01 {
  border: 1px solid #CCCCCC;
	background: #FFFFFF;
	color: #333333;
  border-top: 1px dotted #CCCCCC;
  padding: 10px 10px 10px 10px;
  margin: 0 20px 20px 20px;
  }