@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, textarea, p, blockquote, table, pre, address, ul, ol, dl { font-size: 140%; line-height: 1.5;}

/* for IE7 */
*:first-child+html h1,
*:first-child+html h2,
*:first-child+html h3,
*:first-child+html h4,
*:first-child+html h5,
*:first-child+html h6,
*:first-child+html p,
*:first-child+html table,
*:first-child+html address,
*:first-child+html ul,
*:first-child+html ol,
*:first-child+html dl { font-size: 160%;}

*:first-child+html ul ul,
*:first-child+html ul ol,
*:first-child+html ul dl,
*:first-child+html ul input,
*:first-child+html ul p,
*:first-child+html ol ul,
*:first-child+html ol ol,
*:first-child+html ol dl,
*:first-child+html ol input,
*:first-child+html ol p,
*:first-child+html dl ul,
*:first-child+html dl ol,
*:first-child+html dl dl,
*:first-child+html dl input,
*:first-child+html dl p,
*:first-child+html table table,
*:first-child+html table ul,
*:first-child+html table ol,
*:first-child+html table dl,
*:first-child+html table input,
*:first-child+html table p,
*:first-child+html p input{ font-size: 100%;}


/* for IE 6 or sooner */
* html h1,
* html h2,
* html h3,
* html h4,
* html h5,
* html h6,
* html p,
* html table,
* html address,
* html ul,
* html ol,
* html dl { font-size: 160%;}

* html ul ul,
* html ul ol,
* html ul dl,
* html ul input,
* html ul p,
* html ol ul,
* html ol ol,
* html ol dl,
* html ol input,
* html ol p,
* html dl ul,
* html dl ol,
* html dl dl,
* html dl input,
* html dl p,
* html table table,
* html table ul,
* html table ol,
* html table dl,
* html table input,
* html table p,
* html p input{ font-size: 100%;}


ol li { list-style: decimal;}


/******************************************************************** common
*/

body {
	font-family: "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
	text-align: center;
	background: #fff url(../images/back2.gif) repeat-x;
	color: #868686;
	cursor: auto;
	letter-spacing: 0.1em;
	word-spacing: 0.1em;
}

