@charset "utf-8";

/* ---------------------------------------------------------------------------
 [ class.css ]

 クラス設定

 特定の役割を持った要素へのスタイル定義を行います。
 ただし、接頭辞として（.x-）の仕様は禁止します。

 ex.) 禁止例

 li.x-example {

 }

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


/* ------------------------------
 トピックパス 設定
------------------------------ */
ul.topic_path {
  margin: 0 0 10px 0;
  font-size: 12px;
}

ul.topic_path li {
  display: inline;
  margin: 0 5px 0 0;
}


/* ------------------------------
 キービジュアル 設定
------------------------------ */
.keyvisual {
  margin: 0 0 20px 0;
}


/* ------------------------------
 タイトル 設定
------------------------------ */
.ttlsection {
  margin: 0 0 30px 0;
}

.ttlsub {
  margin: 0 0 10px 0;
}

.ttlarticle {
  margin: 0 0 5px 0;
  font-weight: bold;
  font-size: 14px;
}


/* ------------------------------
 性能・特長 設定
------------------------------ */
#area_merit {
  width: 860px;
  margin: 0 auto 20px;
  padding: 0 0 30px 0;
  background: url(../../images/site/home/back_merit_image.jpg) bottom;
}

.merit {
  display: block;
  float: left;
  width: 172px;
  height: 175px;
  margin: 0 auto;
  text-align: center;
}

.merit a {
  display: block;
  float: left;
  width: 172px;
  height: 175px;
  margin: 0 auto;
  text-align: center;
  cursor: pointer;
  background: url(../../images/site/home/back_merit.jpg);
}

.merit a:hover {
  text-decoration: none;
  background: url(../../images/site/home/back_merit.jpg) no-repeat 0 -175px;
}

.merit a img {
  margin: 10px auto 10px;
}

.merit a .term {
  display: block;
  margin: 0 auto 5px;
  color: #003366;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
}

.merit a:hover .term {
  margin-bottom: 5px;
  color: #FF6600;
  font-weight: bold;
  font-size: 14px;
  text-decoration: underline;
}

.merit a .discription {
  display: block;
  width: 158px;
  line-height: 150%;
  margin: 0 auto;
  color: #333;
  font-size: 12px;
  text-align: left;
}

.merit a:hover .discription {
  color: #333;
}


/* ------------------------------
 ボタンエリア(体験デモ/資料請求)
 設定
------------------------------ */
.area_button {
  width: 740px;
  height: 114px;
  margin: 0 60px 20px;
  padding-top: 14px;
  background: url(../../images/site/area_bt_bk.jpg) repeat-x;
}

.area_button ul {
  display: block;
  width: 690px;
  height: 88px;
  margin: 0 25px;
}

/* ボタン・体験デモ */
.area_button ul li.area_bt_demo {
  display: block;
  float: left;
  width: 334px;
  height: 88px;
  background: url(../../images/site/area_bt_demo_on.jpg) no-repeat;
}

.area_button ul li.area_bt_demo a {
  display: block;
  width: 334px;
  height: 88px;
}

/*
.area_button ul li.area_bt_demo a:hover {
  width: 334px;
  height: 88px;
  background: url(../../images/site/area_bt_demo_on.jpg) no-repeat;
}

#area_button ul li.area_bt_demo a:hover img {
  visibility: hidden;
}
*/

/* ボタン・資料請求 */
.area_button ul li.area_bt_request {
  display: block;
  /*float: right;*/
  width: 334px;
  height: 88px;
  background: url(../../images/site/area_bt_request_on.jpg) no-repeat;
}

.area_button ul li.area_bt_request a {
  display: block;
  width: 334px;
  height: 88px;
}

/*
.area_button ul li.area_bt_request a:hover {
  display: block;
  width: 334px;
  height: 88px;
  background: url(../../images/site/area_bt_request_on.jpg) no-repeat;
}

.area_button ul li.area_bt_request a:hover img {
  visibility: hidden;
}
*/


/* ------------------------------
 お問い合わせ エリア 設定
------------------------------ */
.area_inq {
  width: 860px;
  height: 66px;
  margin: 30px 0 20px 0;
  background: url(../../images/site/area_inq.jpg) no-repeat;
}

.area_inq ul {
  display: block;
  float: right;
  width: 380px;
  margin: 14px 10px 0 0;
}

.area_inq ul li {
  display: block;
  float: left;
  width: 170px;
  height: 36px;
  font-size: 10px;
}

.area_inq ul li.bt {
  background: url(../../images/site/area_inq_bt_on.jpg) no-repeat;
}

.area_inq ul li a {

  display: block;
  width: 170px;
  height: 36px;
}

.area_inq ul li a:hover {
  background: url(../../images/site/area_inq_bt_on.jpg) no-repeat;
}

.area_inq ul li a:hover img {
  visibility: hidden;
}

/* お問合せ内テキスト */
.area_inq ul li.text {
  width: 195px;
  padding: 4px 0 0 10px;
  text-indent: 0px;
  text-align: left;
}


/* ------------------------------
 ポジション 設定
------------------------------ */
.relative {
  position: relative;
}

.ab_bottom {
  position: absolute;
  bottom: 0;
}


/* ------------------------------
 vertical-align 設定
------------------------------ */
.v_top {
  vertical-align: top;
}

.v_middle {
  vertical-align: middle;
}


/* ------------------------------
 ul/li 設定
------------------------------ */
ul.err {
  margin: 0 0 40px 0;
  padding: 10px 10px 0 10px;
  border: 1px solid #F5E0E0;
  background: #FFF5F5;
}

ul.err li {
  margin: 0 0 10px 0;
  color: #CC0000;
  font-size: 12px;
  text-align: center;
}


/* ------------------------------
 ディスプレイ 設定
------------------------------ */
.unvisible {
  display: none;
}


/* ------------------------------
 フロート 設定
------------------------------ */
.float_l {
  float: left;
}


/* ------------------------------
 マージン 設定
------------------------------ */
.mb5 {
  margin: 0 0 5px 0;
}

.mb20 {
  margin: 0 0 20px 0;
}


/* ------------------------------
 フォーム 設定
------------------------------ */
input.adjust01 {
  position: relative;
  top: 1px;
}


/* ------------------------------
 フォント 設定
------------------------------ */
.att {
  margin: 0 0 5px 0;
  color: #CC0000;
  font-size: 12px;
}

.ftype01 {
  font-size: 14px;
}

.color_r {
  color: #CC0000;
}


/* ------------------------------
 テーブル 設定
------------------------------ */
.base_width {
  width: 860px;
}

.type_col_row01 {
  border-top: 1px solid #CCC;
  border-left: 1px solid #CCC;
}

.type_col_row01 th,
.type_col_row01 td {
  padding: 5px;
  border-right: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
  font-size: 12px;
}

.type_col_row01 th {
  background: #E3E3E3;
}


/* ------------------------------
 クリア 設定
------------------------------ */
.clear {
  clear: both;
}


/* ------------------------------
 text-align 設定
------------------------------ */
.rmove {
  text-align: right;
}

.cmove {
  text-align: center;
}


/* ------------------------------
 クリアフィックス 設定
------------------------------ */
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

.clearfix {
  overflow: hidden;
  zoom: 1;
}


/* ------------------------------
 IE6 ハック 設定
------------------------------ */


/* ------------------------------
 IE7 ハック 設定
------------------------------ */


/* ------------------------------
 IE8 ハック 設定
------------------------------ */
html>/**/body .test {
  width: 285px\9;
}


/* EoS */