/* Reset */

div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, table, th, td {
    margin: 0;
    padding: 0;
    font-size: 10pt;
}

input, textarea {
    font-size: 10pt;
    box-sizing: border-box;
}

ul, ol {
    list-style: none;
}

table {
    border-collapse: collapse;
}

/* Common */

a, a:visited {
    color: #00e;
}

/*  */

html, body {
    height: 100%;
}

/* Header */

header {
    display: flex;
    padding: 10px 20px;
    background: #009;
    color: #fff;
}

    header h1 {
        font-size: 20px;
        font-weight: bold;
    }

    header div.login {
        flex-grow: 1;
        text-align: right;
    }

        header div.login a {
            color: #fff;
        }

nav {
    padding: 0 20px;
    background: #eee;
}

    nav ul {
        display: flex;
    }

        nav ul li {
            width: 100px;
            height: 24px;
            border: solid 1px #ccc;
            background-image: url('Button.png');
            text-align: center;
        }

            nav ul li.active {
                background-image: url('Button2.png');
            }

footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 0 20px;
    background: #009;
}

    footer p.copyright {
        padding: 20px 0;
        text-align: center;
        color: #fff;
    }

div.container2 {
    min-height: 100%;
    position: relative;
    padding-bottom: 80px;
}

div.body {
    padding: 0 20px;
}

    div.body h2 {
        margin: 20px 0;
        padding: 4px 8px;
        border: solid 1px #ccc;
        background: #bdf;
        font-size: 15px;
        font-weight: bold;
    }

    div.body h3 {
        padding: 4px 8px;
        border: solid 1px #ccc;
        background: #bdf;
        font-weight: bold;
    }

div.section {
    padding: 20px;
}

    div.section h3 {
        padding: 4px 8px;
        border: solid 1px #ccc;
        background: #bdf;
        color: #333;
        font-weight: bold;
    }

table.table {
    width: 100%;
}

    table.table th {
        height: 24px;
        padding: 4px;
        border: solid 1px #ccc;
        background: #bdf;
        box-sizing: border-box;
        font-weight: bold;
        text-align: center;
    }

    table.table td {
        height: 24px;
        padding: 4px;
        border: solid 1px #ccc;
        box-sizing: border-box;
    }

table.fields {
    width: 100%;
}



    table.fields td input[type=text], table.fields td textarea {
        width: 100%;
        box-sizing: border-box;
    }

table .timestamp {
}

    table.timestamp th {
        width: 1%;
        white-space: nowrap;
    }

    table.timestamp td {
        width: 45%;
        white-space: nowrap;
    }

/* Categories */

div.body h2.categoryList {
    height: 24px;
    margin: 0 0 -1px 0;
    padding: 0 4px;
    font-size: 10pt;
    text-align: center;
}

ul.categoryList {
}

    ul.categoryList li {
        min-height: 24px;
        margin-bottom: -1px;
        padding: 0 4px;
        border: solid 1px #ccc;
        background: url('Button.png') repeat-x bottom;
    }

/* Contents */

table.contentList th.subject {
    width: 20%;
}

table.contentList th.body {
    width: 35%;
}

table.contentList th.supervisor {
    width: 10%;
}

table.contentList th.modifiedBy {
    width: 10%;
}

table.contentList th.commands {
    width: 1%;
}

table.contentList td.categoryName {
    background: #eef;
    font-weight: bold;
}

table.contentList td.commands2 {
    background: #eef;
    text-align: right;
}

table.contentList td.commands {
    width: 1%;
    white-space: nowrap;
}


table.newContentList th.modified {
    width: 10%;
}

table.newContentList th.category {
    width: 15%;
}

table.newContentList th.subject {
    width: 15%;
}

table.newContentList th.body {
    width: 40%;
}

table.newContentList th.supervisor {
    width: 10%;
}

table.newContentList td.modified {
    width: 10%;
}

table.newContentList td.modified {
    text-align: center;
}

table.newContentList td.supervisor {
    text-align: center;
}


table.newContentList td.confirmed {
    text-align: center;
}

/**/

table.historyList {
}

    table.historyList th.modified {
        width: 10%;
    }

    table.historyList th.categoryName {
        width: 10%;
    }

    table.historyList th.subject {
        width: 10%;
    }

    table.historyList th.body {
        width: 20%;
    }

    table.historyList th.isConditional {
        width: 5%;
    }

    table.historyList th.conditions {
        width: 20%;
    }

    table.historyList th.confirmed {
        width: 5%;
    }

    table.historyList th.confirmedBy {
        width: 5%;
    }

    table.historyList th.supervisor {
        width: 5%;
    }

    table.historyList th.modifiedBy {
        width: 5%;
    }

