@charset "utf-8";
/* 基本的なタグのルール　ここから */
body{
    font-family: Meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
    font-size: 12px;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
pre,
form,
fieldset,
input,
iframe,
blockquote{
    margin:0;
    padding:0
}

hr{
    margin: 0.5em 0 0.5em 0;
    padding:0
}

hr.dashed{
    border: 0;
    border-bottom: 1px dashed #aaa;
}
/* リストに項番や「・」はデフォルト表示しない */
ol,
ul{
    list-style: none;
}
/* リスト要素は内容が幅を超過した際に「...」で残りの内容を省略する */
li{
    border-bottom: 1px solid #aaaaaa;
    overflow:hidden;
    text-overflow:ellipsis;
    -webkit-text-overflow:ellipsis;
    -o-text-overflow: ellipsis;
    white-space:nowrap;
}
/* リンクは青字とする */
a{ color:#010077; }
a:link{ color:#010077; text-decoration: none ; }
/* カーソルが当たっている状態では下線を表示する */
a:hover{text-decoration: underline; }
a:active{text-decoration: underline; }

input[type="text"],
input[type="password"],
input.date{
    padding: 0 0 0 0.1em;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    border: 2px solid #b5b5b5;
    margin: 0 0 0.1em 0;
    height: 1.5em;
}

input[type="radio"],
input[type="checkbox"]{
    width: 1em;
    vertical-align: middle;
    margin-left: 0.5em;
}

input[type="radio"]:first-child,
input[type="checkbox"]:first-child{
    margin-left: 0;
}

textarea{
    width: 100%;
    padding: 0 0 0 0.1em;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    border: 2px solid #b5b5b5;
}

button{
    white-space: normal;
    word-wrap: break-word;
}

button span{
    font-weight: bold;
}

/* 基本的なタグのルール　ここまで */

/* ヘッダ（共通部）　ここから */
.header{
    width: 100%;
    margin: 0 0 1em 0;
    min-width: 980px;
}

.header > div{
    position: relative;
    overflow:hidden;
}

.header div:first-child > p:first-child{
    float:left;
    text-shadow: 1px 1px 0 #000000;
    font-size: 1.7em;
    font-weight: bold;
    margin-top: 0.2em;
}

.header div > p{
    float: right;
    padding: 0;
    font-size: 0.8em;
    text-shadow: 1px 1px 0 #000000;
}

.header button{
    float:right;
    font-size: 0.8em;
    margin: 0.7em 0.5em 0em 0.5em;
    padding: 0 2em 0 2em;
}

.header div > p:first-child{
    float:left;
}

.header p.user_info{
    margin-left:1em;
    font-weight: bold;
}

/* ヘッダ（共通部）　ここまで */

/* 文字（共通部）　ここから */

.important{
    color: red;
    font-weight: bold;
}

.font_normal{
    font-weight: normal;
    font-size: 12px;
}

.text_disable {
    color: gray;
    text-decoration: line-through;
}
/* 文字（共通部）　ここまで */


/* 共通パーツ構成　リスト　ここから */
.list li{
    border-left: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
    border-bottom: none;
}

.list li > a,
.list li > p{
    margin-left: 0.2em;
}

.list button{
    margin: 0;
    border: none;
    border-radius: 0;
    text-align: left;
    width: 100%;
}

.list.border_bottom li{
    border-bottom:  1px solid #aaaaaa;
}

.list_header_circular,
.list_header{
    border-top: 1px solid #aaaaaa;
    font-size: 1.2em;
    font-weight: bold;
    padding: 0.3em;
    background: #E6E6E6; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background-color: #E6E6E6;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#E6E6E6), to(#CCCCCC));
    background-image: -webkit-linear-gradient(top, #E6E6E6, #CCCCCC);
    background-image: -moz-linear-gradient(top, #E6E6E6, #CCCCCC);
    background-image: -ms-linear-gradient(top, #E6E6E6, #CCCCCC);
    background-image: -o-linear-gradient(top, #E6E6E6, #CCCCCC);
    background-image: linear-gradient(to bottom, #E6E6E6, #CCCCCC);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#E6E6E6, endColorstr=#CCCCCC);
}

.list_header_circular{
    border-top-right-radius: 0.5em;
    border-top-left-radius: 0.5em;
    -webkit-border-top-right-radius: 0.5em;
    -webkit-border-top-left-radius: 0.5em;
    -moz-border-top-right-radius: 0.5em;
    -moz-border-top-left-radius: 0.5em;
}

.list_sub_header{
    color: #FFFFFF;
    background: #5b5b5b;
    font-size: 1em;
    font-weight: bold;
    padding: 0.3em;
}

.list .btn_in_list{
    width: auto;
    margin: 0.5em;
    border: 1px solid #aaaaaa;
    border-radius: 0.5em;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
}

/* IE8ではlast-child属性が効かないので、対応としてlast-itemクラスを作成し、付与する運用とする */
.list .last_child,
.list .last_child_circular{
    border-bottom: 1px solid #aaaaaa;
}

.list .last_child_circular{
    border-bottom-right-radius: 0.5em;
    border-bottom-left-radius: 0.5em;
    -webkit-border-bottom-right-radius: 0.5em;
    -webkit-border-bottom-left-radius: 0.5em;
    -moz-border-bottom-right-radius: 0.5em;
    -moz-border-bottom-left-radius: 0.5em;
}

/* 共通パーツ構成　リスト　ここまで */

/* 共通パーツ構成　テーブル　ここから */

.must{
    color: red;
}

.table{
    border-collapse:collapse;
    margin: 0.5em 0;
    width: 100%;
    text-align: left;
}

.table button,
.table select{
    font-size: 0.8em;
}

.table.right,
.table .right,
.table.left,
.table .left{
    overflow: auto;
    padding: 0;
}

.table.right > *,
.table .right > *,
.table.left > *,
.table .left > *{
    float: none;
}

.table.right,
.table .right,
.number{
    text-align: right;
}

.table.left,
.table .left,
.text{
    text-align: left;
}

.table.center{
    text-align: center;
}

.table .center{
    text-align: center;
    width: auto;
}

.table .middle{
    vertical-align: middle;
}

.table .bottom{
    vertical-align: bottom;
}

.table thead tr{
    font-weight:bold;
    border-bottom: 3px solid #aaaaaa;
    background-color: #f2f5f6;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f5f6), to(#c8d7dc));
    background-image: -webkit-linear-gradient(top, #f2f5f6, #c8d7dc);
    background-image: -moz-linear-gradient(top, #f2f5f6, #c8d7dc);
    background-image: -ms-linear-gradient(top, #f2f5f6, #c8d7dc);
    background-image: -o-linear-gradient(top, #f2f5f6, #c8d7dc);
    background-image: linear-gradient(to bottom, #f2f5f6, #c8d7dc);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f2f5f6, endColorstr=#c8d7dc);
}

.table thead th,
.table thead td{
    vertical-align: middle;
}

.table th,
.table td{
    table-layout: fixed;
    border: 1px solid #aaaaaa;
    vertical-align: top;
    padding: 0.4em 0.5em;
}

.table tbody th,
.table.word_10 tbody th,
.table.word_15 tbody th,
.table.word_20 tbody th{
    background-color: #dfdddd;
    text-align: inherit;
    word-break: break-all;
}

.table tbody th{
    width: 100px;
}

.table .word_2{
    width:30px;
}
.table .word_3{
    width:36px;
}
.table .word_4{
    width:48px;
}
.table .word_5{
    width:60px;
}
.table .word_6{
    width:75px;
}

.table .word_10,
.table.word_10 tbody th{
    width: 130px;
}

.table .word_15,
.table.word_15 tbody th{
    width: 190px;
}

.table .word_20,
.table.word_20 tbody th{
    width: 240px;
}

.table.inner{
    margin: 0;
}

.table.inner thead tr{
    background-color: #eeeeee;
    background-image: none;
    border-bottom: 1px;
    text-align: center;
}

.table.inner .add_row{
    float: right;
}
.table.inner .add_row span{
    padding: 0.4em 2em;
}

.table.inner tbody tr.even{
    background-color: #f8f8f8;
}

/* 共通パーツ構成　テーブル　ここまで */

/* 全体の流れを説明するためのクラス ここから*/
.flow{
    display: table;
    margin: 0.5em 0;
    width: 100%;
    text-align: center;
    border-radius: 0.5em;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    background-color: #C7F1D5;
}

.flow > div{
    display: table-cell;
    vertical-align: middle;
}

.flow div > *{
    display: inline-block;
    margin: 0.3em 0.1em;
    font-weight:bold;
    vertical-align: middle;
}

.selected {
    width: 74px;
    border:1px solid #1E9C53;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    font-weight:bold;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    color: #FFFFFF;
    background-color: #26C76A; background-image: -webkit-gradient(linear, left top, left bottom, from(#26C76A), to(#1E9C53));
    background-image: -webkit-linear-gradient(top, #26C76A, #1E9C53);
    background-image: -moz-linear-gradient(top, #26C76A, #1E9C53);
    background-image: -ms-linear-gradient(top, #26C76A, #1E9C53);
    background-image: -o-linear-gradient(top, #26C76A, #1E9C53);
    background-image: linear-gradient(to bottom, #26C76A, #1E9C53);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#26C76A, endColorstr=#1E9C53);
}

.unselected{
    width: 74px;
    border:1px solid #1E9C53;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    font-weight:bold;
    color: #000000;
    background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
    background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd);
}

.selected.word_10,
.unselected.word_10{
    width: 134px;
}
.selected.word_15,
.unselected.word_15{
    width: 194px;
}
.selected.word_20,
.unselected.word_20{
    width: 254px;
}
/* 全体の流れを説明するためのクラス ここまで*/

/* セレクトメニュー表示調整のためのクラス ここから*/
.select_long{
    height: 200px;
}

select{ width: 160px; }
select.word_15{ width: 220px; }
select.word_20{ width: 280px; }

/* セレクトメニュー表示調整のためのクラス ここまで*/


/* 全体利用する配置のクラス ここから*/
/* left,right,centerはそれぞれ左寄せ、右寄せ、中央寄せを行うための箱となる*/
/* 箱としてdivタグを用意し、その中に入る子要素のみ配置が適用される*/
/* centerに限り、子要素もdivである必要。また、子要素の幅が親要素に等しい場合動かないので注意*/
.left,
.right,
.both{
    width: 100%;
    overflow: hidden;
    padding: 0.5em 0;
}
/* _singleのクラスは個々の項目を寄せる際に利用。組み合わせで両端に寄せた要素が作成可能*/
.left > *,
.left_single{
    float:left;
}

.right > *,
.right_single{
    float:right;
}

.center{
    width: 100%;
    text-align: center;
}

.center > div{
    display: inline-block;
}

.center div > *{
    display: inline;
}

.left_inline{ text-align: left; }
.right_inline{ text-align: right; }

/* 複数の子要素の中で、特定要素のみを横並びする場合は隣接する子要素の両方にhorizontalを適用する*/
.horizontal{
    display: inline;
}

.cell_block{
    display: inline-block;
    margin-right: 0.5em;
}

.cell_block select + span{
    width: 100% !important;
}

.msg_area{
    background-color: #e0e0e0;
    -webkit-border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    border-radius: 0.5em;
    padding: 0.5em;
}
/* 全体利用するレイアウトのクラス ここまで*/

/* 全体利用する折り返しのクラス ここから*/
.nowrap, .nowrap > *{ white-space: nowrap}
.normal, .normal > *{ white-space: normal}
/* 全体利用する折り返しのクラス ここまで*/

/* 全体利用するmarginのクラス ここから*/

.mgn_narrow{ margin:5px; }
.mgn_top_narrow{ margin-top:5px; }
.mgn_bottom_narrow{ margin-bottom:5px; }
.mgn_left_narrow{ margin-left:5px; }
.mgn_right_narrow{ margin-right:5px; }
.mgn_tb_narrow{ margin-top:5px; margin-bottom:5px; }
.mgn_lr_narrow{ margin-left:5px; margin-right:5px; }
.mgn_wide{ margin:10px; }
.mgn_top_wide{ margin-top:10px; }
.mgn_bottom_wide{ margin-bottom:10px; }
.mgn_left_wide{ margin-left:10px; }
.mgn_right_wide{ margin-right:10px; }
.mgn_tb_wide{ margin-top:10px; margin-bottom:10px;}
.mgn_lr_wide{ margin-left:10px; margin-right:10px; }
/* 全体利用するmarginのクラス ここまで*/

/* 全体利用するpaddingのクラス ここから*/

.pad_narrow{ padding:5px; }
.pad_top_narrow{ padding-top:5px; }
.pad_bottom_narrow{ padding-bottom:5px; }
.pad_left_narrow{ padding-left:5px; }
.pad_right_narrow{ padding-right:5px; }
.pad_tb_narrow{ padding-top:5px; padding-bottom:5px; }
.pad_lr_narrow{ padding-left:5px; padding-right:5px; }
.pad_wide{ padding:10px; }
.pad_top_wide{ padding-top:10px; }
.pad_bottom_wide{ padding-bottom:10px; }
.pad_left_wide{ padding-left:10px; }
.pad_right_wide{ padding-right:10px; }
.pad_tb_wide{ padding-top:10px; padding-bottom:10px;}
.pad_lr_wide{ padding-left:10px; padding-right:10px; }

/* 全体利用するpaddingのクラス ここまで*/

/* 入力欄用の幅のクラス ここから*/

.wid_100{ width:100%; }

/* 入力欄用の幅のクラス ここまで*/

/* jQueryUIクラスの拡張 ここから*/

.ui-state-error.ui-corner-all{ margin: 0.5em 0; }

/* jQueryUIクラスの拡張 ここまで*/
