@charset "shift_jis";

/*------------------------------------------------------------------------------
 (C) Copyright 2005-2006 Hitachi,Ltd.

 共通CSS

 変更履歴
 [Ver] [変更日]    [変更者] [変更内容]
 1.0   2007-01-01  松本     新規作成
 1.1   2007-07-25  松本     2007年上期案件により追加
 1.2   2008-01-31  松本     2007年下期案件により追加
 1.3   2008-07-01  松本     2008年上期案件により追加
 1.4   2012-02-14  藤本     2012年上期案件により追加
 1.5   2014-01-15  羅       税込合計金額を赤くて1.5倍大きくする
 1.6   2014-03-10  李       マルチブラウザ対応
 1.7   2014-07-15  羅       ＷＢＳ要素・指図改廃画面用追加
 1.8   2015-02-23  羅       requiredRed クラス追加
 1.9   2018-01-18  劉濮     全サイト検索中画面のスタイルクラス追加
 1.10  2018-04-11  李静新   メニュー画面の検索エリアのスタイルクラス追加
 1.11  2020-11-19  深村     共通ヘッダのお問い合わせリンクのスタイル追加
 1.12  2021-06-25  竹内     モバイル用ヘッダスタイル追加
 ---------------------------------------------------------------------------- */

* {
  box-sizing : border-box;
  -moz-box-sizing : border-box;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
}

a:link {
	  font-family: "ＭＳ Ｐゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ヒラギノ角ゴ Pro W3";
}

.font_size16 {
  box-sizing : border-box;
  -moz-box-sizing : border-box;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 16px;
  font-weight: bold;
}

body {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 3%;
  margin-right: 3%;
  padding: 0;
  background-color: #FFFFFF;
}

.pageHeader {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  background-color: #22AA00;
  color: #FFFFFF;
  height: 35px;
  width: 100%;
  padding: 0;
}

.pageHeaderMobile {
  box-sizing : border-box;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  background-color: #22AA00;
  color: #FFFFFF;
  height: 110px;
  width: 100%;
  padding: 0;
}

.pageHeaderTable {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  background-color: #22AA00;
  color: #FFFFFF;
  height: 35px;
  width: 100%;
  padding: 0;
}

.pageTitle {
  color: #FFFFFF;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 16px;
  font-weight: bold;
  padding-left: 10px;
}

.service {
  color: #FFFFFF;
  font-size: 12px;
  text-align: right;
}

.pageFooter {
  clear: both;
  text-align: center;
  color: #000000;
  width: 100%;
  padding: 0;
}

.module {
  background-color: #22AA00;
  color: #FFFFFF;
  width: 100%;
  padding: 0px;
  margin: 0;
  border-color: #22AA00;
  border-style: solid;
  border-width: 2px;
}

.module_green {
  background-color: #6799FF;
  color: #FFFFFF;
  width: 100%;
  padding: 0px;
  margin: 0;
  border-color: #6799FF;
  border-style: solid;
  border-width: 2px;
}

.halfLeftModule {
  background-color: #22AA00;
  color: #FFFFFF;
  float: left;
  width: 48%;
  padding: 0px;
}

.halfRightModule {
  margin-left: 4%;
  background-color: #22AA00;
  color: #FFFFFF;
  float:left;
  width: 48%;
}

.moduleHeader {
  background-color: #22AA00;
  color: #FFFFFF;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 5px 3px 5px 3px;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 14px;
  font-weight: bold;
  border-color: #22AA00;
  border-style: solid;
  border-width: 1px;
}

.moduleHeader_green {
  background-color: #6799FF;
  color: #FFFFFF;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 5px 3px 5px 3px;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 14px;
  font-weight: bold;
  border-color: #6799FF;
  border-style: solid;
  border-width: 1px;
}

.moduleBody {
  clear: both;
  background-color: #FFFFFF;
  color: #000000;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 1px 2px 1px 2px;
  border-color: #22AA00;
  border-style: solid;
  border-width: 1px;
}

.errorModule {
  background-color: CRIMSON;
  color: #FFFFFF;
  width: 100%;
  padding: 0px;
  margin: 0;
  border-color: CRIMSON;
  border-style: solid;
  border-width: 2px;
}

.errorHeader {
  background-color: CRIMSON;
  color: #FFFFFF;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 5px 3px 5px 3px;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 14px;
  font-weight: bold;
  border-color: CRIMSON;
  border-style: solid;
  border-width: 1px;
}

