@charset "utf-8";
/* ===================================================================
File info
 author     :AKAI Taro
 style info :共通（ヘッダー、フッター）
 note       :製品ページ共通デザイン
=================================================================== */
/*----------------------------------------------------
	#グローバルメニュー
----------------------------------------------------*/
#gNavProduct { background-position: -320px -36px; }

/*----------------------------------------------------
	#メインエリア
----------------------------------------------------*/

#main ul.productMenu { border: none; padding: 0; margin-right: 0px; }
#main ul.productMenu li{ width: 210px; float: left; background-image: url(none); border: none; padding: 0; font-size: 12px; line-height: 1.4; margin: 0 15px 15px 0; }
#main ul.productMenu li a{}

.coulum2{ margin: 0 50px; border-top: 1px solid #ccc; width: 660px; padding:15px 0; }
.coulum2 div{ float:left; }
.coulum2 div.left{ border-right:1px dotted #ccc; padding-right:15px; width:314px;}
.coulum2 div.right{ padding-left:15px; width:315px;}
.coulum2 h4{ margin-bottom:10px; }
#main .coulum2 div p{ margin:0; font-size: 12px; }

.productMenu2Container{ border:1px solid #ccc; width:710px; clear: both; margin: 0 0 30px 25px; }
#main .productMenu2Container h2{ float:left; width:225px; border: none; clear: none; margin: 0 25px 0 0; padding: 0; }
#main ul.typeMenu { border: none; padding: 24px 0 0 0; float:left; width:450px; margin: 0; clear: none; }
#main ul.typeMenu li{ width: 210px; float: left; background-image: url(none); border: none; padding: 0; font-size: 12px; line-height: 1.4; margin: 0 15px 15px 0; }
#main ul.typeMenu li a{}
#main ul.typeMenu li a:hover{ position:relative; top:1px; left:1px;}

#main h2 { }
#main h3 { border-bottom: 3px solid #ccc; color: #332f2a; margin-right: 50px; margin-bottom: 15px; padding-bottom: 5px; }

#main .productMenu a img { text-decoration:none;}

#main #accessory{ border:6px solid #e5e5e5; padding: 16px 0 0 33.6px; margin:0 50px 2em 50px; width: 615px; }
#main #accessory ul{ padding:0; border:none; margin:0 0 16px; width: 615px; _overflow:hidden;}
#main #accessory ul li{ background-image: url(none); float: left; width: 120px; padding: 0; font-size: 12px; line-height: 1.4; border: none; margin: 0 33.6px 0 0; overflow: hidden; }
#main #accessory ul li img{}


/*個別ページ*/
.productContainer{ width:690px; margin:0 0 0 50px; clear: both; }
.productContainer div{ width:315px; float:left; margin-right:30px;}
#main .productContainer div h3{ margin: 0 0 1em 0; border-bottom:1px solid #2b71b8; padding: 5px 0 5px 18px; border-left: 5px solid #2b71b8; color: #2b71b8; }
#main .productContainer div p,
#main .productContainer div ul{ margin:0 0 20px 0; }

#main .productContainer div ul{ border: none; border-top: 1px dotted #ccc; padding: 0; }
#main .productContainer div ul li{ background-image: url(none); padding: 0; }



#main ul#btnContact{ border: none; padding: 89px 0 0 10px; background-image: url(../img/product/btn-contact.jpg); width: 650px; height: 206px; margin: 20px 50px 2em; }
#main ul#btnContact li{ border: 0; padding: 0; margin-bottom: 10px; background-image:none; width: 250px; height: 50px; }
#main ul#btnContact li a{ display:block; text-indent:-6666px; background-image: url(../img/product/btn-contact.jpg); width: 250px; height: 50px;}
#main ul#btnContact li#request a{ background-position:-10px -89px; }
#main ul#btnContact li#contact a{ background-position:-10px -149px; }
#main ul#btnContact li#request a:hover { background-position:-10px -384px; }
#main ul#btnContact li#contact a:hover { background-position:-10px -444px; }


/* -----------------------------------------------------------
	#左エリア
----------------------------------------------------------- */

#sideLeft { width: 200px; padding:0px; }
#sideLeft dt{ margin-bottom:0;}
#sideLeft li a{ display:block; background-image:url(../img/common/list0.gif); background-position:10px center; _vertical-align:bottom; zoom:1; height: 28px; line-height:28px; border-bottom:1px dotted #ccc; padding:0 0 0 30px; margin:0 1px;}
#sideLeft li a:hover { background-image:url(../img/common/list1.gif); background-position:10px center; background-color:#E8EEF9; color:#332f2a; text-decoration:none;}
#sideLeft dt a{ display:block; font-size:14px; width:130px; height:45px; padding-left:70px; background-image:url(../img/top-index/side-left-nav.jpg); line-height:45px; position:relative; top:-1px; font-weight:bold;}

#sideLeft dl { background-image:url(../img/product/side-list-bg.gif); background-repeat:repeat-y; }
#sideLeft ul { margin-bottom:0;}

#gyomu a{ background-position:0 0;}
#gyomu a:hover{ background-position:0 -45px;}
#ems a{ background-position:0 -90px;}
#ems a:hover{ background-position:0 -135px;}
#koiki a{ background-position:0 -180px;}
#koiki a:hover{ background-position:0 -225px;}
#sideLeft #gps a{ background-position:0 -270px; line-height:18px;  width: 70px; padding: 5px 60px 0 70px; height: 40px; }
#sideLeft #gps a:hover{ background-position:0 -315px;}
#sideLeft dt#maker a{ background-position:0 -360px; height:29px; padding-left:10px; width:190px; line-height:29px;}
#sideLeft dt#maker a:hover{ background-position:0 -389px;}

/* -----------------------------------------------------------
	#事例
----------------------------------------------------------- */


/* -----------------------------------------------------------
	#mcAccess
----------------------------------------------------------- */

/*左カラム*/
#sideLeft ul#mcAccess { margin-bottom:0.5em;}
#sideLeft ul#mcAccess li { padding:0;}
#sideLeft ul#mcAccess li a{ display:block; background-image:url(../img/common/side-menu-list-bg.gif); padding-left:30px; background-position:left center; _vertical-align:bottom; zoom:1; height:35px; line-height:35px; background-position:0 0; border-bottom: none; }
#sideLeft ul#mcAccess li a:hover,
#sideLeft ul#mcAccess li a.onPage{ background-position:0 -35px;}

.coulum2Container{ width:690px; margin:0 0 0 50px; clear: both; overflow: hidden; }
.coulum2Container div{ width:315px; float:left; margin-right:30px; _overflow: hidden; }
#main .coulum2Container div h3{ border: none []; border: none; margin: 0 15px 0 0; }
#main .coulum2Container div p{ margin:0 0 20px 0; }

#main .coulum2Container div h3 a{ display: block; background-position:0 0; text-indent:-6666px; width:315px; height:194px; }
#main .coulum2Container div h3#whatsMca a{ background-image:url(../img/product/kouiki/btn-mcaccess.jpg);  }
#main .coulum2Container div h3#areaMca a{ background-image:url(../img/product/kouiki/btn-mcaccess-02.jpg); }
#main .coulum2Container div h3#priceMca a{ background-image:url(../img/product/kouiki/btn-mcaccess-03.jpg); }
#main .coulum2Container div h3#productMca a{ background-image:url(../img/product/kouiki/btn-mcaccess-04.jpg); }
#main .coulum2Container div h3#faqMca a{ background-image:url(../img/product/kouiki/btn-mcaccess-05.jpg); }
#main .coulum2Container div h3#caseMca a{ background-image:url(../img/product/kouiki/btn-mcaccess-06.jpg); }

#main .coulum2Container div h3#whatsMca a:hover,
#main .coulum2Container div h3#areaMca a:hover,
#main .coulum2Container div h3#priceMca a:hover,
#main .coulum2Container div h3#productMca a:hover,
#main .coulum2Container div h3#faqMca a:hover,
#main .coulum2Container div h3#caseMca a:hover{ background-position:0 -194px; }

#main table th,
#main table td { border:1px solid #fff;}
#main table th { background-color:#c0d5fa; text-align:center;}

/*FAQ*/
#tabBox1,#tabBox2{ width:675px; margin:0 auto 25px; border:6px solid #e5e5e5; padding: 5px; }
#tabBox1 ul,#tabBox2 ul{ float:left; width:300px; margin: 0; padding: 0; border:0; }
#tabBox1 ul li,#tabBox2 ul li{ background-position:10px 18px; line-height: 45px; padding:0; }
#tabBox1 ul li a,#tabBox2 ul li a{ display:block; text-decoration:none; padding:0 20px 0 25px; }
#tabBox1 ul li a:hover,#tabBox2 ul li a:hover{background-color: #ededed; font-weight:bold; color:#2b71b8; background-image:url(../img/common/list4.gif);}

#tabBox1 div.tabContents,#tabBox2 div.tabContents{ float:left; width:345px; padding: 10px 15px; background-color: #ededed; color:#000000; min-height:430px; height:auto!important; height:430px; border-bottom:1px solid #ccc; display: table-cell; vertical-align: middle; }
#tabBox1 div.tabContents p,#tabBox2 div.tabContents p{ margin:0 0 1em;}

#tabBox1 div.tabContents ul,#tabBox2 div.tabContents ul{ float:none; width:auto; margin:0 0 1em;}
#tabBox1 div.tabContents ul li,#tabBox2 div.tabContents ul li{ height:auto; line-height:1.6; background-image:none; border-bottom:1px dotted #999; padding:5px 0;}