[v-cloak] {
  display: none;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

.collapsed > .when-opened,
:not(.collapsed) > .when-closed {
  display: none;
}

.z-index-fix {
  z-index: 30;
}

.validation-summary-errors ul {
  list-style-type: none;
}

.writing-vertical {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}

.clickable-element {
  cursor: pointer !important;
}
.clickable-element.link-text {
  color: #999999;
}
.clickable-element.link-text:hover {
  color: #737373;
}
.clickable-element.open-window:after {
  font-family: FontAwesome;
  content: "\f08e";
  margin-left: 0.25em;
}
.clickable-element.hilight:hover {
  background-color: rgb(0, 105, 50) !important;
  color: #fff;
}
.clickable-element.hilight.tr-opt:hover td {
  background-color: rgb(0, 105, 50) !important;
  color: #fff;
}
.clickable-element.hilight-swell:hover {
  background-color: rgba(160, 195, 110, 0.4) !important;
  color: #000;
}
.clickable-element.hilight-swell.tr-opt:hover td {
  background-color: rgba(160, 195, 110, 0.4) !important;
  color: #000;
}
.clickable-element.hilight-soft:hover {
  background-color: rgba(194, 156, 17, 0.3) !important;
  color: #000;
}
.clickable-element.hilight-soft.tr-opt:hover td {
  background-color: rgba(194, 156, 17, 0.3) !important;
  color: #000;
}

/* Loading Overray*/
.loading-progress {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 65535;
  display: none;
}
.loading-progress .spinner {
  width: 150px !important;
  height: 150px !important;
  position: absolute !important;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.loading-progress-spot {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 65535;
  display: none;
}
.loading-progress-spot .spinner {
  width: 150px !important;
  height: 150px !important;
  position: absolute !important;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

@font-face {
  font-family: "mfont";
  font-weight: 400;
  src: url("../dist/assets/fonts/mplus-2p-regular.ttf") format("truetype"), url("../dist/assets/fonts/mplus-2p-regular.eot") format("eot"), url("../dist/assets/fonts/mplus-2p-regular.woff2") format("woff2"), url("../dist/assets/fonts/mplus-2p-regular.woff") format("woff");
}
@font-face {
  font-family: "mfont";
  font-weight: 700;
  src: url("../dist/assets/fonts/mplus-2p-bold.ttf") format("truetype"), url("../dist/assets/fonts/mplus-2p-bold.eot") format("eot"), url("../dist/assets/fonts/mplus-2p-bold.woff2") format("woff2"), url("../dist/assets/fonts/mplus-2p-bold.woff") format("woff");
}
* {
  font-family: "mfont", sans-serif;
}

[class*=btn-outline-] {
  border-width: 1px;
}

html, body {
  height: 100%;
  user-select: none;
  overflow-x: hidden;
}

.wrapper {
  min-height: 100%;
}
.wrapper.login {
  background-color: rgb(0, 135, 65);
}
.wrapper:not(.login) {
  padding-top: 60px;
  padding-bottom: 90px;
  background-color: #e5e5e5;
}

.navbar-foot {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  z-index: 1030;
}
.navbar-foot .navbar-foot-menu.row {
  margin-right: 0;
  margin-left: 0;
  padding-left: 30px;
  padding-right: 30px;
}
.navbar-foot .navbar-foot-menu .col {
  text-align: center;
}
.navbar-foot .navbar-foot-menu .col a {
  display: block;
  position: relative;
  padding-top: 45px;
  font-size: 0.875rem;
  color: #808080;
}
.navbar-foot .navbar-foot-menu .col a::before {
  display: block;
  position: absolute;
  left: 50%;
  top: 5px;
  width: 36px;
  height: 36px;
  transform: translateX(-50%);
}
.navbar-foot .navbar-foot-menu .col a.on.mn_report::before {
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(160, 195, 110)' viewBox='0 0 36 36'%3e%3cpath stroke='none' d='M18,0C8.1,0,0,8.1,0,18c0,4,1.3,7.6,3.5,10.6l-3.4,6.3c-0.4,0.6,0.4,1.4,1,1l6.3-3.4C10.4,34.7,14,36,18,36 c9.9,0,18-8.1,18-18S27.9,0,18,0z M13.8,27.7c-1.3,0-2.4-1.1-2.4-2.4s1.1-2.4,2.4-2.4s2.4,1.1,2.4,2.4S15.1,27.7,13.8,27.7z M24.7,15.6c-1.6,2.7-5.8,4.9-7.8,5.8c-0.5,0.2-1.1-0.1-1.2-0.7c-0.2-2.2-0.5-6.9,1.1-9.7c2.1-3.6,4.7-4.1,6.9-2.8 S26.8,12,24.7,15.6z'/%3e%3c/svg%3e");
}
.navbar-foot .navbar-foot-menu .col a.mn_report::before {
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23cccccc' viewBox='0 0 36 36'%3e%3cpath stroke='none' d='M18,0C8.1,0,0,8.1,0,18c0,4,1.3,7.6,3.5,10.6l-3.4,6.3c-0.4,0.6,0.4,1.4,1,1l6.3-3.4C10.4,34.7,14,36,18,36 c9.9,0,18-8.1,18-18S27.9,0,18,0z M13.8,27.7c-1.3,0-2.4-1.1-2.4-2.4s1.1-2.4,2.4-2.4s2.4,1.1,2.4,2.4S15.1,27.7,13.8,27.7z M24.7,15.6c-1.6,2.7-5.8,4.9-7.8,5.8c-0.5,0.2-1.1-0.1-1.2-0.7c-0.2-2.2-0.5-6.9,1.1-9.7c2.1-3.6,4.7-4.1,6.9-2.8 S26.8,12,24.7,15.6z'/%3e%3c/svg%3e");
}
.navbar-foot .navbar-foot-menu .col a.mn_list::before {
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23cccccc' viewBox='0 0 36 36'%3e%3cpath stroke='none' d='M30,0H6C4.3,0,3,1.3,3,3v30c0,1.7,1.3,3,3,3h24c1.7,0,3-1.3,3-3V3C33,1.3,31.7,0,30,0z M25.5,26.5h-15v-3h15 V26.5z M25.5,19.5h-15v-3h15V19.5z M25.5,12.5h-15v-3h15V12.5z'/%3e%3c/svg%3e");
}
.navbar-foot .navbar-foot-menu .col a.on.mn_list::before {
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(160, 195, 110)' viewBox='0 0 36 36'%3e%3cpath stroke='none' d='M30,0H6C4.3,0,3,1.3,3,3v30c0,1.7,1.3,3,3,3h24c1.7,0,3-1.3,3-3V3C33,1.3,31.7,0,30,0z M25.5,26.5h-15v-3h15 V26.5z M25.5,19.5h-15v-3h15V19.5z M25.5,12.5h-15v-3h15V12.5z'/%3e%3c/svg%3e");
}

header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  border-bottom: 1px solid #cccccc;
  z-index: 1030;
}
header h2 {
  margin-bottom: 0;
  font-size: 1.125rem;
  line-height: 45px;
  font-weight: 300;
  text-align: center;
  letter-spacing: 0.1rem;
}
header .col-auto {
  width: 32px;
}
header .col-auto .back, header .col-auto .add {
  display: block;
  width: 100%;
  padding-top: 100%;
  height: 0;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center;
}
header .col-auto .back {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 32 32'%3e%3cpath stroke='%23808080' stroke-linecap='round' stroke-miterlimit='10' stroke-width='1' d='M21,1 6,16 21,31'/%3e%3c/svg%3e");
}
header .col-auto .add {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 32 32'%3e%3cpath stroke='%23808080' stroke-linecap='round' stroke-miterlimit='10' stroke-width='1' d='M1,16H30 M16,31V-30'/%3e%3c/svg%3e");
}
header .col-auto.function {
  height: 100%;
}
header .logout {
  background-color: #999999;
  display: block;
  position: fixed;
  top: 6px;
  right: 6px;
  width: 6.5em;
  border-radius: 0.25rem;
  padding: 2px;
}
header .logout a {
  color: #fff;
  padding-left: 27px;
  font-size: small;
}
header .logout a:before {
  content: url("../dist/assets/images/common/menu-icon_logout.svg");
  display: inline-block;
  height: 30px;
  width: 20px;
  left: 0.25rem;
  position: absolute;
  text-align: center;
}
header .viewback {
  width: 5em;
  position: fixed;
  top: 10px;
  left: 10px;
  color: #666666;
}

.login {
  position: relative;
  height: 100%;
  color: #fff;
}
.login .container-fluid {
  height: 100%;
}
.login .container-fluid > .row {
  height: 100%;
}
.login .container-fluid > .row > [class*=col-] {
  padding: 2rem;
  text-align: center;
}
.login .container-fluid > .row > [class*=col-] .btn-submit {
  font-weight: 700;
  color: rgb(0, 105, 50);
}
.login .copyright {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
}

.wrapper .contents {
  max-width: 600px;
  margin: auto;
}

.input .contents .btn-light:not(:disabled):not(.disabled):active,
.input .contents .btn-light:not(:disabled):not(.disabled).active, .confirm .contents .btn-light:not(:disabled):not(.disabled):active,
.confirm .contents .btn-light:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: rgb(0, 105, 50);
}
.input .contents .btn-light.disabled:active, .input .contents .btn-light:disabled:active,
.input .contents .btn-light.disabled.active, .input .contents .btn-light.active:disabled, .confirm .contents .btn-light.disabled:active, .confirm .contents .btn-light:disabled:active,
.confirm .contents .btn-light.disabled.active, .confirm .contents .btn-light.active:disabled {
  color: #fff;
  background-color: #808080;
}
.input .contents select.form-control.disabled, .input .contents select.form-control:disabled, .confirm .contents select.form-control.disabled, .confirm .contents select.form-control:disabled {
  background-color: #fff;
  appearance: none;
}
.input .contents .btn-group, .confirm .contents .btn-group {
  width: 100%;
}
.input .contents .container-fluid > .row, .confirm .contents .container-fluid > .row {
  padding: 1rem;
}
.input .contents .container-fluid > .row > .col, .confirm .contents .container-fluid > .row > .col {
  text-align: center;
}
.input .contents .container-fluid > .row p, .confirm .contents .container-fluid > .row p {
  color: #666666;
  letter-spacing: -0.05rem;
}
.input .contents .container-fluid > .row p + small, .confirm .contents .container-fluid > .row p + small {
  display: block;
  margin-top: -0.5rem;
  margin-bottom: 1rem;
  text-align: justify;
}
.input .contents .container-fluid > .row h6, .confirm .contents .container-fluid > .row h6 {
  font-size: 0.875rem;
  font-weight: 300;
  color: #333333;
  text-align: left;
  margin-bottom: 0.25rem;
}
.input .contents label.embed-responsive, .confirm .contents label.embed-responsive {
  position: relative;
  background-color: #fff;
}
.input .contents label.embed-responsive > input[type=file], .confirm .contents label.embed-responsive > input[type=file] {
  display: none;
}
.input .contents label.embed-responsive::before, .confirm .contents label.embed-responsive::before {
  display: block;
  width: 100%;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23cccccc' viewBox='0 0 45 36'%3e%3cpath stroke='none' d='M0,0v36h45V0H0z M40.5,31.5L4.5,31.5v-27h36V31.5z M18.1,14.2c1.7,0,3.1-1.4,3.1-3.1c0-1.7-1.4-3.1-3.1-3.1C16.4,8,15,9.4,15,11.1C15,12.8,16.4,14.2,18.1,14.2z M27,13.9c-0.3-0.6-0.9-0.9-1.6-0.9c-0.6,0-1.2,0.3-1.6,0.9l-3.7,5.6c-0.3,0.5-0.8,0.7-1.4,0.7c-0.6,0-1.1-0.3-1.4-0.8c-0.4-0.6-1-0.9-1.6-0.9c-0.6,0-1.2,0.3-1.6,0.9L8,29h29L27,13.9z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-size: 45px 36px;
  background-position: center;
  padding-top: 56.25%;
  content: "";
}
.input .contents .btn-outline-confirm, .confirm .contents .btn-outline-confirm {
  border-width: 1px;
  background-color: #fff;
}

.sended {
  height: 100%;
}
.sended .contents {
  height: 100%;
}
.sended .contents .container-fluid {
  height: 100%;
}
.sended .contents .container-fluid > .row {
  height: 100%;
}
.sended .contents h5 {
  font-weight: 300;
}
.sended .contents p {
  font-size: 0.875rem;
}
.sended .contents p .receipt-num {
  color: rgb(230, 130, 50);
}

.list .nav-pills {
  margin-bottom: 0.875rem;
}
.list .nav-pills .nav-link {
  font-size: 0.875rem;
}
.list .nav-pills .nav-link:not(.active) {
  color: #666666;
}
.list ul.report-list {
  margin-left: -15px;
  margin-right: -15px;
}
.list ul.report-list li {
  border-bottom: 1px solid #e5e5e5;
}
.list ul.report-list li:first-child {
  border-top: 1px solid #e5e5e5;
}
.list ul.report-list li > a {
  display: block;
  padding: 0.5rem;
  padding-right: 2rem;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center right 5px;
  background-size: 15px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23b3b3b3' viewBox='0 0 15 15'%3e%3cpath stroke='none' d='M12,7.5 2,15 2,0'/%3e%3c/svg%3e");
}
.list ul.report-list li > a.focus, .list ul.report-list li > a.hover {
  background-color: #f3f8f3;
}
.list ul.report-list li h5 {
  margin-bottom: 0;
  line-height: 1.75;
  color: rgb(0, 105, 50);
  font-weight: 400;
}
.list ul.report-list li .date {
  font-size: 0.875rem;
  color: #b3b3b3;
}
.list ul.report-list li .date + .category {
  margin-left: 1rem;
}
.list ul.report-list li .date + .serial {
  margin-left: 1rem;
}
.list ul.report-list li .category {
  font-size: 0.875rem;
  color: rgb(230, 130, 50);
}
.list ul.report-list li .serial {
  font-size: 0.875rem;
  color: #666666;
  font-weight: 600;
}