/**/

table.shopList {
}

    table.shopList th.sectionName {
        width: 30%;
    }

    table.shopList th.areaName {
        width: 30%;
    }

    table.shopList th.shopName {
        width: 30%;
    }

    table.shopList th.commands {
        width: 10%;
    }

    table.shopList td.commands {
        width: 1%;
        white-space: nowrap;
    }

/**/
/**/
/**/






/*
    Shops
*/

table.shop-list {
}

    table.shop-list th.shop-code {
    }

    table.shop-list th.shop-name {
    }

    table.shop-list th.description {
    }

    table.shop-list th.is-hidden {
        width: 1%;
        white-space: nowrap;
    }

    table.shop-list td.shop-code {
    }

    table.shop-list td.shop-name {
    }

    table.shop-list td.description {
    }

    table.shop-list td.is-hidden {
        text-align: center;
    }

    table.shop-list td.is-deleted {
    }

    table.shop-list td.created {
    }

    table.shop-list td.created-by {
    }

    table.shop-list td.last-modified {
    }

    table.shop-list td.last-modified-by {
    }

    table.shop-list td.old-shop-id {
    }

table.shop-fields {
}

    table.shop-fields th.tenant-id {
    }

    table.shop-fields th.area-id {
    }

    table.shop-fields th.shop-code {
    }

    table.shop-fields th.lowered-shop-code {
    }

    table.shop-fields th.shop-name {
    }

    table.shop-fields th.description {
    }

    table.shop-fields th.display-order {
    }

    table.shop-fields th.is-hidden {
    }

    table.shop-fields th.is-deleted {
    }

    table.shop-fields th.created {
    }

    table.shop-fields th.created-by {
    }

    table.shop-fields th.last-modified {
    }

    table.shop-fields th.last-modified-by {
    }

    table.shop-fields th.old-shop-id {
    }

    table.shop-fields td.tenant-id {
    }

    table.shop-fields td.area-id {
    }

    table.shop-fields td.shop-code {
    }

    table.shop-fields td.lowered-shop-code {
    }

    table.shop-fields td.shop-name {
    }

    table.shop-fields td.description {
    }

    table.shop-fields td.display-order {
    }

    table.shop-fields td.is-hidden {
    }

    table.shop-fields td.is-deleted {
    }

    table.shop-fields td.created {
    }

    table.shop-fields td.created-by {
    }

    table.shop-fields td.last-modified {
    }

    table.shop-fields td.last-modified-by {
    }

    table.shop-fields td.old-shop-id {
    }

/*
    Supervisors
*/

table.supervisor-list {
}

    table.supervisor-list th.tenant-id {
    }

    table.supervisor-list th.supervisor-code {
    }

    table.supervisor-list th.lowered-supervisor-code {
    }

    table.supervisor-list th.supervisor-name {
    }

    table.supervisor-list th.description {
    }

    table.supervisor-list th.display-order {
    }

    table.supervisor-list th.is-hidden {
    }

    table.supervisor-list th.is-deleted {
    }

    table.supervisor-list th.created {
    }

    table.supervisor-list th.created-by {
    }

    table.supervisor-list th.last-modified {
    }

    table.supervisor-list th.last-modified-by {
    }

    table.supervisor-list td.tenant-id {
    }

    table.supervisor-list td.supervisor-code {
    }

    table.supervisor-list td.lowered-supervisor-code {
    }

    table.supervisor-list td.supervisor-name {
    }

    table.supervisor-list td.description {
    }

    table.supervisor-list td.display-order {
    }

    table.supervisor-list td.is-hidden {
    }

    table.supervisor-list td.is-deleted {
    }

    table.supervisor-list td.created {
    }

    table.supervisor-list td.created-by {
    }

    table.supervisor-list td.last-modified {
    }

    table.supervisor-list td.last-modified-by {
    }

