/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/

/* コンテンツの配置   
----------------------------------------------------------*/
div.Left
{
     float:left;
     /* width:49%; */
     padding-left:2px;
     border:0px solid green;
}
div.Right
{
    float:left;
    padding-left:4px;
    border:0px solid yellow;
}
div.Center
{
    padding:0;
    border:0px solid yellow;
}


/* フォルダ名称の領域 */
div.FrameTitle
{
    margin-left:0px;
    padding-top:3px;
    padding-left:5px;
    height:30px;
    /* border:2px solid #7D3C4A; */
    border-top:3px solid #7D3C4A;
    border-bottom:3px solid #7D3C4A;
    border-left:0px solid #7D3C4A;
    border-right:0px solid #7D3C4A;
}

div.FrameTitle .Image
{
    float:left;
}
div.FrameTitle .Image img
{
    position:relative;
    top  : -1px;
    width  : 29px;
    height : 29px;
}

div.FrameTitle .Title
{
    float   :left;
    position:relative;
    top  :4px;
    left :10px;
    font-size:12pt;
}

/* 画面中の全体タイトルの領域 */
div.Subject
{
    margin-left:0px;
    padding-top:3px;
    padding-left:5px;
    height:30px;
    /* border:2px solid #7D3C4A; */
    border-top:3px solid #7D3C4A;
    border-bottom:3px solid #7D3C4A;
    border-left:0px solid #7D3C4A;
    border-right:0px solid #7D3C4A;
}

div.Subject .Image
{
    float:left;
}
div.Subject .Image img
{
    position:relative;
    top  : -1px;
    width  : 29px;
    height : 29px;
}

div.Subject .Title
{
    float   :left;
    position:relative;
    top  :12px;
    left :10px;
    font-size:9pt;
}

div.Subject .Content
{
    float   :left;
    position:relative;
    top  :8px;
    left :12px;
    font-size:12pt;
}

/* オブジェクトの属性を設定 */
input.criteriaText
{
    width:120px;
}
input.criteriaAmount
{
    width:100px;
}
input.criteriaDate
{
    width:100px;
}
input.UploadedFileName
{
    width:510px;
}
input.BtnDelUploadedFile
{
    width :62px;
    height:22px;
}
input.readonly, textarea.readonly
{
    color:#696969;
    font-weight:bold;
    background-color:#ededed;
}
input.InputAmount
{
    text-align: right;
}

/* ボタン配置領域 */
div.Submit
{
    float:left;
    margin-top:2px;
    margin-left:2px;
    padding-left:5px;
    padding-right:10px;
    height:38px;
    border:0px solid #000000;
    vertical-align:baseline;
}
div.Submit span
{
    float:left;
    padding-left:10px;
}
div.Submit input
{
    width  : 125px;
    height : 28px;
}



div.divToDo 
{
    position:relative;
    top  :-14px;
    margin:1px 5px 0 15px;
    border-top:0px solid #808080;
    border-right:2px solid #808080;
    border-bottom:0px solid #808080;
    border-left:2px solid #808080;
}

/* フォルダ名称の領域 */
div.divToDo div.Elements, div.divToDo div.ElementsDetail
{
    margin-left:-35px;
    margin-right:2px;
    padding-top:1px;
    padding-left:1px;
    height:33px;
    border-top:0px solid #7D3C4A;
    border-bottom:1px solid #7D3C4A;
    border-left:0px solid #7D3C4A;
    border-right:0px solid #7D3C4A;
}
div.divToDo div.ElementsDetail
{
    padding-left:50px;
}
/*
div.divToDo div.Elements .ElementsImage
{
    float:left;
    width:33;
}
*/
div.Elements .ImgDot, div.ElementsDetail .ImgDot
{
    float   :left;
    position:relative;
    top  :8px;
    left :1px;
    width  : 11px;
    height : 12px;
}

