/*--------------------------------------------------------------------------------------*/
/* sanitize.css v3.2.0 | CC0 1.0 Public Domain | github.com/10up/sanitize.css */
/*--------------------------------------------------------------------------------------*/
audio:not([controls]) {
    display: none; /* Chrome 44-, iOS 8+, Safari 9+ */
}

button {
    -webkit-appearance: button; /* iOS 8+ */
    overflow: visible; /* Internet Explorer 11- */
}

details {
    display: block; /* Edge 12+, Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+ */
}

html {
    /*-ms-overflow-style: -ms-autohiding-scrollbar; !* Edge 12+, Internet Explorer 11- *!*/
    /*overflow-y: scroll; !* All browsers without overlaying scrollbars *!*/
    -webkit-text-size-adjust: 100%; /* iOS 8+ */
}

input {
    -webkit-border-radius: 0 /* iOS 8+ */
}

input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button; /* iOS 8+ */
}

input[type="number"] {
    /*width: auto; /* Firefox 36+ */
}

input[type="search"] {
    -webkit-appearance: textfield; /* Chrome 45+, Safari 9+ */
}

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none; /* Chrome 45+, Safari 9+ */
}

main {
    display: block; /* Android 4.3-, Internet Explorer 11-, Windows Phone 8.1+ */
}

pre {
    overflow: auto; /* Internet Explorer 11- */
}

progress {
    display: inline-block; /* Internet Explorer 11-, Windows Phone 8.1+ */
}

small {
    font-size: 75%; /* All browsers */
}

summary {
    display: block; /* Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+ */
}

svg:not(:root) {
    overflow: hidden; /* Internet Explorer 11- */
}

template {
    display: none; /* Android 4.3-, Internet Explorer 11-, iOS 7-, Safari 7-, Windows Phone 8.1+ */
}

textarea {
    overflow: auto; /* Edge 12+, Internet Explorer 11- */
}

[hidden] {
    display: none; /* Internet Explorer 10- */
}

*, :before, :after {
    box-sizing: inherit;
}

* {
    font-size: inherit;
    line-height: inherit;
}

:before, :after {
    text-decoration: inherit;
    vertical-align: inherit;
}

*, :before, :after {
    border: 0 solid;
}

* {
    background-repeat: no-repeat;
    margin: 0;
    padding: 0;
}

:root {
    background-color: #ffffff;
    box-sizing: border-box;
    color: #000000;
    cursor: default;
    font: 100%/1.5 sans-serif;
}

a {
    text-decoration: none;
}

audio, canvas, iframe, img, svg, video {
    vertical-align: middle;
}

button, input, select, textarea {
    background-color: transparent;
}

button, input, select, textarea {
    color: inherit;
    font-family: inherit;
    font-style: inherit;
    font-weight: inherit;
}

textarea, button, [type="button"], [type="date"], [type="datetime"], [type="datetime-local"], [type="email"],
[type="month"], [type="number"], [type="password"], [type="reset"], [type="search"], [type="submit"],
[type="tel"], [type="text"], [type="time"], [type="url"], [type="week"], select, textarea {
    min-height: 24px;
}

code, kbd, pre, samp {
    font-family: monospace, monospace;
}

nav ol, nav ul {
    list-style: none;
}

select {
    -moz-appearance: none; /* Firefox 40+ */
    -webkit-appearance: none /* Chrome 45+ */
}

select::-ms-expand {
    display: none; /* Edge 12+, Internet Explorer 11- */
}