.errorBody {
  clear: both;
  background-color: #FFFFFF;
  color: #FF0000;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 1px 2px 1px 2px;
  border-color: CRIMSON;
  border-style: solid;
  border-width: 1px;
}

.infomationModule {
  background-color: #22AA00;
  color: #FFFFFF;
  width: 100%;
  padding: 0px;
  margin: 0;
  border-color: #22AA00;
  border-style: solid;
  border-width: 2px;
}

.infomationHeader {
  background-color: #22AA00;
  color: #FFFFFF;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 5px 3px 5px 3px;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 14px;
  font-weight: bold;
  border-color: #22AA00;
  border-style: solid;
  border-width: 1px;
}

.infomationBody {
  clear: both;
  background-color: #FFFFFF;
  color: #FF0000;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 1px 2px 1px 2px;
  border-color: #22AA00;
  border-style: solid;
  border-width: 1px;
}

.section {
  clear: both;
  background-color: #FFFFFF;
  color: #000000;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 1px 2px 1px 2px;
  border-color: #22AA00;
  border-style: solid;
  border-width: 2px;
}

.moduleBodyContents {
  clear: both;
  width: 100%;
  margin: 0px 0px 0px 0px;
  padding: 5px 3px 5px 3px;
}

.halfLeftModuleBodyContents {
  float: left;
  width: 50%;
  margin: 0px 0px 0px 0px;
  padding: 1px 5px 1px 5px;
}

.halfRightModuleBodyContents {
  margin: 0px 0px 0px 0px;
  float:left;
  width: 50%;
  padding: 1px 5px 1px 5px;
}

.tabModule {
  margin: 0 0 0 0;
}

