@charset "Shift_JIS";



/*======================================================================================================================
========================================================================================================================

contents.css

コンテンツエリア全体、各パーツ用　ボディ、リンク色の再設定もここで

========================================================================================================================
======================================================================================================================*/



/* コンテンツ基本指定
-------------------------------------------------------------------------------------------------------- */
body {
}

a:link {
}

a:visited {
}

a:hover {
}

a:active {
}

#contents {
	margin:     0px 0px 15px 0px;
	width:      800px;
}

#main {
	width:      590px;
	float:      left;
}
#main a:link {
	color:           #262626;
	text-decoration: underline;
}
#main a:visited {
	color:           #666666;
	text-decoration: underline;
}
#main a:hover {
	color:           #CC0000;
	text-decoration: underline;
}

#sub {
	width:      180px;
	float:      right;
}




/* タイトル指定
-------------------------------------------------------------------------------------------------------- */

/* 先頭　赤ライン　グレータイトル */
.ttl_frontline_red {
	padding:       10px 10px 10px 7px;
	border-left:   4px solid #C5080F;
	background:    #EEEEEE;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
}
#main .ttl_frontline_red a:link,
#main .ttl_frontline_red a:hover { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}


/* 先頭　青ライン　グレータイトル */
.ttl_frontline_blue {
	padding:       10px 10px 10px 7px;
	border-left:   4px solid #00338B;
	background:    #EEEEEE;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
}
#main .ttl_frontline_blue a:link,
#main .ttl_frontline_blue a:hover { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}


/* 先頭　オレンジライン　グレータイトル */
.ttl_frontline_orange {
	padding:       10px 10px 10px 7px;
	border-left:   4px solid #E67C00;
	background:    #EEEEEE;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
}
#main .ttl_frontline_orange a:link,
#main .ttl_frontline_orange a:hover,
#main .ttl_frontline_orange a:visited { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}


/* 先頭　緑ライン　グレータイトル */
.ttl_frontline_green {
	padding:       10px 10px 10px 7px;
	border-left:   4px solid #00BFA9;
	background:    #EEEEEE;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
}
#main .ttl_frontline_green a:link,
#main .ttl_frontline_green a:hover { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}


/* アンダー　赤・グレーラインタイトル */
.ttl_red_gray {
	padding:       2px 0px 10px 0px;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
	background:    url(../img/title/ttl_red_gray.gif) left bottom no-repeat;
}


/* アンダー　青・グレーラインタイトル */
.ttl_blue_gray {
	padding:       2px 0px 10px 0px;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
	background:    url(../img/title/ttl_blue_gray.gif) left bottom no-repeat;
}


/* 赤■タイトル */
.ttl_square {
	margin:         0px 0px 5px 0px;
	padding:        0px 0px 0px 15px;
	background:     url(../img/item/icon_square_red.gif) 0px 3px no-repeat;
	font-size:      100%;
	font-weight:    normal;
	zoom:           1; /* 印刷バグ解決 */
}
#main .ttl_square a:link,
#main .ttl_square a:hover { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}


/* 商品名から探す（アルファベット順）用タイトル */
.ttl_alphabetized {
	padding:       10px;
	background:    #EE6413;
	color:         #FFFFFF;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
}
#main .ttl_alphabetized a:link,
#main .ttl_alphabetized a:hover { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #FFFFFF;
}


/* 商品名から探す（五十音順）用タイトル */
.ttl_gojuonized {
	padding:       10px;
	background:    #0040A4;
	color:         #FFFFFF;
	font-size:     116%;
	line-height:   100%;
	font-weight:   bold;
}
#main .ttl_alphabetized a:link,
#main .ttl_alphabetized a:hover { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #FFFFFF;
}


/* タイトル内　行間調整 */
.ttl_lh130 {
	line-height:     130%;
}
.ttl_lh150 {
	line-height:     150%;
}
.ttl_lh180 {
	line-height:     180%;
}


/* 青■タイトル */
.ttl_square_blue {
	margin:         0px 0px 5px 0px;
	padding:        0px 0px 0px 15px;
	background:     url(../img/item/icon_square_blue.gif) 0px 3px no-repeat;
	font-size:      100%;
	font-weight:    normal;
}
#main .ttl_square_blue a:link,
#main .ttl_square_blue a:hover { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}


/* 赤→タイトル */
.ttl_arrow_red {
	margin:         0px 0px 5px 0px;
	padding:        0px 0px 0px 15px;
	background:     url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	font-size:      100%;
	font-weight:    normal;
	zoom:           1; /* 印刷バグ解決 */
}
#main .ttl_arrow_red a:link,
#main .ttl_arrow_red a:hover,
#main .ttl_arrow_red a:visited { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}