select::-ms-value {
    color: currentColor; /* Edge 12+, Internet Explorer 11- */
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

textarea {
    resize: vertical;
}

::-moz-selection {
    background-color: #b3d4fc; /* required when declaring ::selection */
    color: #ffffff;
    text-shadow: none;
}

::selection {
    background-color: #b3d4fc; /* required when declaring ::selection */
    color: #ffffff;
    text-shadow: none;
}



[aria-busy="true"] {
    cursor: progress;
}

[aria-controls] {
    cursor: pointer;
}

[aria-disabled] {
    cursor: default;
}

[hidden][aria-hidden="false"] {
    clip: rect(0 0 0 0);
    display: inherit;
    position: absolute
}

[hidden][aria-hidden="false"]:focus {
    clip: auto;
}

a, area, button, input, label, select, textarea, [tabindex] {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

/*--------------------------------------------------------------------------------------*/
/* 24 COLUMN | RESPONSIVE GRID SYSTEM | http://responsive.gs */
/*--------------------------------------------------------------------------------------*/
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    *behavior: url("../plugin/respond/boxsizing.htc");
}

.container {
    margin: 0 auto;
    padding: 0;
    background-color: #5d5d5d;
}

body:after, .container:after, .row:after, .col:after, .clr:after, .group:after {
    content: "";
    display: table;
    clear: both;
}

.row {
    padding-bottom: 0;
}

.col {
    display: block;
    float: left;
    width: 100%;
}

.gutters > .col {
    margin-left: 4%;
}

.gutters > .col:first-child {
    margin-left: 0;
}

.span-1 {
    width: 4.16666666667%;
}

.span-2 {
    width: 8.33333333333%;
}

.span-3 {
    width: 12.5%;
}

.span-4 {
    width: 16.6666666667%;
}

.span-5 {
    width: 20.8333333333%;
}

.span-6 {
    width: 25%;
}

.span-7 {
    width: 29.1666666667%;
}

.span-8 {
    width: 33.3333333333%;
}

.span-9 {
    width: 37.5%;
}

.span-10 {
    width: 41.6666666667%;
}

.span-11 {
    width: 45.8333333333%;
}

.span-12 {
    width: 50%;
}

.span-13 {
    width: 54.1666666667%;
}

.span-14 {
    width: 58.3333333333%;
}

.span-15 {
    width: 62.5%;
}

.span-16 {
    width: 66.6666666667%;
}

.span-17 {
    width: 70.8333333333%;
}

.span-18 {
    width: 75%;
}

.span-19 {
    width: 79.1666666667%;
}

.span-20 {
    width: 83.3333333333%;
}

.span-21 {
    width: 87.5%;
}

.span-22 {
    width: 91.6666666667%;
}

.span-23 {
    width: 95.8333333333%;
}

.span-24 {
    width: 100%;
}

.gutters > .span-1 {
    width: 0.33%;
}

.gutters > .span-2 {
    width: 4.66%;
}

.gutters > .span-3 {
    width: 9.0%;
}

.gutters > .span-4 {
    width: 13.33%;
}

.gutters > .span-5 {
    width: 17.66%;
}

.gutters > .span-6 {
    width: 22.0%;
}

.gutters > .span-7 {
    width: 26.33%;
}

.gutters > .span-8 {
    width: 30.66%;
}

.gutters > .span-9 {
    width: 35.0%;
}

.gutters > .span-10 {
    width: 39.33%;
}

.gutters > .span-11 {
    width: 43.67%;
}

.gutters > .span-12 {
    width: 48.0%;
}

.gutters > .span-13 {
    width: 52.33%;
}

.gutters > .span-14 {
    width: 56.67%;
}

.gutters > .span-15 {
    width: 61%;
}

.gutters > .span-16 {
    width: 65.34%;
}

.gutters > .span-17 {
    width: 69.67%;
}

.gutters > .span-18 {
    width: 74%;
}

.gutters > .span-19 {
    width: 78.34%;
}

.gutters > .span-20 {
    width: 82.67%;
}

.gutters > .span-21 {
    width: 87%;
}

.gutters > .span-22 {
    width: 91.34%;
}

.gutters > .span-23 {
    width: 95.67%;
}

.gutters > .span-24 {
    width: 100%;
}

.offset-1 {
    margin-left: 4.1666666667% !important;
}

.offset-2 {
    margin-left: 8.3333333333% !important;
}

.offset-3 {
    margin-left: 12.5% !important;
}

.offset-4 {
    margin-left: 16.6666666667% !important;
}

.offset-5 {
    margin-left: 20.8333333333% !important;
}

.offset-6 {
    margin-left: 25% !important;
}

.offset-7 {
    margin-left: 29.1666666667% !important;
}

.offset-8 {
    margin-left: 33.3333333333% !important;
}

.offset-9 {
    margin-left: 37.5% !important;
}

.offset-10 {
    margin-left: 41.6666666667% !important;
}

.offset-11 {
    margin-left: 45.8333333333% !important;
}

.offset-12 {
    margin-left: 50% !important;
}

.offset-13 {
    width: 54.1666666667% !important;
}

.offset-14 {
    width: 58.3333333333% !important;
}

.offset-15 {
    width: 62.5% !important;
}

.offset-16 {
    width: 66.6666666667% !important;
}

.offset-17 {
    width: 70.8333333333% !important;
}

.offset-18 {
    width: 75% !important;
}

.offset-19 {
    width: 79.1666666667% !important;
}

.offset-20 {
    width: 83.3333333333% !important;
}

.offset-21 {
    width: 87.5% !important;
}

.offset-22 {
    width: 91.6666666667% !important;
}

.offset-23 {
    width: 95.8333333333% !important;
}

.gutters > .offset-1 {
    margin-left: 4.33% !important;
}

.gutters > .offset-2 {
    margin-left: 8.66% !important;
}

.gutters > .offset-3 {
    margin-left: 13% !important;
}

.gutters > .offset-4 {
    margin-left: 17.33% !important;
}

.gutters > .offset-5 {
    margin-left: 21.66% !important;
}

.gutters > .offset-6 {
    margin-left: 26% !important;
}

.gutters > .offset-7 {
    margin-left: 30.33% !important;
}

.gutters > .offset-8 {
    margin-left: 34.66% !important;
}

.gutters > .offset-9 {
    margin-left: 39% !important;
}

.gutters > .offset-10 {
    margin-left: 43.33% !important;
}

.gutters > .offset-11 {
    margin-left: 47.67% !important;
}

.gutters > .offset-12 {
    margin-left: 52% !important;
}

.gutters > .offset-13 {
    margin-left: 56.33% !important;
}

.gutters > .offset-14 {
    margin-left: 60.67% !important;
}

.gutters > .offset-15 {
    margin-left: 65% !important;
}

.gutters > .offset-16 {
    margin-left: 69.34% !important;
}

.gutters > .offset-17 {
    margin-left: 73.67% !important;
}

.gutters > .offset-18 {
    margin-left: 78% !important;
}

.gutters > .offset-19 {
    margin-left: 82.34% !important;
}

.gutters > .offset-20 {
    margin-left: 86.67% !important;
}

.gutters > .offset-21 {
    margin-left: 91% !important;
}

.gutters > .offset-22 {
    margin-left: 95.34% !important;
}

.gutters > .offset-23 {
    margin-left: 99.67% !important;
}

/*--------------------------------------------------------------------------------------*/
/* Tags
/*--------------------------------------------------------------------------------------*/
html {
    width: 100%;
    height: 100%;
    background-color: #f7f7f7;
}

body {
    position: relative;
    width: 100%;
/*     min-width: 1280px; */
    height: 100%;
    background-color: #f7f7f7;
    color: #6a6d6c;
    font-size: 0.9rem;
    font-family: Helvetica, Arial, "Hiragino Kaku Gothic Pro", "郢晏�ｵﾎ帷ｹｧ�ｽｮ郢晄焔�ｽｧ蛛ｵ縺� Pro", "Meiryo", "郢晢ｽ｡郢ｧ�ｽ､郢晢ｽｪ郢ｧ�ｽｪ", "MS PGothic", sans-serif;
    word-wrap: break-word;
    overflow-wrap: break-word;
    /*overflow: auto;*/
}

body {
    min-width: 1280px;
}

::selection {
    background-color: #eeeeee;
    color: #5d5d5d;
}

::-moz-selection {
    background-color: #eeeeee;
    color: #5d5d5d;
}

/* Links -------------------*/
a {
    outline: none;
    color: #1ec795;
    text-decoration: none;
}

a:hover, a:active {
    color: #00e7a3;
    text-decoration: none;
}

/* Forms -------------------
form {
    height: 100%;
}*/


input, select, textarea {
    padding: 0 8px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background-color: #fff;
    line-height: 1.6rem;
    outline: 0;
}

/* Input Button Set */
.input-btn-set-left {
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 4px 4px 4px;
}

.input-btn-set-right {
  width: 75px !important;
    height: 1.5rem;
    background-color: #1ec795;
    cursor: pointer;

    -webkit-border-radius: 0 4px 4px 0 !important;
    -moz-border-radius: 0 4px 4px 0 !important;
    border-radius: 0 4px 4px 0 !important;
}

select {
    background: #fff url("../image/img-pulldown-arrow.png") no-repeat 95% 50%;
    padding-right: 5%;
    cursor: pointer;
}

option {
    padding: 4px 10px 2px 10px;
    border: none;
    border-top: 1px dotted #aeaeae;
    background-color: #fff;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
/*     transition: all 0.3s ease-out; */
    transition: all 0s ease-out;
    cursor: pointer;
}

option:nth-of-type(1) {
    border: none;
}

option:hover {
    color: #00e7a3;
    background-color: transparent;
}

option:active {
    color: #00e7a3;
    background-color: transparent;
}

select option[selected] {
    background-color: #00e7a3;
}

select[multiple] {
    padding: 8px 0;
    background: #ffffff none;
    font-size: 0.8rem;
    line-height: 1.2;
    overflow: auto;
}

select[multiple] option {
    -webkit-transition: all 0.0s ease-out;
    -moz-transition: all 0.0s ease-out;
    transition: all 0.0s ease-out;
}

input[type="radio"], input[type="checkbox"] {
    margin-right: 4px;
    vertical-align: middle;
    cursor: pointer;
}

input[type="radio"] + label, input[type="checkbox"] + label {
    cursor: pointer;
}

.radio {
    display: inline-block;
}

input[type="file"] {
    display: none;
    cursor: pointer;
}

.input-file input[type="text"] {
    width: -webkit-calc(100% - 80px) !important;
    width: calc(100% - 80px) !important;
    height: 1.5rem;
}

.input-file button[type="button"] {
    width: 75px !important;
    height: 1.5rem;
    background-color: #1ec795;
    cursor: pointer;
}

label {
    cursor: pointer;
}

button {
    outline: 0;
}

/* Transition */
a, a:hover, a:active, a:before, a:after, a:hover:before, a:hover:after, a:active:before, a:active:after,
button, button:hover, button:active, button:before, button:after, button:hover:before, button:hover:after, button:active:before, button:active:after,
h1, h2, h3, h4, h5, h6, p, blockquote, table, caption, th, td, img {
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

/*--------------------------------------------------------------------------------------*/
/* Blocks
/*--------------------------------------------------------------------------------------*/
/* Container -------------------------------------------------------------------------- */
.container {
    float: left;
    /*width: -webkit-calc(100% - 48px);*/
    /*width: calc(100% - 48px);*/
    width: 100%;
    height: 100%;
    background-color: #f7f7f7;
}


/* Main ------------------------------------------------------------------------------- */
/* Contents_Header ---------------------------------------*/
.contents-header {
    position: fixed;
    top: 0;
    height: 40px;
    left: 150px;
    right: 0;
    z-index: 49;
    /* z-index: 999; */
    /*
    width: -webkit-calc(100% - 48px);
    width: calc(100% - 48px);*/
    min-width: 1130px;
    background-color: #5e605c;
}

/* Header_Left -------------*/
.header-left {
    float: left;
    padding: 5px 0 5px 0;
    width: -webkit-calc(100% - 260px);
    width: calc(100% - 260px);
}

/* Tools */
.header-tools li {
    display: inline-block;
    margin-right: 8px;
    height: 24px;
    line-height: 24px;
}

.header-tools li:last-child {
    margin-right: 0;
}

.header-tools li a {
    display: block;
    padding: 0 8px 0 32px;
    height: 24px;
    background: #e2e2e2 no-repeat 8px 50%;
    color: #636463;
    font-size: 0.75rem;
    font-weight: bold;
    line-height: 24px;
}

.header-tools li a:hover {
    background-color: #5e605c !important;
}

/* Header_Right ------------*/
.div-search {
    width: 650px;
    display: inline-block;
    padding: 5px 0;
}

.div-search select {
    width: 100px;
    min-height: 30px;
    line-height: 30px;
}

.div-search input[type="search"] {
    width: 350px;
    height: 30px;
    line-height: 30px;
}

.div-search button[type="submit"] {
    width: 36px;
    height: 30px;
}

.div-search button[type="submit"]:hover {
    background-color: #22dea6;
}

.div-search button[type="submit"] img {
    margin-top: -2px;
}

/* Field -------------------------------------------------*/
.field { /* top + 122px */
    padding: 65px 25px 25px 175px;
    height: 100%;
    overflow: auto;
}

/* Left_Menu --------------------------------------------------------------------------*/

.right-account {
    margin-top: 5px;
    padding-top: 5px;
    padding-left: 8px;
    color: #fff;
    height: 50px;
}

.right-account div {
    float: left;
    margin: 0 auto;
    height: 45px;
}

.current-title {
    padding-left: 0;
    padding-top: 7px;
    font-size: 17px;
}

/* Slide_Menu --------------------------------------------------------------------------*/
/*
.slide-menu aside {
*/
.slide-menu-aside {
  position: fixed;
    top: 0;
    padding-top: 20px;
    left: -340px;
    width: 295px;
    height: 100%;
    z-index: 37;
    background: #e2e2e2;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.slide-menu .slide-open {
    left: 150px;
}

/* Visible_Area ------------------------------------------*/
.visible-area {
    padding: 0 12px;
    width: 292px;
    height: 100%;
    background-color: #e2e2e2;
}

.visible-area ul,
.visible-area dl {
    margin-top: 12px;
    border-top: 1px dotted #aeaeae;
}

.visible-area ul:nth-of-type(1),
.visible-area dl:nth-of-type(1) {
    border: none;
}

.visible-area dd ul:nth-of-type(1) {
    margin-top: 0;
}

.visible-area dd ul.li-span-12 li:nth-of-type(1),
.visible-area dd ul.li-span-12 li:nth-of-type(2) {
    margin-top: 0;
}

.visible-area li {
    margin-top: 12px;
    list-style-type: none;
}

.visible-area li a {
    color: #6a6d6c;
}

.visible-area li a:hover, .visible-area li a:active {
    color: #00e7a3;
    text-decoration: none;
}

.visible-area dt {
    margin-top: 12px;
    font-size: 0.75rem;
    font-weight: bold;
}

.visible-area dd {
    margin-top: 8px;
    font-size: 0.8rem;
}

.visible-area dt + dd {
    margin-top: 2px;
}

.visible-area .li-span-12 li {
    display: inline-block;
    width: 49%;
    list-style-type: none;
}

/* Modal -------------------------------------------------*/
.modal {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 50;
    display: none;
    overflow: hidden;
}

.overLay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 50;
    width: 100%;
    height: 100vh;
    background: rgba(200, 200, 200, 0.9);
}

.modal .inner {
    position: absolute;
    z-index: 60;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-bottom: 16px;
    background-color: #eee;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 0 12px 2px #afafaf;
    -moz-box-shadow: 0 0 12px 2px #afafaf;
    box-shadow: 0 0 12px 2px #afafaf;
}

.modal .head {
    height: 2.5rem;
    background-color: #5e605c;
    -webkit-border-radius: 8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    border-radius: 8px 8px 0 0;
    color: #fff;
    font-weight: bold;
    text-align: center;
    line-height: 2.5rem;
}

.modal .group {
    margin-top: 16px;
    padding: 0 24px 16px 24px;
    height: -webkit-calc(100% - 2.5rem);
    height: calc(100% - 2.5rem);
}

.modal .btn-modal-close {
    position: absolute;
    top: -1rem;
    right: -1rem;
    width: 2rem;
    height: 2rem;
    -webkit-border-radius: 2rem;
    -moz-border-radius: 2rem;
    border-radius: 2rem;
    background-color: #fff;
    text-align: center;
    line-height: 2rem;
}

.modal .btn-modal-close a {
    display: block;
    font-size: 2rem;
}

/* Modal_Table */
.modal table th {
    border-top: 1px solid #d3d3d3;
}

/*--------------------------------------------------------------------------------------*/
/* Parts
/*--------------------------------------------------------------------------------------*/
/* Float_Dl ----------------------------------------------*/
.float-dl {
    width: 100%;
}

.float-dl dt {
    clear: both;
    float: left;
    display: block;
    margin-top: 8px;
    padding-top: 2px;
    width: 40%;
    font-size: 0.8rem;
    font-weight: bold;
}

.float-dl dd {
    float: right;
    display: block;
    margin-top: 8px;
    width: 60%;
}

.float-dl dt:nth-of-type(1),
.float-dl dd:nth-of-type(1) {
    margin-top: 0;
}

/* Buttons -----------------------------------------------*/
.btn {
    display: inline-block;
    height: 44px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background-color: #11d49a;
    cursor: pointer;
    border: 0;
    padding: 0;
    margin: 0;
}

.btn:hover {
    background-color: #22dea6;
}

/* Size */
.btn-thin {
    height: 26px;
}

/* Color */
.btn-nega {
    background-color: #9fbbae;
}

.btn-nega:hover {
    background-color: #aecebf;
}

.btn-gray {
    background-color: #d4d4d4;
}

.btn-gray:hover {
    background-color: #eee;
}

.btn-folder {
    width: 60px;
    height: 36px;
    background-color: #1ec795;
}

.btn-folder:hover {
    background-color: #00e7a3;
}

/* Btn_Set -----------------*/
.btn-set {
    margin: 24px auto 0 auto;
    text-align: center;
}

/* FIND --------------------*/
/* Add + Del */
.btn-ctrl li {
    display: inline-block;
    width: 22px;
    height: 22px;
    list-style-type: none;
}

.btn-ctrl li:first-child {
    margin-right: 8px;
}

.btn-ctrl .btn {
    margin: 8px 8px 0 0;
    padding: 4px;
    width: 22px;
    height: 22px;
    background-color: #11d49a;
}

.btn-ctrl .btn:hover {
    background-color: #22dea6;
}

.btn-ctrl .btn img {
    vertical-align: top;
}

/* Clear + Search */
.visible-area .group {
    margin-top: 24px;
}

.btn-align-left {
    float: left;
}

.btn-align-right {
  margin-left: 10px;
    float: right;
}

.btn-clear {
    width: 44px;
    background-color: #9fbbae;
}

.btn-clear:hover {
    background-color: #aecebf;
}

.btn-search-l {
    width: 152px;
    height: 44px;
    background-color: #11d49a;
}

.btn-search-l:hover {
    background-color: #22dea6;
}

.btn-submit {
    /*  margin-top: 16px; */
    width: 152px;
    height: 44px;
    background-color: #11d49a;
}

.btn-submit:hover {
    background-color: #22dea6;
}

/* Cancel */
.btn-cancel {
    width: 50px;
}

/* USER --------------------*/
.user-add .btn-set {
    width: 240px;
}

.user-add .btn-set-02 {
    margin-top: 8px;
    text-align: right;
}

.user-add .btn-set-02 div {
    display: inline-block;
    margin-right: 8px;
    height: 26px;
}

.user-add .btn-set-02 div:last-child {
    margin-right: 0;
}

.user-add .btn-set-02 .btn {
    width: 70px
}

/* GROUP -------------------*/
.btn-add {
    padding: 0 8px;
}

.btn-change {
    padding: 0 8px;
}

.group-settings .btn-set-02 {
    margin-top: 8px;
    text-align: right;
}

.group-settings .btn-set-02 div {
    display: inline-block;
    margin-right: 8px;
    height: 26px;
}

.group-settings .btn-set-02 div:last-child {
    margin-right: 0;
}

/* Classies ----------------------------------------------*/
/* Align */
.align-center {
    text-align: center !important;
}

.align-right {
    text-align: right !important;
}

/* Font_Size */
.font-1_8rem {
    font-size: 1.8rem !important;
}

/* Size */
.size-span-2 {
    width: 6.25% !important;
}

.size-span-4 {
    width: 12.5% !important;
}

.size-span-6 {
    width: 25% !important;
}

.size-span-8 {
    width: 33% !important;
}

.size-span-10 {
    width: 39.25% !important;
}

.size-span-12 {
    width: 50% !important;
}

.size-span-18 {
    width: 75% !important;
}

.size-span-24 {
    width: 100% !important;
}

/* Margin */
.top-18 {
    margin-top: 18px !important;
}

/*--------------------------------------------------------------------------------------*/
/* Independ
/*--------------------------------------------------------------------------------------*/
/* Tools -------------------------------------------------------------------------------*/
/* FIND --------------------*/
.tools-view {
    background-image: url("../image/icon-tools-view.png");
}

.tools-print {
    background-image: url("../image/icon-tools-print.png");
}

.tools-delete {
    background-image: url("../image/icon-tools-delete.png");
}

.tools-linkset {
    background-image: url("../image/icon-tools-linkset.png");
}

.tools-pass {
    background-image: url("../image/icon-tools-pass.png");
}

/* SIGN --------------------*/
/* INPUT_FILE --------------*/
/* TIMESTAMP ---------------*/
/* USER --------------------*/
.tools-add {
    background-image: url("../image/icon-tools-add.png");
}

/* GROUP -------------------*/
/* RANK --------------------*/
/* CUSTOMER ----------------*/
/* SYSTEM ------------------*/
.tools-key {
    background-image: url("../image/icon-tools-key.png");
}

/* LOG ---------------------*/
.tools-csv {
    background-image: url("../image/icon-tools-csv.png");
}

/* Table -------------------------------------------------------------------------------*/

/* SIGN --------------------*/
/* INPUT_FILE --------------*/
/* TIMESTAMP ---------------*/
/* USER --------------------*/
.cell-user-id {
    min-width: 6rem;
}

.cell-user-name {
    min-width: 6rem;
}

.cell-rank {
    width: auto;
}

.cell-state {
    width: 4rem;
}

/* GROUP -------------------*/
.cell-settings {
    width: 120px;
}

/* RANK --------------------*/
.cell-rank-name {
    min-width: 6rem;
}

.cell-delete {
    min-width: 3rem;
}

/* CUSTOMER ----------------*/
/* SYSTEM ------------------*/
.cell-category {
    width: 12rem;
}

.cell-date-full {
    width: 12rem;
}

.cell-states {
    width: 6rem;
}

.cell-group-id {
    width: 12rem;
}

.cell-ip {
    width: 12rem;
}

.cell-massage {
    width: 32rem;
}

/* Field -------------------------------------------------------------------------------*/
/* SYSTEM ------------------*/
.table-system input {
    text-align: center;
}

.table-log th {
    text-align: center;
}

.table-hover tbody tr:hover {
    background-color: #eee;
    cursor: pointer;
}

/* Modal -------------------------------------------------------------------------------*/
/* FIND --------------------------------------------------*/
/* Pass --------------------*/
.modal-pass .inner {
    width: 600px;
    height: 290px;
}

.modal-pass dt {
    float: left;
    width: 40%;
}

.modal-pass dd {
    float: right;
    width: 60%;
}

.modal-pass input {
    width: 100%;
}

/* Memo --------------------*/
.modal-memo .inner {
    width: 680px;
    height: 400px;
}

.modal-memo form {
    height: 100%;
}

/* Left */
.memo-left {
    float: left;
    margin-right: 2%;
    width: 43%;
    height: 88%;
}

/* Tabs */
.modal-memo .tabs {
    height: 24px;
}

.modal-memo .tabs li {
    display: inline-block;
    margin-right: 8px;
    height: 24px;
}

.modal-memo .tabs:last-child {
    margin-right: 0;
}

.modal-memo .tabs li a {
    display: block;
    padding: 0 12px;
    height: 24px;
    background-color: #e2e2e2;
    color: #636463;
    font-size: 0.8rem;
    line-height: 24px;
    letter-spacing: 0.05rem;
}

.modal-memo .tabs li a.active {
    background-color: #1ec795;
    color: #fff;
}

.modal-memo .tabs li a:hover {
    background-color: #f7f7f7;
    color: #636463;
}

.modal-memo .tabContents {
    margin-top: 8px;
    height: -webkit-calc(100% - 32px);
    height: calc(100% - 32px);
    background-color: #fff;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.modal-memo .tabPanel {
    padding: 0 12px;
}

.modal-memo .tabPanel li {
    list-style-type: none;
    padding: 6px 0;
    border-top: 1px dotted #e7e7e7;
    font-size: 0.8rem;
    line-height: 1.2;
}

.modal-memo .tabPanel li:nth-of-type(1) {
    border: none;
}

.modal-memo .tabPanel a {
    color: #6a6d6c;
}

.modal-memo .tabPanel a:hover, .modal-memo .tabPanel a:active {
    color: #00e7a3;
    text-decoration: none;
}

/* Right */
.memo-right {
    float: right;
    padding: 12px;
    width: 55%;
    height: 100%;
    background-color: #fff;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* Link --------------------*/
.modal-link .inner {
    width: 980px;
    height: 400px;
}

.modal-link .group {
    margin-top: 16px;
    height: 300px;
}

.modal-link .mCustomScrollbar {
    height: 100%;
}

.modal-link .btn-ctrl {
    margin-top: 12px;
}

/* USER --------------------------------------------------*/
/* User_Add ----------------*/
.user-add .inner {
    width: 800px;
    height: 650px;
}

/* Left */
.user-add .left {
    float: left;
    width: 48%;
    min-height: 424px;
}

.user-add .float-dl {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 2px solid #fff;
}

.user-add .float-dl:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.user-add .float-dl dt {
    width: 40%;
}

.user-add .float-dl dd {
    width: 60%;
}

/* Right */
.user-add .right {
    float: right;
    width: 48%;
    min-height: 400px;
}

.user-add .multiple-block {
    padding: 0 8px;
    background-color: #fff;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}
.user-add select.multiple {
    height: 350px;
}

.user-add div.checkbox-single input[type=checkbox] {
    min-height: 21px;
    line-height: 21px;
}

.user-add .multiple-block select {
    margin: 8px 0;
}

.user-add .multiple-block option {
    padding-left: 0;
}

/* GROUP -------------------------------------------------*/
/* Group_Add ---------------*/
.group-add .inner {
    width: 500px;
    height: 320px;
}

.group-add .clr dt {
    width: 30%;
}

.group-add .clr dd {
    width: 70%;
}

.group-add .btn-set {
    width: 240px;
}

/* Group_Settings ----------*/
.group-settings .inner {
    width: 950px;
    height: 550px;
}

.group-settings .left {
    float: left;
    margin-right: 2%;
    width: 49%;
}

.group-settings .right {
    float: left;
    width: 49%;
}

.group-settings .float-dl {
    margin-top: 24px;
}

.group-settings .row .float-dl {
    margin-top: 0;
}

.group-settings .float-dl dt {
    width: 30%;
}

.group-settings .float-dl dd {
    width: 70%;
}

.group-settings .input-file {
    padding-top: 3px;
}

.group-settings table {
    margin-top: 24px;
    width: 100%;
    border: 1px solid #d3d3d3;
}

.group-settings .table label {
    display: inline-block;
    width: 100%;
}

.group-settings table th, .group-settings table td {
    border: 1px solid #d3d3d3;
}

.group-settings .group-table-1 td, .group-settings .group-table-2 td {
    background-color: #fff;
    text-align: center;
}

.group-settings .group-table-1 th {
    min-width: 200px;
}

.group-settings .group-table-1 td {
    min-width: 50px;
}


.group-settings .group-table-2 th {
    text-align: center;
}

.group-settings .group-table-2 th:nth-of-type(1), .group-settings .group-table-2 td:nth-of-type(1) {
    text-align: left;
}

.group-settings .btn-set {
    width: 240px;
}

/* RANK --------------------------------------------------*/
.table-rank tbody tr {
    cursor: pointer;
}
/* Rank_Add ----------------*/
.rank-add .inner {
    width: 680px;
    height: 595px;
}

.rank-add .clr dt {
    width: 20%;
}

.rank-add .clr dd {
    width: 80%;
}

.rank-add table {
    margin-top: 24px;
    width: 100%;
    border: 1px solid #d3d3d3;
}

.rank-add th, .rank-add td {
    border: 1px solid #d3d3d3;
}

.rank-add td {
    background-color: #fff;
    text-align: center;
}

.rank-add .table label {
    display: inline-block;
    width: 100%;
}

.rank-add .btn-set {
    width: 240px;
}

/* SYSTEM ------------------------------------------------*/
/* Key ---------------------*/
.key .inner {
    width: 500px;
    height: 340px;
}

.key .clr dt {
    width: 30%;
}

.key .clr dd {
    width: 70%;
}

.key .btn-set {
    width: 240px;
}

/* LOG_Details -------------*/
.log-details .inner {
    width: 600px;
    min-height: 450px;
}

.log-details table {
    border: 1px solid #d3d3d3;
}

.log-details th, .log-details td {
    border: 1px solid #d3d3d3;
}

.log-details th {
    width: 40%;
}

.log-details .btn-set {
    width: 240px;
}

/* LOGIN ------------------------------------------------*/
.body-login {
    background-color:#5e605c;
    padding-top : 100px;
  min-height: 700px;
}

.div-login-inner {
    padding: 200px 300px;
}

.div-login-inner .message {
    width: 478px;
    float: left;
    text-align: center;
}

.div-login-logo {
    width: 100%;
    height: 200px;
    background-color: #fff;
    text-align:center;
}
.div-login-logo > img {
    width: 200px;
    height: 200px;
}
.div-login-text {
    padding-top : 60px;
    text-align:center;
    color: #fff;
}


.div-login-btn {
    padding-top : 60px;
    text-align: center;
}

.btn-login {
    border: 1px solid #fff;
    display: inline-block;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background-color: #11d49a;
    cursor: pointer;
    text-align: center;
    width: 100px;
    height: 30px;
    padding-top: 5px;
    background-color: #5e605c;
    color: #fff;
}

.sidebar {
    display: block;
    float: left;
    width: 150px;
}

.content {
    display: block;
    overflow: hidden;
    width: auto;
}

.sidebar-nav {
  /*
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    */
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff333333', endColorstr='#ff222222', GradientType=1);
}

.sidebar-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.sidebar-nav a, .sidebar-nav a:hover, .sidebar-nav a:focus, .sidebar-nav a:active {
    outline: none;
}

.sidebar-nav ul li, .sidebar-nav ul a {
    display: block;
}

.sidebar-nav ul a {
    padding: 0 0;
    /*
    border-top: 1px solid rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
        */

}

.sidebar-nav ul a:hover, .sidebar-nav ul a:focus, .sidebar-nav ul a:active {
    text-decoration: none;
}

.sidebar-nav ul a:hover {
    background-color: #2e2e2e;
}

.sidebar-nav ul ul a {
    height: 48px;
    padding-left: 10px;
}

.sidebar-nav ul ul a:hover, .sidebar-nav ul ul a:focus, .sidebar-nav ul ul a:active {
    background-color: rgba(255, 255, 255, 0.2);
}

.sidebar-nav-item {
    padding-left: 5px;
}

.sidebar-nav-item-icon {
    padding-right: 5px;
}

.slide-record dd {
    padding: 8px;
    min-height: 250px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background-color: #fff;
}

.slide-record ul:nth-of-type(1) {
    padding-top: 8px;
}

.slide-record dd li {
    margin-top: 0;
    padding: 6px 0;
    border-top: 1px dotted #e7e7e7;
    line-height: 1.2;
}

.slide-record dd li:nth-of-type(1) {
    border: none;
}

#rtlh3 small {
    transform: rotateY(180deg);
    display: inline-block;
}

.div-blank {
    width: 100%;
    height: 100%;
    z-index: 99;
    position: absolute;
    background: rgba(0,0,0,0.4);
    text-align: center;

    display: none;
}
.div-blank-popup {
    margin: auto;
    margin-top: 240px;
    padding-top: 20px;
    background-color: #5d5d5d;
    width: 400px;
    height: 220px;
    color: #fff;
}

.div-blank-popup > img {
    margin-top: -20px;
    width: 150px;
    height: 150px;
}

input[type=number] {
    -webkit-appearance: none !important;
}

input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
}

html.main {
    overflow-y: hidden;
}
.dismiss {
    display: none !important;
}

.licsenfontcss{
  font-size: 30px;
  vertical-align: bottom;
}

.licsenimg{
  width: 40px;
  height: 40px;
}

.licsendiv{
  text-align: center;
}

.licsenheight{
  height: auto !important;
}

#passwordModal dt, #passwordModal dd {
    min-height: 32px;
    line-height: 32px;
}
#passwordModal dt {
    width: 30%;
}

/*::-webkit-scrollbar {*/
    /*width: 15px;*/
    /*height: auto;*/
/*}*/


::-webkit-input-placeholder {
    color: #ccc;
    font-weight: normal;
}

:-ms-input-placeholder {
    color: #ccc;
    font-weight: normal;
}
::-moz-placeholder {
    color: #ccc;
    font-weight: normal;
}



#treeModal .selected ,#fileTreeModal .selected{
    background-color: #dddddd;
}
.padtop67 {
  padding-top: 67px !important;
}
.bordernone{
  border: none !important;
}



.grn{
  color: green;
}

.backgrn{
  background-color: #22dea6;
  color: white;
}

.gray{
  background-color: #ccc;
  color: white;
}
.hrnv {
  height: 1px;
  background-color: green;
  display: inline-block;
  width: 185px;
  vertical-align: middle;
}
.navtd {
  background-color: #22dea6;
  width: 116px;
  text-align: center;
}
.nvtable{
  margin-left: 12px";
}
.margintop50 {
  margin-top: 20px;
}
.nvtdtext{
  width: 200px;
}

.closecomit{
  width: 150px;
  height: 26px;
}

.propertywidth{
  width:150px;
}