table.supervisor-fields {
}

    table.supervisor-fields th.tenant-id {
    }

    table.supervisor-fields th.supervisor-code {
    }

    table.supervisor-fields th.lowered-supervisor-code {
    }

    table.supervisor-fields th.supervisor-name {
    }

    table.supervisor-fields th.description {
    }

    table.supervisor-fields th.display-order {
    }

    table.supervisor-fields th.is-hidden {
    }

    table.supervisor-fields th.is-deleted {
    }

    table.supervisor-fields th.created {
    }

    table.supervisor-fields th.created-by {
    }

    table.supervisor-fields th.last-modified {
    }

    table.supervisor-fields th.last-modified-by {
    }

    table.supervisor-fields td.tenant-id {
    }

    table.supervisor-fields td.supervisor-code {
    }

    table.supervisor-fields td.lowered-supervisor-code {
    }

    table.supervisor-fields td.supervisor-name {
    }

    table.supervisor-fields td.description {
    }

    table.supervisor-fields td.display-order {
    }

    table.supervisor-fields td.is-hidden {
    }

    table.supervisor-fields td.is-deleted {
    }

    table.supervisor-fields td.created {
    }

    table.supervisor-fields td.created-by {
    }

    table.supervisor-fields td.last-modified {
    }

    table.supervisor-fields td.last-modified-by {
    }

/*
    Categories
*/

table .category-list {
}

    table.category-list th.application-id {
    }

    table.category-list th.tenant-id {
    }

    table.category-list th.category-code {
    }

    table.category-list th.lowered-category-code {
    }

    table.category-list th.category-name {
    }

    table.category-list th.description {
    }

    table.category-list th.display-order {
    }

    table.category-list th.is-hidden {
    }

    table.category-list th.is-deleted {
    }

    table.category-list th.created {
    }

    table.category-list th.created-by {
    }

    table.category-list th.last-modified {
    }

    table.category-list th.last-modified-by {
    }

    table.category-list th.old-category-id {
    }

    table.category-list td.application-id {
    }

    table.category-list td.tenant-id {
    }

    table.category-list td.category-code {
    }

    table.category-list td.lowered-category-code {
    }

    table.category-list td.category-name {
    }

    table.category-list td.description {
    }

    table.category-list td.display-order {
    }

    table.category-list td.is-hidden {
    }

    table.category-list td.is-deleted {
    }

    table.category-list td.created {
    }

    table.category-list td.created-by {
    }

    table.category-list td.last-modified {
    }

    table.category-list td.last-modified-by {
    }

    table.category-list td.old-category-id {
    }

table.category-fields {
}

    table.category-fields th.application-id {
    }

    table.category-fields th.tenant-id {
    }

    table.category-fields th.category-code {
    }

    table.category-fields th.lowered-category-code {
    }

    table.category-fields th.category-name {
    }

    table.category-fields th.description {
    }

    table.category-fields th.display-order {
    }

    table.category-fields th.is-hidden {
    }

    table.category-fields th.is-deleted {
    }

    table.category-fields th.created {
    }

    table.category-fields th.created-by {
    }

    table.category-fields th.last-modified {
    }

    table.category-fields th.last-modified-by {
    }

    table.category-fields th.old-category-id {
    }

    table.category-fields td.application-id {
    }

    table.category-fields td.tenant-id {
    }

    table.category-fields td.category-code {
    }

    table.category-fields td.lowered-category-code {
    }

    table.category-fields td.category-name {
    }

    table.category-fields td.description {
    }

    table.category-fields td.display-order {
    }

    table.category-fields td.is-hidden {
    }

    table.category-fields td.is-deleted {
    }

    table.category-fields td.created {
    }

    table.category-fields td.created-by {
    }

    table.category-fields td.last-modified {
    }

    table.category-fields td.last-modified-by {
    }

    table.category-fields td.old-category-id {
    }

/**/
/**/
/**/

table.list {
    width: 100%;
}

    table.list th {
        border: 1px solid #ccc;
        background: #bdf;
    }

        table.list th.commands {
            width: 1%;
            white-space: nowrap;
        }

    table.list td {
        border: 1px solid #ccc;
    }

        table.list td.commands {
            white-space: nowrap;
        }

table.fixed-hader {
}

    table.fixed-hader thead {
        display: block;
    }

    table.fixed-hader tbody {
        display: block;
        overflow-y: scroll;
        height: 500px;
    }

table.fields {
    width: 100%;
}

    table.fields th {
        border: 1px solid #ccc;
        background: #eef;
    }

        table.fields th span.required {
            color: #999;
            font-size: smaller;
        }

    table .fields td {
        border: 1px solid #ccc;
    }

table.timestamp {
    width: 100%;
    margin: 1em 0;
}

    table.timestamp th {
        width: 1%;
    }

    table.timestamp td {
        width: 24%;
    }

/*
    Shops
*/

