* {margin: 0; padding: 0;}
body, button {color: #fff; font-size: 13px;}
button:focus, input:focus {outline: none;}
button {border: 0; height: 46px; width: 296px; cursor: pointer; border-radius: 6px;}
.btn.blue {background: #3b55ff;}.btn.blue:hover {background: #2c3fbb;}
.btn.gray {background: #3E3E3E;}.btn.gray:hover {background: #4e4e4e;}
input {background: #2d2d2d; border: 1px solid #3C3D41; height: 46px; color: #fff; padding: 0 8px; width: 280px; border-radius: 6px;}
input:focus {border-color: #3b55ff;}
a {text-decoration: none; color: #fff;}
.input label.error {color: #ff337d; display: block !important; padding-left: 10px; position: absolute;}
::-webkit-scrollbar-thumb{background: #4a4a4a; border: 0;}
::-webkit-scrollbar{background: #2d2d2d; width:6px; height:6px;}
::-webkit-scrollbar-thumb:hover{background:#656565;}
::-webkit-scrollbar-thumb:active{background:#656565;}
li {list-style: none;}

.bg {background: #222; position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.box {position: fixed; top: 20%; left: 50%; transform: translateX( -50% ); width: 296px;}
.header {text-align: center;}
.header h1 {padding-bottom: 20px;}
.header h1 span {font-size: 12px; margin: 17px 0 0 8px; display: inline-block; vertical-align: top; font-weight: 300;}
.header h2 {padding-bottom: 50px;}
.input div {padding-bottom: 20px; position: relative;}
.input label {display: block; padding-bottom: 10px;}
.btn-box {border-top: 1px solid #3a3a3a; padding-top: 20px;}
.btn-box a {background: #464646; border: 0; height: 46px; line-height: 46px; width: 296px; display: block; text-align: center; margin-top: 20px; border-radius: 6px;}
.btn-box a:hover {background: #2d2d2d;}
.footer {position: absolute; left: 0; right: 0; bottom: 0; background: #000; padding: 12px 0; text-align: center; font-size: 11px; font-weight: 300; color: #808080;}
.layout-3-box {max-width: 790px; width: 100%;}
.layout-3-box .contents .input {overflow: hidden;}
.layout-3-box .contents .input div {float: left; width: 29%; margin-right: 5%;}
.layout-3-box .contents .input div:nth-child(3n) {margin-right: 0;}
.layout-3-box .contents .input div input {width: 100%;}
.layout-3-box .contents .btn-box {text-align: center;}
.error-page-text {text-align: center; font-size: 18px; top: 43%;}

/* popup start */
.jui .window {visibility: visible; -webkit-animation: fadeIn 0.3s; animation: fadeIn 0.3s;}
.jui .window.windowpopup {visibility: inherit; -webkit-animation: none; animation: none; width: 100%; height: 100%;}
@-webkit-keyframes fadeIn {
  from {transform: scale(0); opacity: 0;} 
  to {transform: scale(1); opacity: 1;}
}
@keyframes fadeIn {
  from {transform: scale(0); opacity: 0;}
  to {transform: scale(1); opacity:1 ;}
}
.jui .window {border-bottom: 0; border-radius: 0; background: #303030;}
.jui .window .input {width: 100%; border-radius: 0;}
.jui .window > .head {background: #262626; border-radius: 0; border-bottom: 1px solid #434343; display: flex; align-items: center; padding: 0 15px;}
.jui .window, .jui .window > .head {color: #fff; height: 40px;}
.jui .window > .head > .left {padding: 0; font-weight: 500; left: auto; right: auto; position: static; display: flex;}
.jui .window > .head > .right {right: auto; position: static; display: flex; align-items: center; padding: 0; margin-left: auto;}
.jui .window > .body {background: #303030; border-top: 0; position: relative; overflow: auto; padding: 15px; word-break: break-all;}
.jui .window > form > .body {background: #303030; border-top: 0; position: relative; overflow: auto; padding: 15px; word-break: break-all;}
.jui .window > form > .body .title {overflow: hidden; color: #9daaff; font-weight: 300;}
.jui .window > .body .title {overflow: hidden; color: #9daaff; font-weight: 300;}
.jui .window > .body .title span {float: left;}
.jui .window > .body .title i {cursor: pointer;}
.jui .window > .foot {background: #262626; border-top: 0; height: 60px; display: flex;}
.jui .window > .foot > span {flex: 1;}
.jui .window > .foot > span .btn {margin-top: 0; width: 100%; height: 60px; padding: 0; text-align: center; border-radius: 0; font-size: 16px;}
.popup-layout-two {overflow: hidden;}
.popup-layout-two .layout {float: left; width: 49%; margin-right: 2%;}
.popup-layout-two .layout:nth-child(2n) {margin-right: 0;}
.jui .window .layout-three-list {width: 43% !important;}
.jui .window .layout-three-list.layout-three-arrow {width: 10% !important; padding: 230px 0 0;}
.jui .window .layout-three-list.layout-three-arrow button {margin: 0 auto 20px; display: block;}
.jui .window .layout-three-list.layout-three-arrow img {margin-top: 8px;}
.jui .window .layout-three-list2 {width: 31.5% !important; display: inline-table; margin-right: 2%;}
.jui .window .layout-three-list2 p {font-weight: 200; margin-bottom: 7px;}
.jui .window .layout-three-list2 .combo-box .combo a.text {width: 150px;}
.jui .window .layout-three-list2:last-child {margin-right: 0;}
.popup-list-box .popup-list p, .popup-list-box .popup-list div, .popup-list-box .popup-list ul {display: inline-block;}
.popup-list-box .popup-list p {width: 25%;}
.popup-list-box .popup-list div, .popup-list-box .popup-list ul {width: 74%;}
.popup-list-box .popup-list div input {width: 100%;}
.popup-list-box .popup-list ul {vertical-align: bottom;}
.jui .window .tab {font-size: 12px;}
.jui .window .tab li > a {height: 50px; line-height: 50px;}
.jui .window .tab li.active > a {border-bottom: 2px solid #3B55FF;}
.jui .window .paging .list {background: #222;}
.jui .window .popup-table {border-collapse: collapse; width: 100%;}
.jui .window .table.simple > tbody > tr {border-left-color: #434343;}
.jui .window .popup-table td {border: 1px solid #434343; border-left: 0; padding: 0 6px; height: 40px; box-sizing: border-box;}
.jui .window .popup-table td:last-child, .jui .window .table.simple > tbody > tr > td:last-child {border-right: 0;}
.jui .window .popup-table td.table-title {background: #212121;}
.jui .window .popup-table td.table-input {padding:0; position: relative;}
.jui .window .popup-table textarea {border: 0; height: 40px !important;}
.jui .window .popup-table textarea:hover, .jui .window .popup-table input:hover {background: #3e3e3e;}
.jui .window .popup-table td > div {display: flex;}
.jui .window .popup-table td > div .input {height: 40px; box-sizing: border-box;}
#search {flex: 1;}
.jui .window .popup-table td > div .btn {width: auto; padding: 0 18px; margin-left: 6px; height: 40px;}
.jui .window .calendar .datepicker .title {color: #fff;}
.jui .window .combo {display: flex;}
.jui .window .combo-box .combo a.text {flex: 1;}
.jui .window .combo-box .combo a.toggle {margin-left: 0;}
.jui .window .combo > ul {margin-top: 40px !important;}
.jui .window .select-container {display: block;}
.jui .window .select-container > div {display: flex; width: auto;}
.jui .window .select-container .title {flex: 1; color: #fff;}
.jui .window .select-container .items {margin-top: 40px !important;}
label.error {color: #ff337d; display: block !important; padding-left: 10px; font-size: 13px;}
.popup-message {padding: 19px 0 0;}
.popup-message span {float: left; margin-right: 5px; color: #0FAA58;}
.popup-message svg {float: left; fill: #0FAA58;}
.delete-message {padding: 20px 0 0;}
.division-layout {border: 1px solid #464646; background: #292929; padding: 20px 20px 25px; border-radius: 6px; box-sizing: border-box;}
.overflow-height {overflow: inherit; height: 175px;}
.jui .window > .head > .right > .close {height: 24px; line-height: 24px;}
.jui .window .table.simple tbody .table-check {padding-left: 0px;}
.important {margin-right: 5px; font-size: 16px; font-style: normal; color: #FF337D; font-weight: 800;}
.jui .input.disabled, .jui .input.readonly, .jui .input[disabled], .jui .input[readonly] {background: none !important;}
/* popup end */

/* dropdown start */
.jui .dropdown {z-index: 6000;}
.jui .dropdown ul, .jui .dropup ul {background: #2d2d2d; border-radius: 0; box-shadow: 0px 0px 10px 3px #111; margin-top: 5px !important; max-height: 200px; overflow-y: auto;}
.jui .dropdown ul > li:not(.divider), .jui .dropup ul > li:not(.divider) {color: #999; line-height: 40px; border-left: 5px solid #2d2d2d;}
.jui .dropdown ul > li.active, 
.jui .dropdown ul > li:focus:not(.divider):not(.title):not(.disabled),
.jui .dropdown ul > li:hover:not(.divider):not(.title):not(.disabled),
.jui .dropup ul > li.active,
.jui .dropup ul > li:focus:not(.divider):not(.title):not(.disabled),
.jui .dropup ul > li:hover:not(.divider):not(.title):not(.disabled) {background: #1d1d1d; border-left: 5px solid #3b55ff;}
/* dropdown start */

/*popup start*/
#layer_popup {position: fixed; bottom: 72px; right: 30px; z-index: 10;}
#layer_popup .banner {background: #000; height: 360px; display: flex; flex-direction: column;}
#layer_popup .popup-box {position: relative;}
#layer_popup .popup-box input{-webkit-appearance:auto; -moz-appearance:auto; appearance: auto; width: auto; margin-right: 8px;}
#layer_popup .close {opacity: .6;}
#layer_popup .close form {display: flex; font-size: 13px; justify-content: space-between;}
#layer_popup .close form #check {display: flex; flex: 1; align-items: center; background: #3E3E3E; border-top: 1px solid #5c5c5c; padding: 0 16px;}
#layer_popup .close #close {display: flex; flex: .6; align-items: center;}
#layer_popup .close #close a {display: flex; align-items: center; flex: 1; justify-content: center; height: 100%; background: #3E3E3E; border-left: 1px solid #5c5c5c;  border-top: 1px solid #5c5c5c;}
#layer_popup .close #close a:hover {background: #272727;}
#layer_popup .close label, #layer_popup .close a {color: #fff;}
#layer_popup ul li {display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid #595858;}
#layer_popup ul li a {padding: 8px 12px; background: #000; border-radius: 8px; margin-left: 16px;}
#layer_popup ul li:hover {background: linear-gradient( to right, #303030, rgb(68, 68, 68), #303030 )}
#layer_popup ul li:last-child {border: 0;}
.layer_popup_tit {background: #262626; border-bottom: 1px solid #434343; display: flex; align-items: center; padding: 15px; justify-content: space-between;}
.layer_popup_body {background: #303030; border-top: 0; position: relative; overflow: auto; padding: 15px; word-break: break-all; display: flex; flex-direction: column; flex: auto;}
/*popup end*/