/************************************************************/
/* 口振GW　利用者画面スタイルシート                         */
/* 収納機関コード：21452                                    */
/* 反映日：20240401                                         */
/************************************************************/

/**********************************************/
/* ページ枠組み                               */
/**********************************************/
/* body設定 */
body {
 margin: 5px 0px 0px 0px;
 padding: 0px;
 background-color: #ffffff; /* ページ背景の色 */
 font-family: 'ＭＳ ゴシック',sans-serif;
 font-weight: normal;
 color: #000000; /* ページ全体フォント色 */
}

/* body中央寄せ設定 */
#position {
 text-align: center;
}

/* サイト幅設定 */
#frame {
 width: 824px; /* ページの幅 */
 margin: 0px auto 0px auto;
 padding: 0px;
 border: 1px solid #dcdcdc; /* ボーダーの色 */
 background-color: #ffffff; /* ボーダーの中の色 */
 text-align: left;
}


/**********************************************/
/* バナー　ロゴ                               */
/**********************************************/
/* バナー左寄せ設定 */
#banner {
 background: #ffffff; /* バナー背景の色 */
 margin-top: 12px; /* バナー画像によって上の白余白調整 */
 margin-right: 12px;
 margin-bottom: 2px;
 margin-left: 12px; /* バナー画像によって左の白余白調整 */
 padding: 0;
 background-repeat: no-repeat;
 background-position: left;
 border: 1px solid #ffffff; /* バナー部分に枠をつける場合の色 */
 text-align: left;
 height: 100px; /* ロゴ画像の高さ */
}

/**********************************************/
/* バナー　会社名　　　                       */
/**********************************************/
/* 会社名左寄せ設定 */
#corpname {
 display: none; 
 margin: 0;
 color: #000000; /* 会社名フォント色 */
 font-size: 18px;
 font-weight: bold;
 line-height: 1;
 padding-top: 20px; /* （画像の高さ-フォントサイズ）÷2 */
 padding-left: 12px; /* 画像の幅＋α */
}

/**********************************************/
/* ページコンテンツ枠組み                      */
/**********************************************/
#container {
 margin: 20px 12px 20px 12px; /* 上と左右マージン */
 padding: 0;
}


/**********************************************/
/* ネット口座振替受付サービス      　　　　   */
/**********************************************/
#service {
 padding: 0px;
 margin: 0px;
 background-image: url("../images/line.gif");
 background-repeat: repeat-x;
 height: 36px;
 text-align: left;
}

/* 左にネット口座振替受付サービス使用 */
#servicename {
 padding-top: 2px;
 margin: 0px;
 background-image: url("../images/servicename.gif");
 background-repeat: no-repeat;
 background-position: left;
 height: 36px;
}


/**********************************************/
/* パンくずナビ            　　　　           */
/**********************************************/ 
/* 利用規約同意 */
#navigation_001
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../images/root_001.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* お客様情報入力 */
#navigation_002
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_002.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* お客様情報確認 */
#navigation_003
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_003.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* 金融機関選択 */
#navigation_004
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_004.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* 口座情報入力 */
#navigation_005
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_005.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* 口座情報確認 */
#navigation_006
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_006.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* 金融機関選択（Bパターン） */
#navigation_004b
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_004b.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* 口座情報入力（Bパターン） */
#navigation_005b
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_005b.gif");
 background-repeat: no-repeat;
 background-position: left;
}

/* 口座情報確認（Bパターン） */
#navigation_006b
{
 margin: 5px 0px 0px 0px;
 padding: 0;
 height: 36px;
 background-image: url("../kfgwimg/root_006b.gif");
 background-repeat: no-repeat;
 background-position: left;
}


/**********************************************/
/* ページタイトル　　　                       */
/**********************************************/ 
#title {
 margin: 10px 0px 20px 0px;
 padding: 10px 0px 10px 4px;
 border: 1px solid #dcdcdc; /* ページタイトル枠の色 */
 background-color: #FFFFFF; /* ページタイトル枠の中の色 */
 background-image: url("../kfgwimg/titleback.gif");
 background-repeat: repeat-x;
 background-position: bottom;
}

#pagename {
 margin: 0;
 padding-left: 2px;
 font-weight: bold;
 font-size: 120%;
 color: #000000; /* ページタイトルのフォント色 */
 letter-spacing: 0.2em;
}


/**********************************************/
/* ページサブタイトル            　　　       */
/**********************************************/ 
.pagesubname {
 margin: 20px 0px 10px 5px;
 padding: 2px 0px 3px 24px;
 font-weight: bold;
 font-size: 16px;
 color: #000000; /* ページタイトルのフォント色 */
 letter-spacing: 0.2em;
 background-image: url("../kfgwimg/arrow.gif");
 background-repeat: no-repeat;
}


