@charset "UTF-8";
/*
 * black dress
 */
/* リンク */
.-dress_black a {
  color: #ddd;
}

/* メニュー */
.-dress_black .c-menu li {
  border-color: #fff;
}

.-dress_black .c-menu li:first-child {
  border-color: #fff;
}

.-dress_black .c-menu li a {
  color: #d3d3d3;
  border-color: #fff;
}

/*
メニューA〜Eの場合は下記のように、.c-menuの後ろに各class名をつけてください。
.-dress_black .c-menu.-menu_a li { メニューAに当てるスタイル }
.-dress_black .c-menu.-menu_b li { メニューBに当てるスタイル }
.-dress_black .c-menu.-menu_c li { メニューCに当てるスタイル }
.-dress_black .c-menu.-menu_d li { メニューDに当てるスタイル }
.-dress_black .c-menu.-menu_e li { メニューEに当てるスタイル }
*/
/* ブロック全体 */
div.-dress_black {
  /*background: #333;*/
  color: #ddd;
}

/*
特定カラムの指定はまだHTMLが未実装なのですが、
下記のような指定でできるようになる予定です。（次回バージョンで搭載予定）
.-dress_black .b-plain .column.-column1 { １つ目のカラムに当てるスタイル }
*/
/* プレーン */
/* 左右違い */
/* 目次 */
/* アルバム */
/* タブ */
.-dress_black .b-tab_navigation {
  font-size: 0;
}

.-dress_black .b-tab_navigation li {
  margin-right: 1px;
}

.-dress_black .b-tab_navigation li a {
  background-color: #ddd;
  font-size: 1rem;
  color: #ddd;
}

.-dress_black .b-tab_navigation li.-active a, .-dress_black .b-tab_navigation li a:hover {
  background-color: #555;
  color: #fff;
}

/* アコーディオン */
.-dress_black .b-accordion .column {
  background: #555;
}

.-dress_black .b-accordion_navigation a {
  color: #333;
  background: #ddd;
  color: #333;
}

.-dress_black .b-accordion_navigation.-active a, .-dress_black .b-accordion_navigation a:hover {
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  filter: alpha(opacity=100);
}

/* 本文 */
.-dress_black .c-body {
  color: #d3d3d3;
}

/* ページタイトル */
.-dress_black .c-page_title {
  color: #fff;
}

/* タイトル */
.-dress_black .c-title {
  color: #f1f1f1;
}

/* 大見出し */
.-dress_black .c-large_headline {
  color: #eee;
}

/* 小見出し */
.-dress_black .c-small_headline {
  color: #ddd;
}

/* リード文 */
/* 引用文 */
/* 囲み */
.-dress_black .c-enclosure {
  border-color: #fff;
}

/* ノート */
/* クレジット */
/* メニュー */
/* インデント式 */
/* テーブル式 */
.-dress_black .c-list_table th {
  background: #777;
  color: #ddd;
  border-top: 1px solid #999;
}

.-dress_black .c-list_table td {
  border-top: 1px solid #999;
  color: #ddd;
}

.-dress_black .c-list_table tr:first-child th,
.-dress_black .c-list_table tr:first-child td {
  border-top: 0 none;
}

/* ニュース式 */
.-dress_black .c-list_news {
  border-top: 1px solid #999;
}

/* 水平線 */
.-dress_black .c-hr {
  border-color: #fff;
}

/*
  モーションメニュー
*/
/* モーションメニュー：バルーン */
/* リンクの色 */
.-dress_black .m-motion.-f li a {
  color: #fff;
}

/* バルーンの矢印：下方向向き */
.-dress_black .m-motion.-f > li:hover > a + ul > li:first-child:after,
.-dress_black .m-motion.-f > li:hover > .c-unlink + ul > li:first-child:after {
  border-top-color: #eee;
}

/* バルーンの矢印：上方向向き */
.-dress_black .m-motion.-f > li > ul li:first-child:before {
  border-bottom-color: #eee;
}

/* バルーンの指定 */
.-dress_black .m-motion.-f > li > ul > li a,
.-dress_black .m-motion.-f > li > ul > li .c-unlink {
  background-color: #ddd;
  color: #333;
  border-bottom: 1px solid #333;
}

/* マウスオーバーした時のバルーンの指定 */
.-dress_black .m-motion.-f > li > ul > li a:hover {
  background-color: #bbb;
  color: #111;
  border-bottom: 1px solid #111;
}

/* モーションメニュー：ラバランプ */
.-dress_black .m-motion.-g {
  background-color: #111;
}

/* 動いてる奴 */
.-dress_black .m-motion.-g .lavalamp-object {
  background-color: #999;
}

/* リスト */
.-dress_black .m-motion.-g li {
  margin-left: 50px;
}

/* モーションメニュー：ラインチェイサー */
/* リンクの色 */
.-dress_black .m-motion.-j a {
  color: #fff;
}

/* ラインの色 */
.-dress_black .m-motion.-j .lavalamp-object {
  border-top: 1px dotted #777;
}

/* サイド */
/* リンクの色 */
.-dress_black .m-motion.-h li a {
  background-color: #555;
}

/* リンク、マウスオーバー */
.-dress_black .m-motion.-h li a:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
  filter: alpha(opacity=100);
  background-color: #777;
  color: #fff;
  width: 170px;
  padding-left: 40px;
}

/* シズル */
/* リンク */
.-dress_black .m-motion.-i li a {
  border: 1px solid #000;
  border-bottom-width: 3px;
  color: #fff;
  background-color: #222;
  /* transition を変更することで動きも変更できます。（シズルとサイドだけ有効） */
  -webkit-transition: all 0.4s ease-in;
  transition: all 0.4s ease-in;
}

.-dress_black .m-motion.-i li a:hover {
  border-color: #888;
}