table.shop-list {
}

    table.shop-list th.area-name {
        background: #eef;
        font-weight: bold;
        text-align: left;
    }

    table.shop-list th.shop-code {
        width: 10%;
    }

    table.shop-list th.shop-name {
        width: 25%;
    }

    table.shop-list th.description {
        width: auto;
    }

    table.shop-list td.shop-code {
    }

    table.shop-list td.shop-name {
    }

    table.shop-list td.description {
    }

/*
    Items
*/

div.item-container {
    display: flex;
}

    div.item-container div.category-list {
        flex-shrink: 0;
        width: 180px;
        margin-right: 20px;
    }

    div.item-container div.item-list {
        flex-grow: 1;
    }

table.item-list {
}

    table.item-list th.category-name {
        background: #eef;
        font-weight: bold;
        text-align: left;
    }

    table.item-list th.subject {
        width: 20%;
    }

    table.item-list th.body {
        width: auto;
    }

    table.item-list th.publisher {
        width: 10%;
    }

    table.item-list th.last-modified-by {
        width: 10%;
    }

    table.item-list td.subject {
        width: 20%;
    }

    table.item-list td.body {
        width: auto;
    }

    table.item-list td.publisher {
        width: 10%;
        text-align: center;
    }

    table.item-list td.confirmed {
        width: 10%;
        text-align: center;
    }

table.item-fields {
}

    table.item-fields th.category {
    }

    table.item-fields th.subject {
    }

    table.item-fields th.body .multi-line {
    }

    table.item-fields th.body {
    }

    table.item-fields td.category {
    }

    table.item-fields td.subject {
    }

    table.item-fields td.body {
    }

table.item-histories {
}

    table.item-histories th.modified {
        width: 1%;
        white-space: nowrap;
    }

    table.item-histories th.category-name {
        width: 10%;
        white-space: nowrap;
    }

    table.item-histories th.subject {
        width: 10%;
        white-space: nowrap;
    }

    table.item-histories th.body {
        width: auto;
        white-space: nowrap;
    }

    table.item-histories th.conditions {
        width: 15%;
        white-space: nowrap;
    }

    table.item-histories th.is-document {
        width: 7%;
        white-space: nowrap;
    }

    table.item-histories th.confirmed {
        width: 7%;
        white-space: nowrap;
    }

    table.item-histories th.confirmed-by {
        width: 7%;
        white-space: nowrap;
    }

    table.item-histories th.supervisor {
        width: 7%;
        white-space: nowrap;
    }

    table.item-histories th.modified-by {
        width: 7%;
        white-space: nowrap;
    }

    table.item-histories td.modified {
        width: 1%;
        white-space: nowrap;
        text-align: center;
    }

    table.item-histories td.category-name {
    }

    table.item-histories td.subject {
    }

    table.item-histories td.body {
    }

    table.item-histories td.conditions {
    }

    table.item-histories td.is-document {
        text-align: center;
    }

    table.item-histories td.confirmed {
        text-align: center;
    }

    table.item-histories td.confirmed-by {
        text-align: center;
    }

    table.item-histories td.supervisor {
        text-align: center;
    }

    table.item-histories td.modified-by {
        text-align: center;
    }

/*
    Words
*/

div.word-container {
    display: flex;
}

    div.word-container div.category-list {
        flex-shrink: 0;
        width: 180px;
        margin-right: 20px;
    }

    div.word-container div.word-list {
        flex-grow: 1;
    }

table.word-list {
}

    table.word-list th.category-name {
        background: #eef;
        font-weight: bold;
        text-align: left;
    }

    table.word-list th.subject {
        width: 25%;
    }

    table.word-list th.body {
        width: auto;
    }

    table.word-list th.publisher {
        width: 10%;
    }

    table.word-list th.confirmed {
        width: 10%;
    }

    table.word-list td.subject {
        width: 25%;
    }

    table.word-list td.body {
        width: auto;
    }

    table.word-list td.publisher {
        width: 10%;
        text-align: center;
    }

    table.word-list td.confirmed {
        width: 10%;
        text-align: center;
    }

table.item2-fields {
}

    table.item2-fields th.category {
    }

    table.item2-fields th.subject {
    }

    table.item2-fields th.body {
    }

    table.item2-fields td.category {
    }

    table.item2-fields td.subject {
    }

    table.item2-fields td.body {
    }