/**********************************************/
/* 画面上部の利用者への案内の文言用           */
/**********************************************/
.description
{
 margin-top: 20px;
 line-height: 1.7;
}


.description2
{
 margin: 0px 0px 0px 20px;
 font-size: 80%;
 line-height: 1.7;
}

/**********************************************/
/* 処理結果・エラー等の通知文言               */
/**********************************************/
.result, .error
{
 font-weight: bold;
 color: #ff0000; /* 結果とエラーのフォント色 */
 line-height: 1.7;
 margin-top: 20px;
}


/**********************************************/
/* ボタンに画像を使用                         */
/**********************************************/
/* ボタン中央寄せ設定　６パターン必要 */
/* パターン１　ボタン３つの場合 */
#request
{
 margin-top: 20px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 200px; /* ｛(#frameページ幅)－（#containerの左右マージン）－374px｝÷2 */
 height: 30px;
}

/* パターン２　ボタン１つの場合 */
#request_1
{
 margin-top: 20px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 320px; /* ｛(#frameページ幅)－（#containerの左右マージン）－120px｝÷2 */
 height: 30px;
}

/* パターン３　ボタン２つの場合 */
#request_2
{
 margin-top: 20px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 258px; /* ｛(#frameページ幅)－（#containerの左右マージン）－247px｝÷2 */
 height: 30px;
}

/* パターン４　ボタン３つで金融機関へがある場合 */
#request_3
{
 margin-top: 20px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 180px; /* ｛(#frameページ幅)－（#containerの左右マージン）－434px｝÷2 */
 height: 30px;
}

/* パターン５　ボタン２つで受付画面へ戻るがある場合 */
#request_4
{
 margin-top: 20px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 246px; /* ｛(#frameページ幅)－（#containerの左右マージン）－307px｝÷2 */
 height: 30px;
}

/* パターン６　ボタン１つで収納企業へ戻るがある場合 */
#request_5
{
 margin-top: 20px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 320px; /* ｛(#frameページ幅)－（#containerの左右マージン）－180px｝÷2 */
 height: 30px;
}

/* ボタン右寄せ設定　１パターンのみ */
#request_right
{
 margin-top: 20px;
 margin-right: 0px;
 margin-bottom: 0px;
 margin-left: 0;
 height: 30px;
}

ul#input {
 margin: 0;
 padding: 0;
 list-style: none;
}

ul#input a {
 display: block;
 height: 30px;
 text-decoration: none;
}

ul#input li {
 position: static;
 display: block;
 height: 30px;
 margin: 0;
 padding: 0;
 text-indent: -9999px;
 float: left;
 margin-left: 7px;
}

/* 120pxのボタン群 */
#input li#inputback {
 width: 120px;
 background: url(../kfgwimg/back.gif) no-repeat;
}
#input li#inputcancel {
 width: 120px;
 background: url(../kfgwimg/cancel.gif) no-repeat;
}
#input li#inputnext {
 width: 120px;
 background: url(../kfgwimg/next.gif) no-repeat;
}
#input li#inputyes {
 width: 120px;
 background: url(../kfgwimg/yes.gif) no-repeat;
}
#input li#inputno {
 width: 120px;
 background: url(../kfgwimg/no.gif) no-repeat;
}
#input li#inputconfirm {
 width: 120px;
 background: url(../kfgwimg/confirm.gif) no-repeat;
}
#input li#inputagreement {
 width: 120px;
 background: url(../kfgwimg/agreement.gif) no-repeat;
}
#input li#inputnotagreement {
 width: 120px;
 background: url(../kfgwimg/notagreement.gif) no-repeat;
}
#input li#inputend {
 width: 120px;
 background: url(../kfgwimg/end.gif) no-repeat;
}
#input li#inputclose {
 width: 120px;
 background: url(../kfgwimg/close.gif) no-repeat;
}

/* 180pxのボタン群 */
#input li#inputfinance {
 width: 180px;
 background: url(../kfgwimg/finance.gif) no-repeat;
}
#input li#inputbacktop {
 width: 180px;
 background: url(../kfgwimg/backtop.gif) no-repeat;
}
#input li#inputcompany {
 width: 180px;
 background: url(../kfgwimg/company.gif) no-repeat;
}


/**********************************************/
/* 記入画面での文字サイズ                     */
/**********************************************/
.small
{
 font-size: 80%;
}