body.top { background: #fff url(../images/back.gif) repeat-x;}

h1 {}
h2 {}
h3, h4, h5, h6 {}
p { padding: 5px 0 10px;}
blockquote { margin: 15px 0; padding: 10px 15px 3px; background: #faf6ed;}
pre { background: #eee; margin: 1em 0; padding: 0 20px; overflow: auto; width: auto;}
code { color: #5b5905; font-family: "Lucida Grande", "Courier New", Courier, mono, Verdana, sans-serif; letter-spacing: 0;}
ul, ol { margin: 10px 0; padding: 0 0 0 30px;}
dl { margin: 10px 0;}

a         { color: #0071bb; text-decoration: underline; cursor: pointer;}
a:visited { color: #3b41a4;}
a:hover   { color: #f80;}
a:focus,
a:active  { color: #f90;}

strong { font-weight: bold;}
abbr, acronym { cursor: help;}

sup { vertical-align: super; font-size: 100%;}
sub { vertical-align: baseline; font-size: 100%;}


hr { display: none;}
img { border: none; color: #fff; background: transparent; vertical-align: bottom;}

table { border: 1px solid #aaa; border-collapse: collapse; margin-bottom: 15px;}
caption { text-align: left;}
thead {}
tbody {}
th { white-space: nowrap;}
th, td {
	padding: 5px 10px;
	border-collapse: collapse;
	border: 1px solid #aaa;
	text-align: left;
}
tr:hover th,
tr:hover td { background: #fafafa;}


fieldset {
	border: 1px solid #ddd;
	margin-bottom: 15px;
	padding: 10px;
}
* html legend { margin: 0 0 10px;}
input, textarea { padding: 1px;}
input.typeText { border: 1px solid #aaa;}
select option { padding: 0 5px;}
input:focus, select:focus, textarea:focus { background-color: #fafafa;}
label { cursor: pointer;}



/******************************************************************** Float containers fix
===================================================================== a.k.a. clearfix */

/******************** exp IE
*/
#container:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/******************** for IE
Level 2.1*/
#container { display: inline-block;}

/* Holly Hack Targets IE Win only \*/
* html #container { height: 1%;}
#footer,
#container { display: block;}
/* End Holly Hack */


/******************************************************************** universal
*/

.aL { text-align: left;}
.aC { text-align: center;}
.aR { text-align: right;}
.fR { float: right;}
.fL { float: left;}
.clr { float: none; clear: both;}


.gothic{ font-family: "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;}
.jp { font-family: "ヒラギノ角ゴ Pro W3", Osaka, "ＭＳ Ｐゴシック", sans-serif;}
.verdana { font-family: Verdana, sans-serif;}
.times { font-family: "Times New Roman", Times, serif;}

.tempNotes { color: #c00; font-weight: bold; background: #f8f8f8; margin: 1em;}


/******************************************************************** javascript
*/

.rowTint { background: #f9f9f9;}



/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/

#wrapper2 { background: url(../images/w_back2.jpg) no-repeat 50% 0;}
.top #wrapper2 { background: url(../images/w_back.jpg) no-repeat 50% 0;}

#wrapper { width: 940px; margin: 0 auto; text-align: left;}

#header {
	position: relative;
	height: 95px;
}

#container { padding-left: 10px;}

#col-a {
	position: relative;
	display: inline;
	float: right;
	width: 682px;
	padding-bottom: 35px;
}

#col-b {
	position: relative;
	float: left;
	width: 218px;
	padding: 20px 0 35px;
}

.top #col-b { padding: 40px 0 35px;}

#footer {
	clear: both;
	background: url(../images/f_back.gif) repeat-x;
	padding: 20px 0;
}




/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/

#header h1 {
	padding: 8px 0 0;
	color: #a49b90;
	text-align: right;
	font-size: 100%;
}

*:first-child+html #header h1{ font-size: 110%;}
* html #header h1 { font-size: 110%;}

#header p {
	position: absolute;
	top: 24px;
	left: 10px;
	padding: 0;
}

#header ul {
	position: absolute;
	top: 34px;
	left: 50%;
	padding: 0 0 0 89px;
}

#header ul li { float: left;}
#header ul li#h-con { padding-top: 13px;}


/*==========================================================================*/
/*                            globalNav                                     */
/*==========================================================================*/

#globalNav {
	height: 46px;
	padding: 0;
	margin: 0;
}

.top #globalNav { height: 56px;}

#globalNav li { float: left;}


/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/

#footer div {
	width: 940px;
	margin: 0 auto;
	text-align: left;
}

#footer address {
	letter-spacing: 0.05em;
	line-height: 1.5;
	font-size: 120%;
}

*:first-child+html #footer address{ font-size: 120%;}
* html #footer address { font-size: 120%;}

.pageTop { margin-top: -1.5em; padding: 0; text-align: right;}




/*==========================================================================*/
/*                            Navigation                                    */
/*==========================================================================*/

#col-b p { padding: 0;}

#menu { margin: 5px 0 23px;}

#col-b ul {
	padding: 0;
	margin: 0;
}

#col-b ul li { margin-bottom: 10px;}

#m-link { margin: 0 0 10px;}
#m-link dt { padding-bottom: 5px;}

#m-link dd { font-size: 90%; margin-bottom: 5px;}
*:first-child+html #m-link dd{ font-size: 90%;}
* html #m-link dd { font-size: 90%;}

#col-b dl#m-link dd a {
	display: block;
	background: url(../images/m-icon.gif) no-repeat 8px 50%;
	width: 200px;
	padding: 0 0 0 18px;
	text-decoration: none;
	color: #868686;
}

* html #col-b dl#m-link dd a { width: 218px;}

#col-b dl#m-link dd a:hover { text-decoration: underline;}

#m-com {
	background: url(../images/m-com.gif) no-repeat;
	width: 208px;
	height: 197px;
	padding: 15px 0 0 10px;
	margin: 0;
}

* html #m-com { width: 218px; height: 212px;}

#col-b ul#mbn {
	background: url(../images/mbn.gif) no-repeat;
	width: 208px;
	height: 302px;
	padding: 11px 0 0 10px;
	margin-bottom: 15px;
}

#col-b ul#mbn li { margin-bottom: 4px;}









/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/

#breadcrumbsList { padding: 0; text-align: right; font-size: 120%;}
*:first-child+html #breadcrumbsList { font-size: 120%;}
* html #breadcrumbsList { font-size: 120%;}

#col-a h3 { margin: 20px 0 5px;}

#col-a h4 {
	background: #c3d957 url(../images/h4.gif) no-repeat;
	width: 662px;
	padding: 6px 0 5px 20px;
	margin: 20px 0 5px;
	font-weight: bold;
	color: #4d4d4d;
}

* html #col-a h4 { width: 682px;}

#col-a h5 {
	background: url(../images/h5.gif) no-repeat 0 3px;
	border-bottom: 1px dashed #b3b3b3;
	width: 657px;
	padding: 0 0 3px 25px;
	margin: 20px 0 5px;
	font-weight: bold;
}

* html #col-a h5 { width: 682px;}

#col-a .imgL {
	float: left;
	padding-right: 10px;
}

#col-a .imgR {
	float: right;
	padding-left: 10px;
}


/* top
------------------------------------------------------------------------*/