/* 白→タイトル */
.ttl_arrow_white {
	margin:         0px 0px 5px 0px;
	padding:        0px 0px 0px 15px;
	background:     url(../img/item/icon_arrow_white.gif) 0px 3px no-repeat;
	font-size:      100%;
	font-weight:    normal;
	zoom:           1; /* 印刷バグ解決 */
}
#main .ttl_arrow_white a:link,
#main .ttl_arrow_white a:hover,
#main .ttl_arrow_white a:visited { /* アンカーリンクがある場合のホバー等消し */
	text-decoration: none;
	color:           #333333;
}




/* リスト指定
-------------------------------------------------------------------------------------------------------- */

/* アイコンありリスト
------------------------------------------ */

/* 白矢印アイコンリスト */
.arrow_white_list {
	list-style:    none;
}
.arrow_white_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_white.gif) 0px 3px no-repeat;
}

/* 白矢印　下向きアイコンリスト　並列 */
.arrow_white_flist {
	list-style:    none;
}
.arrow_white_flist li {
	margin:        0px 8px 0px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_pagedown.gif) 0px 3px no-repeat;
	float:         left;
}

/* 赤矢印アイコンリスト */
.arrow_red_list {
	list-style:    none;
}
.arrow_red_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 4px no-repeat;
}

/* 赤矢印アイコンリスト　並列 */
.arrow_red_flist {
	list-style:    none;
}
.arrow_red_flist li {
	margin:        0px 8px 0px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	float:         left;
}
.arrow_red_flist li.last {
	margin:        0px 0px 0px 0px; /* 右マージンなし　リストの最後に設置 */
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	float:         left;
}

/* 赤矢印　下向きアイコンリスト */
.arrow_red_down_list {
	list-style:    none;
}
.arrow_red_down_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red_down.gif) 0px 3px no-repeat;
}

/* 赤矢印　下向きアイコンリスト　並列 */
.arrow_red_down_flist {
	list-style:    none;
}
.arrow_red_down_flist li {
	margin:        0px 8px 0px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red_down.gif) 0px 3px no-repeat;
	float:         left;
}

/* 黄土色矢印アイコンリスト */
.arrow_orcher_list {
	list-style:    none;
}
.arrow_orcher_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_orcher.gif) 0px 3px no-repeat;
}

/* グレー矢印アイコンリスト */
.arrow_gray_list {
	list-style:    none;
}
.arrow_gray_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_gray.gif) 0px 3px no-repeat;
}

/* 赤矢印アイコンリスト */
.arrow_blue_list {
	list-style:    none;
}
.arrow_blue_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_blue.gif) 0px 4px no-repeat;
}

/* 赤■アイコンリスト */
.square_red_list {
	list-style:    none;
}
.square_red_list li {
	margin:        0px 0px 0px 0px;
	padding:       0px 0px 0px 15px;
	background:    url(../img/item/icon_square_red.gif) 0px 3px no-repeat;
}

/* 青■アイコンリスト */
.square_blue_list {
	list-style:    none;
}
.square_blue_list li {
	margin:        0px 0px 0px 0px;
	padding:       0px 0px 0px 15px;
	background:    url(../img/item/icon_square_blue.gif) 0px 3px no-repeat;
}

/* 赤■アイコン定義リスト */
.square_red_list dt {
	margin:        0px 0px 0px 0px;
	padding:       0px 0px 0px 15px;
	background:    url(../img/item/icon_square_red.gif) 0px 3px no-repeat;
}
.square_red_list dd {
	margin:        0px 0px 5px 15px;
}

/* 青■アイコン定義リスト */
.square_blue_list dt {
	margin:        0px 0px 0px 0px;
	padding:       0px 0px 0px 15px;
	background:    url(../img/item/icon_square_blue.gif) 0px 3px no-repeat;
}
.square_blue_list dd {
	margin:        0px 0px 5px 15px;
}

/* PDFアイコンリスト */
.pdf_list {
	list-style:    none;
}
.pdf_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 20px;
	background:    url(../img/item/icon_pdf_s.gif) 0px 0px no-repeat;
}

/* 外部リンクアイコンリスト */
.outsidelink_list {
	list-style:    none;
}
.outsidelink_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 20px;
	background:    url(../img/item/icon_outside.gif) 3px 5px no-repeat;
}

/* 外部リンクアイコン(orcher)リスト */
.outsidelink_orcher_list {
	list-style:    none;
}
.outsidelink_orcher_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 15px;
	background:    url(../img/item/icon_outside_orcher.gif) 3px 5px no-repeat;
}