/**********************************************/
/* 金融機関選択一覧                           */
/**********************************************/
table.banklist
{
 width: 760px; /*(#frameページ幅)－（#containerの左右マージン＋このtableの左マージン＋20px） */
 margin: 20px 0px 0px 20px;
 white-space: nowrap;
 border: none; /* ボーダーの指定 */
 border-collapse: collapse; /* ボーダーの重なりの指定 */
}

tr.banklist
{
 white-space: nowrap;
}

td.banklistTd1
{
 width: 24px;
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dcdcdc; /* 背景色の指定 */
 border: 1px solid #cccccc;
}

td.banklistTd2
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border: 1px solid #cccccc;
}


/**********************************************/
/* 口座情報入力欄                             */
/**********************************************/
table.input
{
 width: 760px; /* (#frameページ幅)－（#containerの左右マージン＋このtableの左マージン＋20px） */
 margin: 20px 0px 0px 20px;
 white-space: nowrap;
 border: none; /* ボーダーの指定 */
 border-collapse: collapse; /* ボーダーの重なりの指定 */
}

tr.input
{
 white-space: nowrap;
}

td.inputTd1
{
 width: 28%; /* 左右が不自然にならないよう%で調整 */
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 border-top: 1px solid #cccccc;
 border-bottom: 1px solid #cccccc;
 border-left: 1px solid #cccccc;
}

td.inputTd1b
{
 width: 20%; /* 左右が不自然にならないよう%で調整 */
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 border: 1px solid #cccccc;
}


td.inputTd2
{
 width: 24px;
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 text-align: center;
 font-weight: bold;
 color: #ff0000;
 border-top: 1px solid #cccccc;
 border-bottom: 1px solid #cccccc;
 border-right: 1px solid #cccccc;
}

td.inputTd2b
{
 width: 32px;
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 text-align: center;
 border-bottom: 1px solid #cccccc;
}

td.inputTd3
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border-top: 1px solid #cccccc;
 border-bottom: 1px solid #cccccc;
 border-right: 1px solid #cccccc;
}

td.topinputTd1
{
 width: 28%; /* 左右が不自然にならないよう%で調整 */
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 border-top: 4px solid #ffffff;
}

td.topinputTd2
{
 width: 24px;
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 text-align: center;
 font-weight: bold;
 color: #ff0000;
 border-top: 4px solid #ffffff;
}

td.topinputTd2b
{
 width: 32px;
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 text-align: center;
 border-top: 4px solid #ffffff;
}

td.topinputTd3
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border-top: 4px solid #ffffff;
}


/**********************************************/
/* 内容確認欄                                 */
/**********************************************/
table.confirm
{
 width: 760px; /* (#frameページ幅)－（#containerの左右マージン＋このtableの左マージン＋20px） */
 margin: 20px 0px 0px 20px;
 white-space: nowrap;
 border: none; /* ボーダーの指定 */
 border-collapse: collapse; /* ボーダーの重なりの指定 */
}

tr.confirm
{
 white-space: nowrap;
}

td.confirmTd1
{
 width: 28%; /* 左右が不自然にならないよう%で調整 */
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 border: 1px solid #cccccc;
}

td.confirmTd1b
{
 width: 32px;
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 text-align: center;
 border: 1px solid #cccccc;
}

td.confirmTd2
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border: 1px solid #cccccc;
}

td.topconfirmTd1
{
 width: 28%; /* 左右が不自然にならないよう%で調整 */
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 border-top: 4px solid #ffffff; /* 次のセルとの余白を作るためのボーダーの指定 */
}

td.topconfirmTd1b
{
 width: 32px;
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 border-top: 4px solid #ffffff; /* 次のセルとの余白を作るためのボーダーの指定 */
 text-align: center;
}

td.topconfirmTd2
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border-top: 4px solid #ffffff; /* 次のセルとの余白を作るためのボーダーの指定 */
}


/**********************************************/
/* ＩＭＥ設定                                 */
/**********************************************/
/* 指定無し */
INPUT.imeAuto
{
 ime-mode: auto;
 }

/* 初期値が日本語入力モード */
INPUT.imeActive
{
 ime-mode: active;
}

/* 初期値が英数字入力モード */
INPUT.imeInactive
{
 ime-mode: inactive;
}

/* 英数字入力モード */
INPUT.imeDisabled
{
 ime-mode: disabled;
}


/**********************************************/
/* 利用規約スクロール窓                       */
/**********************************************/
.scroll {
 border-top: #cccccc 1px solid;
 border-right: #999999 1px solid;
 border-bottom: #999999 1px solid;
 border-left: #cccccc 1px solid;
 background-color: #fffbf0;
 overflow: scroll;
 margin: 10px 39px;
 word-break: break-all;
 width: 720px; /*(#frameページ幅)－（#containerの左右マージン＋このscrollの左右マージン＋ボーダー幅） */
 height: 120px;
}