.top #mainimage {
	position: relative;
	width: 920px;
	height: 368px;
	padding: 0 10px;
}

* html .top #mainimage { width: 940px;}

.top #mainimage ul {
	padding: 0;
	margin: 0;
	float: left;
}

.top #mainimage ul li { margin-bottom: 7px;}

.top #mainimage h2 {
	position: absolute;
	top: 0;
	left: 251px;
}

.top #mainimage h2 img {
	position: absolute;
	top: 0;
	left: 0;
}

.top #col-a { padding-top: 40px;}

.top #inner { padding-left: 8px;}

.top #col-a h3 { margin: 0 0 20px;}

.top #col-a div.fL p { width: 295px;}

.top #pick { border: 1px solid #e5dbd1;}

.top #col-a #pick h3 { margin: 0;}

.top #col-a #pick div {
	background: url(../images/top-border.gif) no-repeat 0 100%;
	padding-bottom: 10px;
}

.top #col-a #pick div.end {
	background: none;
	padding-bottom: 0;
}

.top #col-a #pick h4 {
	background: none;
	width: 209px;
	padding: 0;
	margin: 0;
	float: left;
}

.top #col-a #pick ul {
	position: relative;
	width: 446px;
	padding: 24px 17px 0 0;
	margin: 0;
	float: right;
}

* html .top #col-a #pick ul { width: 463px;}

.top #col-a #pick ul li { margin-bottom: 1px;}

.top #col-a #pick ul li.end {
	position: absolute;
	top: 24px;
	left: 225px;
}

.top #col-a #pick p {
	width: 446px;
	padding-right: 17px;
	float: right;
	font-size: 120%;
	letter-spacing: 0;
}
*:first-child+html .top #col-a #pick p { font-size: 140%;}
* html .top #col-a #pick p { font-size: 140%; width: 463px;}

/* demesne
------------------------------------------------------------------------*/

.demesne #nav {
	background: url(../images/nav.gif) no-repeat;
	width: 668px;
	height: 222px;
	padding: 28px 0 0 14px;
	margin-bottom: 20px;
}

* html .demesne #nav { width: 682px; height: 250px;}

.demesne #col-a div { padding-left: 134px; margin-bottom: 20px;}

.demesne #ts01 { background: url(../images/merit1.gif) no-repeat;}
.demesne #ts02 { background: url(../images/merit2.gif) no-repeat;}
.demesne #ts03 { background: url(../images/merit3.gif) no-repeat;}

.demesne #col-a h4 { background: none; width: 548px; padding: 0; margin: 0;}
* html .demesne #col-a h4 { width: 548px;}


/* support
------------------------------------------------------------------------*/

.support #col-a div { margin-bottom: 20px;}

.support #col-a div h4 {
	background: none;
	width: 320px;
	padding: 0 15px 0 0;
	margin: 0;
	float: left;
}

* html .support #col-a div h4 { width: 320px;}


/* custom
------------------------------------------------------------------------*/

.custom #nav {
	background: url(../images/nav2.gif) no-repeat;
	width: 668px;
	height: 287px;
	padding: 28px 0 0 14px;
	margin-bottom: 20px;
}

* html .custom #nav { width: 682px; height: 315px;}

.custom #col-a div { padding-left: 134px; margin-bottom: 20px;}

.custom #ts01 { background: url(../images/merit1.gif) no-repeat;}
.custom #ts02 { background: url(../images/merit2.gif) no-repeat;}
.custom #ts03 { background: url(../images/merit3.gif) no-repeat;}
.custom #ts04 { background: url(../images/merit4.gif) no-repeat;}

.custom #col-a h4 { background: none; width: 548px; padding: 0; margin: 0;}
* html .custom #col-a h4 { width: 548px;}


/* cprice
------------------------------------------------------------------------*/

.cprice #nav {
	background: url(../images/cprice-nav.gif) no-repeat;
	width: 668px;
	height: 72px;
	padding: 38px 0 0 14px;
	margin-bottom: 20px;
}

* html .cprice #nav { width: 682px; height: 110px;}

.cprice #nav li { float: left; padding-right: 6px;}

.cprice #col-a div p { padding: 10px 0 0;}

.cprice #col-a .aBox { width: 682px;}

.cprice #col-a .aBox p {
	padding: 0;
	float: left;
}

.cprice #col-a .aBox ul {
	padding: 0;
	margin: 0;
	width: 290px;
	float: right;
}

.cprice #col-a .aBox li {
	float: left;
	padding-left: 5px;
	margin-bottom: 5px;
}

.cprice #col-a .aBox p.text {
	padding: 15px 0 0;
	float: none;
	font-size: 100%;
	clear: both;
}
*:first-child+html .cprice #col-a .aBox p.text { font-size: 110%;}
* html .cprice #col-a .aBox p.text { font-size: 110%;}