div.divToDo .ElementsName
{
    float   :left;
    position:relative;
    top  :8px;
    left :10px;
    /* font-size:12px; */
}
div.divToDo .ToDoCount
{
    float   :right;
    position:relative;
    top  :3px;
    left :0px;
    /* font-size:12px; */
    padding-right:10px;
}



div#DocumentCriteria 
{
    /* position:relative; */
    /* top  :-14px; */
    margin:2px 5px 1px 5px;
    border-top:0px solid #808080;
    border-right:2px solid #808080;
    border-bottom:0px solid #808080;
    border-left:2px solid #808080;
}

div#DocumentCriteria #Header
{
    float:left;
    padding:2px 5px 4px 5px;
    /* width:33; */
    border-bottom:1px solid #C0C0C0;
}

div#DocumentCriteria img.Title
{
    float:left;
    width  : 26px;
    height : 26px;
}
div#DocumentCriteria #Header .Title
{
    float:left; 
    position:relative; 
    top:4px; 
    left :6px; 
    font-size:10pt;
}
div#DocumentCriteria #Header .Submit
{
    float:right;
    position:relative; 
    top:2px; 
    left :0px; 
    /* font-size:10pt; */
}

/* 検索条件の入力領域 */
div#DocumentCriteria #Criteria
{
    margin-left:0px;
    margin-right:3px;
    padding-top:0px;
    padding-left:0px;
    
    border-top:0px solid #C0C0C0;
    border-bottom:0px solid #7D3C4A;
    border-left:0px solid #7D3C4A;
    border-right:0px solid #7D3C4A;
}
div#DocumentCriteria #Criteria img.Item
{
    float:left;
    position:relative; 
    width  : 11px;
    height : 11px;
    top:2px; 
    left :0px; 
}
/*
div#DocumentCriteria #Criteria input
{
    width  : 140px;
}
*/
div#DocumentCriteria table
{
    border: solid 0px transparent;
}
div#DocumentCriteria table th, div#DocumentCriteria table td
{
    border: solid 0px transparent;
    margin:0;
    padding:4px 0 4px 2px;
    /* vertical-align:middle; */
}
div#DocumentCriteria table th span
{
    margin:5px;
    /* padding:2px 0 2px 0; */
}



table.DocumentContents
{
  border: solid 1px #7D3C4A;
  border-collapse: collapse;
}

table.DocumentContents thead tr
{
    height:30px;
}
/*
table.DocumentContents tbody tr
{
    height:24px;
}
*/
table.DocumentContents thead th
{   
    /* border-top   :2px solid #7D3C4A;
    border-bottom:1px solid #7D3C4A; */
    padding:0px 0px 0px 15px;
    /* background-color:#7D3C4A; */
    /* background-color:#E8CFD4; */ /* 明るい */
    background-color:#C2A4AB;
    /* color:#FFFFFF; */
    vertical-align:middle;
}
table.DocumentContents tbody th
{   
    padding:0px 0px 0px 5px;
    /* background-color:#7D3C4A; */
    background-color:#E8CFD4;  /* 明るい */
    /* background-color:#C2A4AB; */
    /* color:#FFFFFF; */
    text-align:left;
    vertical-align:middle;
}

table.DocumentContents td 
{
  /* padding: 5px; */  
  border: solid 0px #e8eef4;
}



/* ---- スクロール用のサンプル ---- */
/* #ScrTbl { /* スクロール対象のテーブル */
/*  background-color: transparent; /* テーブルの背景色 borderの色になる */
/*  border-collapse:separate; /* 枠線の表示の仕方 */
  /* font-size: 16px;/* 文字のサイズ */
/*   } */

#out_Div { /* 全体の枠。ここにヘッダを格納 */
  position: relative; /* 相対位置 */
  /* padding-top: 26px;  /*  #in_Div の開始位置 */
  padding-top: 32px;  /*  #in_Div の開始位置 */
  /* width: 710px; /* 列幅の合計＋セル間の幅(2px)の合計＋20px 程度 */
  /* border: 0px solid transparent;  /* 外枠 */
  /* background-color: transparent; /* 白 */
}