.rule {
 line-height: 1.5;
}

.ruledescription {
 line-height: 1.5;
 margin: 5px 10px;
}

/**********************************************/
/* フッターに画像を使用            　　　　   */
/**********************************************/
#footer {
 padding: 0px;
 margin-top: 40px;
 border-top: 1px solid #dcdcdc; /* フッタートップの線の色 */
 background-color: #ffffff; /* フッターの背景の色 */
 background-repeat: no-repeat;
 background-position: left;
}


/**********************************************/
/* フッターにテキストを使用        　　　　   */
/**********************************************/
/* 左にテキスト使用 */
#footer_b {
 text-align: left;
 padding: 0px;
 margin-top: 40px;
 border-top: 1px solid #dcdcdc; /* フッタートップの線の色 */
 background-color: #ffffff; /* フッターの背景の色 */
}

/* イメージではなく文字を使用する場合ここに文字挿入 */
#footmenu
{
 margin: 0;
 padding: 36px 0px 20px 0px;
 font-size: 12px;
 letter-spacing: 0.1em;
 color: #CCCCCC; /* フッターのフォント色 */
}


/**********************************************/
/* 金融機関コード一覧                         */
/**********************************************/
table.bnknoList
{
 width: 760px; /*(#frameページ幅)－（#containerの左右マージン＋このtableの左マージン＋20px） */
 margin: 20px 0px 0px 20px;
 white-space: nowrap;
 border: none;
 border-collapse: collapse; /* ボーダーの重なりの指定 重ねて表示 */
}

tr.bnknoList
{
 white-space: nowrap;
}

td.bnknoList
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 40px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border: 1px solid #cccccc; /* ボーダーの指定 */
}

/**********************************************/
/* 金融機関業態区分一覧                       */
/**********************************************/
table.bnktypefList
{
 width: 760px; /*(#frameページ幅)－（#containerの左右マージン＋このtableの左マージン＋20px） */
 margin: 20px 0px 0px 20px;
 white-space: nowrap;
 border: none;
 border-collapse: collapse; /* ボーダーの重なりの指定 重ねて表示 */
}

tr.bnktypefList
{
 white-space: nowrap;
}

td.bnktypefList
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 40px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border: 1px solid #cccccc; /* ボーダーの指定 */
}


/**********************************************/
/* 金融機関50音選択                           */
/**********************************************/
table.bnknamekn
{
 width: 600px; /*(#frameページ幅)－（#containerの左右マージン＋このtableの左マージン＋20px） */
 margin: 20px 98px 0px 98px;
 white-space: nowrap;
 border: 1px solid #cccccc; /* ボーダーの指定 */
 border-collapse: collapse; /* ボーダーの重なりの指定 重ねて表示 */
}

tr.bnknamekn
{
 white-space: nowrap;
}

tr.bnknameknAlpha
{
 white-space: nowrap;
}

td.bnknamekn
{
 margin: 0px 0px 5px 0px;
 padding: 5px 5px 5px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border: none; /* ボーダーの指定 */
 text-align: center;
}

td.bnknameknAlpha
{
 margin: 0px 0px 5px 0px;
 padding: 5px 5px 5px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border: none; /* ボーダーの指定 */
 text-align: center;
}

input.bnknameknButton
{
	white-space: nowrap;
	font-size: 17px;
	width: 50px;
}

input.bnknameknAlphaButton
{
	white-space: nowrap;
	font-size: 17px;
	width: 110px;
}


/**********************************************/
/* 金融機関絞込                               */
/**********************************************/
table.confirmBnktypef
{
 width: 760px; /* (#frameページ幅)－（#containerの左右マージン＋このtableの左マージン＋20px） */
 margin: 20px 0px 0px 20px;
 white-space: nowrap;
 border: none; /* ボーダーの指定 */
 border-collapse: collapse; /* ボーダーの重なりの指定 */
}

tr.confirmBnktypef
{
 white-space: nowrap;
}

td.confirmBnktypefTd1
{
 width: 28%; /* 左右が不自然にならないよう%で調整 */
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #dddddd; /* 背景色の指定 */
 border: 1px solid #cccccc;
}

td.confirmBnktypefTd2
{
 margin: 0px 0px 10px 0px;
 padding: 8px 0px 8px 5px;
 white-space: nowrap;
 background-color: #ffffff; /* 背景色の指定 */
 border: 1px solid #cccccc;
}