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

   CSS INFORMATION

   -------------------------------------------------------------------------
Description :compornent.css
Table of Content :
=NAV
=MODULE DL
 =dtが画像横に回りこまないタイプ
 =dtが画像横に回りこむタイプ
=CLEARFIX
- - - - - - - - - - - - - - - - - - - - - - - - -
Way to seacrh using TOC
1.Ctrl+F
2.seacrh key "=" and "heading number of TOC list"

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

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

   =NAV
    notice: aのwidthとheightは個別CSSで指定
            ※line-height指定も忘れずに（heightと同じ値で指定）

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

ul.nav,
dl.nav {
  list-style: none;
  display: inline-block;
  margin: 0;
  padding: 0;
}

ul.nav li,
dl.nav dt,
dl.nav dd {
  float: left;
  margin: 0;
  padding: 0;
}

ul.nav li a,
dl.nav dt a,
dl.nav dd a {
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

* html ul.nav li a,
* html dl.nav dt a,
* html dl.nav dd a {
  display: inline-block;
  overflow: hidden;
}


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

   =MODULE DL
 
    notice: 1 各要素のwidthを必ず個別CSSで指定
            2 dlにwidthを指定してもcontentが収まらない場合は、
              包含ブロックにwidthを指定する
            3 .styleは必要に応じて増やす

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

/* =dtが画像横に回りこまないタイプ
   --------------------------------------------------------------- */
.mdl-dl1 dd img {
  float: left;
}

.mdl-dl1 dd.styl1 {
  float: right;
  text-align: left;
}

.mdl-dl1 dd.styl2 {
  clear:both;
  float: right;
  text-align: left;
}


/* =dtが画像横に回りこむタイプ
   --------------------------------------------------------------- */
.mdl-dl2 {
  clear: both;
}

.mdl-dl2 dt {
  float: right;
}

.mdl-dl2 dd img {
  float: left;
}

.mdl-dl2 dd.styl1 {
  float: right;
  text-align: left;
}

.mdl-dl2 dd.styl2 {
  float: right;
  text-align: left;
}

.mdl-dl2 dd.styl3 {
  clear: both;
  text-align: left;
}


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

   =CLEARFIX

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

.clearfix:after {
  content: ".";
  visibility: hidden;
  clear: both;
  display: block;
  height: 0;
}

.clearfix {
 zoom: 1;
 margin-bottom: 0;
}

p.contents-foot-text {
  color: #666666;
  font-size: 12px;
  background: transparent;
  line-height: 110%;
}

div#breadcrumbs {
  padding: 0 0 8px 0;
}

div#breadcrumbs ul {
  margin: 0;
  padding: 0;
}

div#breadcrumbs ul li {
  margin: 0;
  padding: 0;
  float: left;
}

div#breadcrumbs ul li a:link,
div#breadcrumbs ul li a:visited {
  color: #00077d;
}

div#breadcrumbs ul li a:hover {
  color: #00077d;
  text-decoration: underline;
}

p.r-top {
  font-soze: 12px;
  text-align: right;
  margin: 0;
}

div#pop_up {
  text-align: left;
}
.ondes {color: #999999;}