table.item2-histories {
}

    table.item2-histories th.modified {
        width: 1%;
        white-space: nowrap;
    }

    table.item2-histories th.category-name {
        width: 10%;
        white-space: nowrap;
    }

    table.item2-histories th.subject {
        width: 15%;
        white-space: nowrap;
    }

    table.item2-histories th.subject2 {
        width: 15%;
        white-space: nowrap;
    }

    table.item2-histories th.body {
        width: auto;
        white-space: nowrap;
    }

    table.item2-histories th.confirmed {
        width: 7%;
        white-space: nowrap;
    }

    table.item2-histories th.confirmed-by {
        width: 7%;
        white-space: nowrap;
    }

    table.item2-histories th.supervisor {
        width: 7%;
        white-space: nowrap;
    }

    table.item2-histories th.modified-by {
        width: 7%;
        white-space: nowrap;
    }

    table.item2-histories td.modified {
        width: 1%;
        white-space: nowrap;
        text-align: center;
    }

    table.item2-histories td.category-name {
    }

    table.item2-histories td.subject {
    }

    table.item2-histories td.subject2 {
    }

    table.item2-histories td.body {
    }

    table.item2-histories td.confirmed {
        text-align: center;
    }

    table.item2-histories td.confirmed-by {
        text-align: center;
    }

    table.item2-histories td.supervisor {
        text-align: center;
    }

    table.item2-histories td.modified-by {
        text-align: center;
    }

/*
        Login
    */

div.login-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    background: #69f url(Background.png) repeat-x
}

    div.login-container div.login-dialog {
        width: 300px;
        border: 1px solid #ccc;
        background: #fff;
    }

    div.login-container div.title {
        margin-bottom: 1em;
        border-bottom: 1px solid #ccc;
        background: #dbf;
        text-align: center;
    }

    div.login-container div.login {
        text-align: center;
    }


/**/
/**/
/**/

* {
    font-family: Meiryo;
}

html, head, body {
    margin: 0;
    padding: 0;
}

div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, table, th, td {
    margin: 0;
    padding: 0;
    text-align: left;
    font-weight: normal;
    font-size: 10pt;
}

ul, ol {
    list-style: none;
}

table {
    border-collapse: collapse;
}

th, td {
}

a {
    text-decoration: none;
}

input, select, textarea {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

    input[type=button], input[type=submit] {
        margin: 0;
        padding: 0;
        text-align: start;
        font-weight: normal;
        border: none;
    }

#dropArea {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100px;
    margin: 10px;
    border: 1px solid #999;
    text-align: center;
    background: #ffc;
}

    #dropArea label.button {
        display: inline-block;
        /*min-width: 120px;*/
        height: 24px;
        padding: 0 4px;
        border: solid 1px #ccc;
        background-image: url('Button.png');
        text-align: center;
        text-decoration: none;
        box-sizing: border-box;
    }

/**/
/**/
/**/
/*
    Common
*/
h2 {
    margin: 1em 0;
}

h3 {
    margin: 1em 0 0.5em;
}

p.commands {
    margin: 1em 0;
}

    p.commands .button {
        min-width: 120px;
    }

a.button, input[type="submit"] {
    display: inline-block;
    /*min-width: 120px;*/
    height: 24px;
    padding: 0 4px;
    border: solid 1px #ccc;
    background-image: url('Button.png');
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
    color: #00e;
}

div.validation-summary-errors {
    padding: 0px 7px;
    border: 1px solid #e5e5e5;
    background: #ffc;
    color: #f00;
}

table.list {
    width: 100%;
}

    table.list th {
        font-weight: bold;
        text-align: center;
    }

    table.list td {
    }

table.fields {
    width: 100%;
}

    table.fields th {
        width: 25%;
        height: 24px;
        padding: 4px 8px;
        border: solid 1px #ccc;
        background: #eef;
        box-sizing: border-box;
        font-weight: bold;
    }

    table.fields td {
        width: 75%;
        height: 24px;
        padding: 4px 8px;
        border: solid 1px #ccc;
        box-sizing: border-box;
    }

        table.fields td .field-validation-error {
            display: block;
            margin: 3px 0 0 0;
            padding: 0 3px;
            border: 1px solid #e5e5e5;
            background: #ffc;
            color: #f00;
        }

table.timestamp {
}

    table.timestamp th {
    }

    table.timestamp td {
    }

ul.shop-list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 1em 0;
}

    ul.shop-list li {
        flex-grow: 0;
        box-sizing: border-box;
        width: 25%;
        padding: 1px;
    }

        ul.shop-list li a {
            display: inline-block;
            box-sizing: border-box;
            width: 100%;
            padding: 3px;
            background: #efefff;
            border: 1px solid #ccc;
        }