/* メールアイコンリスト */
.mail_list {
	list-style:    none;
}
.mail_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 22px;
	background:    url(../img/item/icon_mail.gif) 3px 5px no-repeat;
}
.freephone {
	list-style:    none;
}
.freephone li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 31px;
	background:    url(../img/item/icon_freephone_o.gif) 0px 1px no-repeat;
}

/* RSSアイコンリスト */
.feed_list {
	list-style:    none;
}
.feed_list li {
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 22px;
	background:    url(../img/item/icon_feed.gif) 0px 0px no-repeat;
}


/* リストスタイルリスト
------------------------------------------ */

/* 中黒リスト */
.disc_list li {
	display:       list-item;
	list-style:    disc outside;
	margin:        0px 0px 5px 20px;
	padding:       0px 0px 0px 0px;
}

/* ナンバリングリスト */
.decimal_num_list li {
	display:       list-item;
	list-style:    decimal outside;
	margin:        0px 0px 5px 30px;
	padding:       0px 0px 0px 0px;
}

/* アイコン無し定義リスト */
.definition_list dt {
	margin:        0px;
	padding:       0px;
}
.definition_list dd {
	margin:        0px 0px 5px 25px;
}

/* 無地アイコンリスト　並列 */
.flist {
	list-style:    none;
}
.flist li {
	margin:        0px 8px 0px 0px;
	padding:       0px 0px 0px 0px;
	float:         left;
	white-space:   nowrap;
}
.flist li a{
	margin:        0px 8px 0px 0px;
}
.flist li.last {
	margin:        0px 0px 0px 0px; /* 右マージンなし　リストの最後に設置 */
	padding:       0px 0px 0px 0px;
	float:         left;
}




/* レイアウト情報あり　リスト指定
-------------------------------------------------------------------------------------------------------- */

/* 赤矢印アイコンリスト　並列2カラム （会社情報インデックスなどで使用）　*/
.two_column_red {
	list-style:    none;
}
.two_column_red li {
	width:         42%;
	margin:        0px 5px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	float:         left;
}
.two_column_red li.long {
	width:         70%;
	margin:        0px 5px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	float:         left;
}


/* 赤矢印アイコンリスト　並列3カラム （システムくんについてなどで使用）　*/
.three_column_red {
	list-style:    none;
}
.three_column_red li {
	width:         30%;
	margin:        0px 5px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	float:         left;
}


/* 赤矢印アイコンリスト　並列4カラム （ソリューション・商品などで使用）　*/
.four_column_red {
	list-style:    none;
}
.four_column_red li {
	width:         22%;
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	float:         left;
}
.four_column_red li.long {
	width:         46.3%;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
	float:         left;
}


/* 赤矢印アイコンリスト　リスト要素ドットライン区切り （ソリューション・商品などで使用）　*/
.arrow_red_dotline {
	margin-top:    -5px; /* liのパディングトップを補正 */
}
.arrow_red_dotline li {
	padding:       5px 0px 5px 0px;
	background:    url(../img/item/dotline_black.gif) left bottom no-repeat;
	/*line-height:150%;*/
}
.arrow_red_dotline li .icon {
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red.gif) 0px 3px no-repeat;
}


/* 赤矢印　下向きアイコンリスト　並列2カラム （ソリューション・商品　課題からさがす　などで使用）　*/
.two_column_area { /* グレーボックス */
	padding:       10px 0px 5px 10px;
	border:        solid 1px #C6C6C6;
	background:    #F5F5F5;
}
.two_column_down {
	list-style:    none;
}
.two_column_down li {
	width:         45%;
	margin:        0px 5px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_pagedown.gif) 0px 3px no-repeat;
	float:         left;
}

/* 赤矢印　下向きアイコンリスト　並列3カラム （ソリューション・商品　課題からさがす　などで使用）　*/
.three_column_area { /* グレーボックス */
	padding:       10px 0px 5px 10px;
	border:        solid 1px #C6C6C6;
	background:    #F5F5F5;
}
.three_column_down {
	list-style:    none;
}
.three_column_down li {
	width:         30%;
	margin:        0px 5px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_pagedown.gif) 0px 3px no-repeat;
	float:         left;
}

/* 赤矢印　下向きアイコンリスト　並列4カラム （課題から探すなどで使用）　*/
.four_column_area { /* グレーボックス */
	padding:       10px 0px 5px 10px;
	border:        solid 1px #C6C6C6;
	background:    #F5F5F5;
}
.four_column_down {
	list-style:    none;
}
.four_column_down li {
	width:         120px;
	margin:        0px 5px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_pagedown.gif) 0px 3px no-repeat;
	float:         left;
}
.four_column_down li.long {
	width:         259px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_pagedown.gif) 0px 3px no-repeat;
	float:         left;
}