#in_Div {/* tbodyが入っている。ここがスクロール対象*/
  overflow: auto; /* スクロールバー*/
  height: 300px; /* tbodyを表示する高さ */
}

/* #sclTbl thead tr {  /* ヘッダ 見出し行,位置を #out_Div の左上端に移動 */
/*  position: absolute; /* 絶対位置 */
/*  top: 0px; /* 上からの位置 */
/*  left: 0px; /* 左からの位置 */
/* } */

#sclTbl thead tr th {/* thead 'th'のスタイル */
    /* background-color: #0099cc;  /* 背景色 */
    /* background-color: #C2A4AB; */
    /* padding: 2px 0px; */
    border-top   : 2px #7D3C4A solid;
    border-bottom: 2px #7D3C4A solid;
}

/* #sclTbl tbody tr td{/* tbody 'td'のスタイル */
  /* background-color: #dcdcdd; */
  /* color: blue; */
/*  padding: 3px 6px;
   }
*/

table#scroll,　table#scroll *
{
    display:block;margin: 0;padding:0;line-height:30px;
}
table#scroll
{
    /*width:428px;margin-top:50px;border-bottom:1px solid gray; */
}
table#scroll thead, table#scroll tbody
{
    width:100%;
    /* border:none; */
    border:solid red 1px;
}
table#scroll tbody
{
    height:94px;
    /* height   : 300px; /* tbodyを表示する高さ */
    overflow : auto;
}
table#scroll thead th, table#scroll tbody td
{
    float:left;
    width:100px;
    border:solid gray 1px;
}

/* 本来はfloatではなくdisplay:inline-blockとすべきだが後方互換のためやむなくfloat */
/*
table#scroll tbody, table#scroll tbody tr
{
    clear:left;
}
*/


/* 
 * 処理状態進捗バーの設定
 */
div#ProgressBar
{
    margin: 0 auto;
    
    padding-left:0;
    padding-top:2px;
    
    border : 0px solid blue;
    text-align : left;
}
#ProgressBar ol, #ProgressBar li
{
    margin: 0;
    padding: 0;
}

#ProgressBar li.now
{
    color:#404040;
    font-size:9pt;
    font-weight:bold;
}
#ProgressBar li.other
{
    color:#a0a0a0;
    font-size:9pt;
    font-weight:bold;
}

#ProgressBar li.start
{
    width :6px;
    height:33px;
    float:left;
 
    border:0px solid #C0C0C0;
    text-align    :center;
    /* vertical-align: middle; */
    line-height:30px;
    
    color:#808080;
    /* border-radius:3px 0 0 3px; */
}
#ProgressBar .now li.start
{
    background: url("images/progress-start2.png") no-repeat;
}
#ProgressBar .other li.start
{
    background: url("images/progress-start2-other.png") no-repeat;
}


#ProgressBar li.body
{
    /* display:table-cell; /* と指定するとvertical-alignが有効になります */ 
    height:33px;
    float:left;
 
    padding-right:0px;
    padding-left:0px; 
    border:0px solid #C0C0C0;
    
    text-align    :center;
    /* vertical-align: middle; */
    line-height:32px;    
}
#ProgressBar .now li.body
{
    background: url("images/progress-body2.png") repeat;
    width :98px; 
}
#ProgressBar .other li.body
{
    background: url("images/progress-body2-other.png") repeat;
    width :99px; 
}

#ProgressBar li.end
{
    height:33px;
    float:left;
    
    border:0px solid #C0C0C0;
    text-align :center;
    line-height:30px;
}
#ProgressBar .now li.end
{
    background: url("images/progress-end2.png") no-repeat;
    width :12px;
}
#ProgressBar .other li.end
{
    background: url("images/progress-end2-other.png") no-repeat;
    width :11px;
}

#ProgressBar table 
{
    float:left;
}

div.popover {
    max-width: 1000px; /* この数字を変える */
    border-radius : 0px;
}