.tabModule .tab {
  height: 32px;
  background-color: #CCCCCC;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}

.tabModule .tabSpace {
  height: 32px;
  white-space: nowrap;
  margin:0;
}

.tabModule .target {
  background:#22AA00;
  color:#FFFFFF;
}

.tabModule table {
  border-collapse: collapse; /* for IE */
  border-spacing: 0; /* for N6 */
}

.tabModule table tr td {
  margin:0;padding:0;border-width:0;
}

.tabModule .tab a {
  display: block;
  color:#666;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
}

.fieldHeader {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  padding-left: 5px;
  height: 20px;
}

.fieldHeader1 {
  background-color: #FFCC00;
  padding: 0px;
}

.fieldHeader_Gray {
  background-color: #CCCCCC;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  padding-left: 5px;
  height: 20px;
}

.fieldHeaderLarge_Selected {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-weight: bold;
  padding-left: 5px;
  font-size: 14px;
  height: 25px;
}

.fieldHeaderLarge_Unselected {
  background-color: #CCCCCC;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-weight: bold;
  padding-left: 5px;
  font-size: 14px;
  height: 25px;
}


.sectionHeader {
  background-color: #22AA00;
  color: #FFFFFF;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  padding-left: 5px;
  height: 20px;
}

.sectionHeader2 {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  padding-left: 5px;
  height: 20px;
  border-style: solid;
  border-width: 1px;
  border-color: #22AA00;
}

.fieldHeaderRow {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  height: 20px;
}

.fieldBody {
  background-color: #EEEEEE;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding-left: 5px;
  height: 20px;
  word-break: break-all;
}

/* --------------------- (Start)2012年上記案件により追加 --------------------- */
/* -----------------------------------------------------------------------------
  請求先確認画面で使用する
 ---------------------------------------------------------------------------- */
.fieldBodyRowAnswer {
  background-color: #FFFF99;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding-left: 5px;
  height: 20px;
  word-break: break-all;
}

/* --------------------- (E n d)2012年下期案件により追加 --------------------- */

.sectionBody {
  background-color: #FFFFFF;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding-left: 5px;
  height: 20px;
  word-break: break-all;
  border-style: solid;
  border-width: 1px;
  border-color: #22AA00;
}

.fieldBodyRow {
  background-color: #EEEEEE;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  height: 20px;
}

.fieldBodyRowCheckbox {
  background-color: #EEEEEE;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding-left: 3px;
  height: 20px;
}

/* ここから↓ JSFコンポーネント内部で使用する可能性があるので残す */
.guide {
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
}

.required {
  color: #0000FF;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 10px;
  font-weight: normal;
}

.requiredRed {
  color: #FF0000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 10px;
  font-weight: normal;
}

.text {
  text-align: left;
  font-size: 12px;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

.number {
  text-align: right;
  font-size: 12px;
}

.number_highlight {
  color: #FF0000;
  text-align: right;
  font-size: 14px;
  font-weight: bold;
}

.date {
  text-align: left;
  font-size: 12px;
}

.error {
  background-color: #FF8888;
  font-size: 12px;
}

.text-error {
  background-color: #FF8888;
  text-align: left;
  font-size: 12px;
}

.number-error {
  background-color: #FF8888;
  text-align: right;
  font-size: 12px;
}

.date-error {
  background-color: #FF8888;
  text-align: left;
  font-size: 12px;
}
/* ここまで↑ JSFコンポーネント内部で使用する可能性があるので残す */

/* -----------------------------------------------------------------------------
  commandLinkのlinkを黒にする場合に、styleClass属性に適用する。
 ---------------------------------------------------------------------------- */
.link {
  color: #000000;
}

.size10 {
  font-size: 10px;
}

.size14 {
  font-size: 14px;
}

.height18 {
  height: 18px;
}

.height20 {
  height: 20px;
}

/* -----------------------------------------------------------------------------
  テーブル用
  t:dataTableのstyleClass属性に適用する。
 ---------------------------------------------------------------------------- */
.standardTable {
  padding: 0;
  border-style: solid;
  border-width: 0px;
  height: 20px;
  width: 100%;
}

/* -----------------------------------------------------------------------------
  テーブル用
  t:dataTableのrowClasses属性に適用する。zebraパターン1。
 ---------------------------------------------------------------------------- */
.standardTable_Row1 {
  background-color: #EEEEEE;
}

/* -----------------------------------------------------------------------------
  テーブル用
  t:dataTableのrowClasses属性に適用する。zebraパターン2。
 ---------------------------------------------------------------------------- */
.standardTable_Row2 {
  background-color: #DDDDDD;
}

/* -----------------------------------------------------------------------------
  テーブル用
  ヘッダー(facet=header)に適用する。
 ---------------------------------------------------------------------------- */
.standardTable_Header {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  height: 20px;
  vertical-align:middle;
}

.standardTable_greenHeader {
  clear: #000000;
  background-color: #B2CCFF;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  height: 20px;
  vertical-align:middle;
}


/* -----------------------------------------------------------------------------
  テーブル用
  sortHeaderタグのstyleClass属性に適用する。
 ---------------------------------------------------------------------------- */
.standardTable_SortHeader {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  vertical-align:middle;
}

/* -----------------------------------------------------------------------------
  テーブル用
  t:dataScrollerのpaginatorTableClass属性に適用する。
 ---------------------------------------------------------------------------- */
.paginator {
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  font-style: normal;
  height: 15px;
}

/* -----------------------------------------------------------------------------
  テーブル用
  t:dataScrollerのpaginatorActiveColumnClass属性に適用する。
 ---------------------------------------------------------------------------- */
.paginatorActive {
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  font-style: normal;
  height: 15px;
}


/* -----------------------------------------------------------------------------
  縦型テーブル用
 ---------------------------------------------------------------------------- */
.verticalTable_Row1 {
  background-color: #EEEEEE;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding-left: 3px;
  padding-top: 3px;
  padding-bottom: 5px;
  height: 20px;
  word-break: break-all;
}

.verticalTable_Row2 {
  background-color: #DDDDDD;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding-left: 5px;
  padding-top: 3px;
  padding-bottom: 3px;
  height: 20px;
  word-break: break-all;
}


/* -----------------------------------------------------------------------------
  リストテーブル用
 ---------------------------------------------------------------------------- */
.listTable_Row {
  line-height: 20px;
  height: 20px;
  background-color: #EEEEEE;
}

.listTable_Header {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  padding-left: 5px;
  height: 20px;
  line-height: 20px;
}


/* --------------------- (Start)2007年上期案件により追加 --------------------- */

/* -----------------------------------------------------------------------------
  注文受付完了画面などで使用する、青字・黒字メッセージ
 ---------------------------------------------------------------------------- */
/* 黒字のメッセージ */
.messageHeader {
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12pt;
  font-weight: bold;
}

/* 青字のメッセージ */
.messageHeaderNotice {
  color: #0000FF;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12pt;
  font-weight: bold;
}


/* -----------------------------------------------------------------------------
  入力支援子画面で使用する
 ---------------------------------------------------------------------------- */
.popupSearchBody {
  margin-top: 0px;
  font-weight: normal;
  font-size: 12px;
  margin-left: 0px;
  color: #404040;
  line-height: normal;
  margin-right: 0px;
  font-style: normal;
}

/* -----------------------------------------------------------------------------
  承認・検収者設定画面で行エラーとなった場合に使用する
 ---------------------------------------------------------------------------- */
/* エラー */
.field_error {
  background-color: #FFCCCC;
  height: 40px;
}

/* OK */
.field_ok {
  background-color: #EEEEEE;
  height: 40px;
}

/* -----------------------------------------------------------------------------
  訂正依頼詳細画面と訂正依頼作成画面で使用する
 ---------------------------------------------------------------------------- */
.changeFieldBody {
  background-color: #CCCCCC;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding-left: 5px;
  height: 20px;
  word-break: break-all;
}

/* -----------------------------------------------------------------------------
  moduleHeaderの中でpanelGridを使用した場合にCSSが無効になってしまう場合に使用する
 ---------------------------------------------------------------------------- */
.moduleHeaderTitle {
  color: #FFFFFF;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 14px;
  font-weight: bold;
}
/* --------------------- (E n d)2007年上期案件により追加 --------------------- */


/* --------------------- (Start)2007年下期案件により追加 --------------------- */

/* 赤字のメッセージ */
.messageHeaderRed {
  color: #FF0000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12pt;
  font-weight: bold;
}

/* -----------------------------------------------------------------------------
  検収情報画面で選択した納入情報行に使用する
 ---------------------------------------------------------------------------- */
/* 選択した納入情報 */
.field_select {
  background-color: #FFCCCC;
  height: 12px;
}

/* 選択しない納入情報 */
.field_nonSelect {
  background-color: #EEEEEE;
  height: 12px;
}
/* --------------------- (E n d)2007年下期案件により追加 --------------------- */


/* --------------------- (Start)2008年上期案件により追加 --------------------- */

/* -----------------------------------------------------------------------------
  仕入先.出荷情報のヘッダー部分で使用する
 ---------------------------------------------------------------------------- */
.fieldHeader_Shipment {
  background-color: #FFCC00;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: bold;
  padding-left: 5px;
  height: 24px;
}

.loginTitle {
  color: #FFFFFF;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  padding: 10px;
}

/* --------------------- (E n d)2008年上期案件により追加 --------------------- */

/* --------------------- (Start) Ver1.5 税込合計金額を赤くて1.5倍大きくする --------------------- */

/* -----------------------------------------------------------------------------
  合計(税込）の文字色は赤色で、文字の大きさは合計(税抜)よりも1.5倍程度大きくする。
 ---------------------------------------------------------------------------- */
.moduleHeaderTitleZeikomiAmount {
  color: #FF0000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 21px;
  font-weight: bold;
}
/* --------------------- (E n d) Ver1.5 税込合計金額を赤くて1.5倍大きくする --------------------- */

/* --------------------- (Start) Ver1.7 ＷＢＳ要素・指図改廃確認画面の<app:inputText>タグ --------------------- */
.inputText_readOnly{
  background-color: transparent;
  border: 0px;
  text-align: center;
  width: 100%;
}
/* --------------------- (E n d) Ver1.7 ＷＢＳ要素・指図改廃確認画面の<app:inputText>タグ --------------------- */

/* -----------------------------------------------------------------------------
  全サイト検索中画面で使用する、黒字メッセージ
 ---------------------------------------------------------------------------- */
/* 黒字のメッセージ */
.messageBody {
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12pt;
  font-weight: bold;
}
/* -----------------------------------------------------------------------------
  メニュー画面の検索エリアで使用する
 ---------------------------------------------------------------------------- */
.label {
  font-weight: bold;
  white-space: nowrap;
}

.inquiries {
  background-color: #FFFFFF;
  color: #000000;
  font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 12px;
  font-weight: normal;
  padding: 5px;
  word-break: break-all;
}

/* -----------------------------------------------------------------------------
  DIC用費用負担元パネルで使用する
 ---------------------------------------------------------------------------- */
.accountBackGroundGray {
  background-color : Gainsboro;
  color: Gray;
  border: 1px solid silver;
}