/* 赤矢印　下向きアイコンリスト　並列4カラム （導入事例などで使用）　*/
.four_column_area_white { /* 背景・ボーダーなし */
	padding:       11px 1px 6px 11px;
}
.four_column_red_down {
	list-style:    none;
}
.four_column_red_down li {
	width:         22%;
	margin:        0px 0px 5px 0px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red_down.gif) 0px 3px no-repeat;
	float:         left;
}
.four_column_red_down li.long {
	width:         266px;
	padding:       0px 0px 0px 14px;
	background:    url(../img/item/icon_arrow_red_down.gif) 0px 3px no-repeat;
	float:         left;
}





/* リスト要素　行間詰め用
-------------------------------------------------------------------------------------------------------- */

.li_b01 li {
	margin-bottom: 1px;
}





/* テーブル（表）指定
-------------------------------------------------------------------------------------------------------- */

/* テーブルのマージン、パディング、ボーダーは基本的にHTMLタグで指定 */





/* ドットライン指定
-------------------------------------------------------------------------------------------------------- */

.dotline_black {
	height:        1px;
	background:    url(../img/item/dotline_black.gif) no-repeat;
}

* html .dotline_black img {
	vertical-align: baseline;
}



/* ソリッドライン指定
-------------------------------------------------------------------------------------------------------- */

.solidline_gray {
	height:        1px;
	background:    url(../img/item/solidline_gray.gif) no-repeat;
}

* html .solidline_gray img {
	vertical-align: baseline;
}





/* 備考・付属エリア指定
-------------------------------------------------------------------------------------------------------- */

/* グレーボーダー／グレー背景ボックス */
.gray_box {
	padding:       10px;
	border:        solid 1px #C6C6C6;
	background:    #F5F5F5;
}
.gray_box_nb { /* 下・左余白なし */
	padding:       10px 0px 0px 10px;
	border:        solid 1px #C6C6C6;
	background:    #F5F5F5;
}

/* グレーボーダー／グレー背景ボックス　濃いグレー */
.gray_box2 {
	padding:       10px;
	border:        solid 1px #C6C6C6;
	background:    #EBEBEB;
}
.gray_box2_nbr { /* 下・右余白なし */
	padding:       10px 0px 0px 10px;
	border:        solid 1px #C6C6C6;
	background:    #EBEBEB;
	height:        1%; /* IEのhasLayoutバグ回避用  */
}
.gray_box2_nb { /* 下余白なし */
	padding:       10px 10px 0px 10px;
	border:        solid 1px #C6C6C6;
	background:    #EBEBEB;
	height:        1%; /* IEのhasLayoutバグ回避用  */
}

/* グレーボーダー／白背景ボックス */
.white_box {
	padding:       10px;
	border:        solid 1px #C6C6C6;
	background:    #FFFFFF;
	height:        1%; /* IEのhasLayoutバグ回避用  */
}

/* グレーボーダー／ピンク背景ボックス */
.pink_box {
	padding:       10px;
	border:        solid 1px #C6C6C6;
	background:    #FFE6E9;
	height:        1%; /* IEのhasLayoutバグ回避用  */
}

/* グレーボーダー／ピンク背景ボックス */
.red_box {
	padding:       10px;
	border:        solid 1px #CC0000;
	background:    #FFE6E9;
	height:        1%; /* IEのhasLayoutバグ回避用  */
}




/* 最新情報エリア指定　（ソリューション・商品　詳細ページなど）
-------------------------------------------------------------------------------------------------------- */

/* タイトル */
.ttl_reacently_gray {
	float:         left;
	padding:       2px 37px 0px 5px;
	background:    #DADADA url(../img/title/bg_box_gray.gif) right top no-repeat;
	font-weight:   bold;
}

/* グレーボーダー／ノーパディングボックス */
.gray_box_npad {
	border:        solid 1px #C6C6C6;
	background:    #F5F5F5;
	height:        1%; /* IEのhasLayoutバグ回避用  */
}
.gray_box_npad .inner {
	clear:         left;
	padding:       15px;
}





/* 問い合わせエリア指定
-------------------------------------------------------------------------------------------------------- */

/* タイトル */
.ttl_inquiry_orange {
	float:         left;
	padding:       2px 37px 0px 5px;
	background:    #E64C00 url(../img/title/bg_box_orange.gif) right top no-repeat;
	color:         #FFFFFF;
	font-weight:   bold;
}


/* オレンジボーダーボックス */
.orange_box {
	clear:         left;
	width:         590px;
}
.orange_box .inner {
	padding:       15px;
	border:        solid 2px #E64C00;
	background:    #F6F5E3;
}