/* cflow
------------------------------------------------------------------------*/

.cflow #col-a dd {
	border: 1px solid #e5dbd1;
	border-top: none;
	width: 650px;
	padding: 10px 15px;
	margin-bottom: 15px;
}

* html .cflow #col-a dd { width: 682px;}


/* reform
------------------------------------------------------------------------*/

.reform #nav {
	background: url(../images/nav3.gif) no-repeat;
	width: 668px;
	height: 157px;
	padding: 28px 0 0 14px;
	margin-bottom: 20px;
}

* html .reform #nav { width: 682px; height: 185px;}

.reform #col-a div { padding-left: 134px; margin-bottom: 20px;}

.reform #ts01 { background: url(../images/merit1.gif) no-repeat;}
.reform #ts02 { background: url(../images/merit2.gif) no-repeat;}

.reform #col-a h4 { background: none; width: 548px; padding: 0; margin: 0;}
* html .reform #col-a h4 { width: 548px;}


/* rprice
------------------------------------------------------------------------*/

.rprice #col-a div.fL p { width: 295px;}


/* rflow
------------------------------------------------------------------------*/

.rflow #col-a dd {
	border: 1px solid #e5dbd1;
	border-top: none;
	width: 650px;
	padding: 10px 15px;
	margin-bottom: 15px;
}

* html .rflow #col-a dd { width: 682px;}


/* corporate
------------------------------------------------------------------------*/

.corporate #col-a dd {
	border: 1px solid #e5dbd1;
	border-top: none;
	width: 650px;
	padding: 10px 15px;
	margin-bottom: 15px;
}

* html .corporate #col-a dd { width: 682px;}

.corporate #col-a dd img { padding-left: 15px;}


/* area
------------------------------------------------------------------------*/

.area #col-a .clearfix p { padding: 18px 0 0;}
.area #col-a .clearfix p.fL { padding: 0 10px 0 0;}

.area #col-a dd {
	border: 1px solid #e5dbd1;
	border-top: none;
	width: 650px;
	padding: 10px 15px;
	margin-bottom: 15px;
}

* html .area #col-a dd { width: 682px;}

.area #col-a dd img { padding-left: 15px;}


/* qa
------------------------------------------------------------------------*/

.qa #nav {
	background: url(../images/cprice-nav.gif) no-repeat;
	width: 668px;
	height: 72px;
	padding: 38px 0 0 14px;
	margin-bottom: 20px;
}

* html .qa #nav { width: 682px; height: 110px;}

.qa #nav li { float: left; padding-right: 8px;}

.qa #col-a dd {
	background: url(../images/a.gif) no-repeat 10px 12px;
	border: 1px solid #e5dbd1;
	border-top: none;
	width: 632px;
	padding: 10px 15px 10px 33px;
	margin-bottom: 15px;
}

* html .qa #col-a dd { width: 682px;}

.qa #col-a dd p { padding: 10px 0 0;}



/* company
------------------------------------------------------------------------*/

.company #col-a table { width: 682px;}

.company #col-a th {
	background: url(../images/th.gif) repeat;
	text-align: center;
}

.company #col-a td ul { padding: 0; margin: 0;}

.company #col-a td ul li {
	background: url(../images/list.gif) no-repeat 0 5px;
	width: 500px;
	padding-left: 10px;
	margin-bottom: 5px;
}

.company #col-a dt {
	float: left;
	clear: left;
	font-weight: bold;
	padding-right: 10px;
	margin-bottom: 5px;
}

.company #col-a dd { margin-bottom: 5px;}

.company #col-a div.clearfix { margin-top: 15px;}

.company #col-a .light {
	width: 330px;
	padding: 0;
	margin: 0;
	float: right;
}

.company #col-a .light img { float: left; padding: 0 10px 10px 0;}

.company #col-a .aBox p { padding: 10px 0 0;}

.company #col-a .aBox { width: 682px;}

.company #col-a .aBox p {
	padding: 0;
	float: left;
}

.company #col-a .aBox ul {
	padding: 0;
	margin: 0;
	width: 290px;
	float: right;
}

.company #col-a .aBox li {
	float: left;
	padding-left: 5px;
	margin-bottom: 5px;
}

.company #col-a .aBox p.text {
	padding: 15px 0 0;
	float: none;
	font-size: 100%;
	clear: both;
}
*:first-child+html .company #col-a .aBox p.text { font-size: 110%;}
* html .company #col-a .aBox p.text { font-size: 110%;}



/* voice
------------------------------------------------------------------------*/

.voice #col-a dd {
	border: 1px solid #e5dbd1;
	border-top: none;
	width: 650px;
	padding: 10px 15px;
	margin-bottom: 15px;
}

* html .voice #col-a dd { width: 682px;}



