/* ==================================================
	icons
================================================== */
i[class^="icon-"] { display: inline-block; vertical-align: middle; text-indent: -9999px;}
.icon-user-management { width: 24px; height: 24px; background: url(../img/icon/icon_user_management_off.png) no-repeat center; background-size: cover; }
.icon-menu { width: 24px; height: 24px; background: url(../img/icon/icon_menu_off.png) no-repeat center; background-size: cover; }
.icon-layout { width: 24px; height: 24px; background: url(../img/icon/icon_layout_off.png) no-repeat center; background-size: cover; }
.icon-library { width: 24px; height: 24px; background: url(../img/icon/icon_library_off.png) no-repeat center; background-size: cover; }
.icon-clock { width: 24px; height: 24px; background: url(../img/icon/icon_clock_off.png) no-repeat center; background-size: cover; }
.icon-expand { width: 24px; height: 24px; background: url(../img/icon/icon_expand_off.png) no-repeat center; background-size: cover; }
.icon-error { width: 24px; height: 24px; background: url(../img/icon/icon_error_off.png) no-repeat center; background-size: cover; }
.icon-setting { width: 24px; height: 24px; background: url(../img/icon/icon_setting_off.png) no-repeat center; background-size: cover; }
.icon-report { width: 24px; height: 24px; background: url(../img/icon/icon_report_off.png) no-repeat center; background-size: cover; }
.icon-service { width: 24px; height: 24px; background: url(../img/icon/icon_service_off.png) no-repeat center; background-size: cover; }
.icon-mail { width: 24px; height: 24px; background: url(../img/icon/icon_mail_off.png) no-repeat center; background-size: cover; }
.icon-branch { width: 24px; height: 24px; background: url(../img/icon/icon_branch_off.png) no-repeat center; background-size: cover; }
.icon-reservation { width: 24px; height: 24px; background: url(../img/icon/icon_reservation_off.png) no-repeat center; background-size: cover; }

.icon-user-management.on { background: url(../img/icon/icon_user_management_on.png) no-repeat center; background-size: cover; }
.icon-menu.on { background: url(../img/icon/icon_menu_on.png) no-repeat center; background-size: cover; }
.icon-layout.on { background: url(../img/icon/icon_layout_on.png) no-repeat center; background-size: cover; }
.icon-library.on { background: url(../img/icon/icon_library_on.png) no-repeat center; background-size: cover; }
.icon-clock.on { background: url(../img/icon/icon_clock_on.png) no-repeat center; background-size: cover; }
.icon-expand.on { background: url(../img/icon/icon_expand_on.png) no-repeat center; background-size: cover; }
.icon-error.on { background: url(../img/icon/icon_error_on.png) no-repeat center; background-size: cover; }
.icon-setting.on { background: url(../img/icon/icon_setting_on.png) no-repeat center; background-size: cover; }
.icon-report.on { background: url(../img/icon/icon_report_on.png) no-repeat center; background-size: cover; }
.icon-service.on { background: url(../img/icon/icon_service_on.png) no-repeat center; background-size: cover; }
.icon-mail.on { background: url(../img/icon/icon_mail_on.png) no-repeat center; background-size: cover; }
.icon-branch.on { background: url(../img/icon/icon_branch_on.png) no-repeat center; background-size: cover; }
.icon-reservation.on { background: url(../img/icon/icon_reservation_on.png) no-repeat center; background-size: cover; }

.icon-check-big { width: 72px; height: 56px; background: url(../img/icon/icon_check_big.png) no-repeat center; background-size: cover; }
.icon-camera { width: 30px; height: 24px; background: url(../img/icon/icon_camera.png) no-repeat center; background-size: cover; cursor: pointer; }
.icon-camera.big { width: 80px; height: 64px; background: url(../img/icon/icon_camera.png) no-repeat center; background-size: cover; }
.icon-preference { width: 18px; height: 18px; background: url(../img/icon/icon_preference.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-eye { width: 20px; height: 18px; background: url(../img/icon/icon_eye.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-eye.active { width: 20px; height: 18px; background: url(../img/icon/icon_eye_on.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-file { width: 28px; height: 20px; background: url(../img/icon/icon_file.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-search { width: 16px; height: 16px; background: url(../img/icon/icon_search.png) no-repeat center; background-size: cover; cursor: pointer; }
.icon-empty { width: 24px; height: 24px; background: url(../img/icon/icon_empty.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-calendar { width: 20px; height: 22px; background: url(../img/icon/icon_calendar.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-download { width: 24px; height: 24px; background: url(../img/icon/icon_download.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-move-down { width: 16px; height: 16px; background: url(../img/icon/icon_move_down.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-move-up { width: 16px; height: 16px; background: url(../img/icon/icon_move_up.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-move-down-white { width: 16px; height: 16px; background: url(../img/icon/icon_move_down_white.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-move-up-white { width: 16px; height: 16px; background: url(../img/icon/icon_move_up_white.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-popup-close { width: 20px; height: 20px; background: url(../img/icon/icon_popup_close.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-close { width: 16px; height: 16px; background: url(../img/icon/icon_popup_close.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-delete-tag { width: 22px; height: 22px; background: url(../img/icon/icon_delete_tag.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-add { width: 18px; height: 18px; background: url(../img/icon/icon_add.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-remove { width: 18px; height: 18px; background: url(../img/icon/icon_remove.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-clip { width: 14px; height: 14px; background: url(../img/icon/icon_clip.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-info { width: 12px; height: 12px; background: url(../img/icon/icon_info.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-select-down { width: 8px; height: 6px; background: url(../img/icon/icon_select_down.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-select-up { width: 8px; height: 6px; background: url(../img/icon/icon_select_up.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-more-dots { width: 16px; height: 4px; background: url(../img/icon/icon_more_dots.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-arrow-next.white { width: 10px; height: 8px; background: url(../img/icon/icon_arrow_next_white.png) no-repeat center; background-size: cover; cursor: pointer;}
.icon-new { display: inline-block; width: 10px; height: 10px; background: url(../img/icon/icon_new.png) no-repeat center; background-size: cover; }
.icon-arrow-up { display: inline-block; width: 14px; height: 14px; background: url(../img/icon/icon_arrow_up.png) no-repeat center; background-size: cover; }
.icon-arrow-down { display: inline-block; width: 14px; height: 14px; background: url(../img/icon/icon_arrow_down.png) no-repeat center; background-size: cover; }
.icon-time { display: inline-block; width: 22px; height: 22px; background: url(../img/icon/icon_time.png) no-repeat center; background-size: cover; }
.icon-memo { display: inline-block; width: 22px; height: 22px; background: url(../img/icon/icon_memo.png) no-repeat center; background-size: cover; }
.icon-pro { display: inline-block; width: 22px; height: 22px; background: url(../img/icon/icon_pro.png) no-repeat center; background-size: cover; }
.icon-save { display: inline-block; width: 16px; height: 16px; background: url(../img/icon/icon_save.png) no-repeat center; background-size: cover; cursor: pointer; }

/* ==================================================
	button
================================================== */
.btn-next-circle img { width: 82px; }

.btn-basic { display: inline-block; color: #676767; }
.btn-basic:disabled { background-color: #E2E2E2; color: #919191; }
.btn-basic a { display: block; }

.btn-basic.big { width: 200px; height: 50px; line-height: 50px; font-size: 1.3rem; border-radius: 5px; font-weight: 700; }
.btn-basic.medium { width: 200px; height: 42px; line-height: 42px; font-size: 1.3rem; border-radius: 10px; font-weight: 700; }
.btn-basic.regular { width: 162px; height: 34px; line-height: 34px; font-size: 1.3rem; border-radius: 5px; font-weight: 700; }
.btn-basic.regular.round { width: 100px; }
.btn-basic.small { width: 60px; height: 26px; line-height: 26px; font-size: 1.2rem; border-radius: 10px; font-weight: 700; }

.btn-basic.ghost-black { border: 1px solid #919191; color: #676767; box-sizing: border-box; }
.btn-basic.ghost-red { border: 1px solid #F579A4; color: #F579A4; box-sizing: border-box; }
.btn-basic.ghost-blue { border: 1px solid #3DBEEF; color: #3DBEEF; box-sizing: border-box; }
.btn-basic.round { border-radius: 25px; }
.btn-basic.shadow { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); }

.btn-basic.bg-blue { background-color: #3ABFEF; color: #fff; }
.btn-basic.bg-white { background-color: #fff; }
.btn-basic.bg-gray { background-color: #e2e2e2; color: #fff; }
.btn-basic.bg-red { background-color: #F579A4; color: #fff; }

.btn-basic.underline-black { color: #676767; border-bottom: 1px solid #676767; }
.btn-basic.underline-darkgray { color: #919191; border-bottom: 1px solid #919191; }
.btn-basic.underline-blue { color: #3ABFEF; border-bottom: 1px solid #3ABFEF; }
.btn-basic.underline-gray { color: #e2e2e2; border-bottom: 1px solid #e2e2e2; }
.btn-basic.underline-gray:disabled { background-color: transparent; }

/* ==================================================
	Checkbox , Radio
================================================== */
.option-box {display: inline-block;}
.option-box label {display: inline-block;height: 18px;margin-right: 20px;color: #555;line-height: 18px;cursor: pointer;background-repeat: no-repeat;font-size: 1.5rem; }
.option-box label:last-child {margin: 0;}
.option-box [type="radio"],
.option-box [type="checkbox"] {width: 1px; height: 1px; overflow: hidden; position: absolute; left: -10000%;}
.option-box [type="radio"] + label {background-image: url(../img/btn/btn_radios.png); background-size: 18px;}
.option-box [type="checkbox"] + label {background-image: url(../img//btn/btn_checkboxes.png); background-size: 18px;}
.option-box [type="radio"]:disabled + label {cursor: default;}
.option-box.dir-flow label {padding-left: 30px;}
.option-box.dir-flow [type="radio"] + label,
.option-box.dir-flow [type="checkbox"] + label {background-position: 0 0;}
.option-box.dir-flow [type="radio"]:checked + label {background-position: 0 -18px; font-weight: 700; color: #3ABFEF;}
.option-box.dir-flow [type="checkbox"]:checked + label {background-position: 0 -18px;}
.option-box.dir-flow [type="radio"]:disabled + label,
.option-box.dir-flow [type="checkbox"]:disabled + label {background-position: 0 -36px;}
.option-box.dir-flow .chk-white[type="checkbox"]:checked + label {background-position: 0 -54px; color: #fff;}

.option-box.red [type="radio"] + label {background-image: url(../img/btn/btn_radios_red.png); background-size: 18px;}
.option-box.dir-flow.red [type="radio"]:checked + label { color: #F579A4;}

/* ==================================================
	Input
================================================== */
input { outline-width: 0; }
input:disabled,
input:read-only { background-color: #f1f1f1; }

::placeholder,
::-webkit-input-placeholder { color: #e2e2e2;}
input:-ms-input-placeholder { color: #e2e2e2;}

.login-wrap [type="id"],
.login-wrap [type="password"] { width: 448px; height: 50px; padding: 0 20px; font-size: 1.8rem; box-sizing: border-box; border-radius: 5px; border: none; appearance: none; color: #676767;}
[type="text"],
[type="search"],
[type="email"],
[type="id"],
[type="password"] { width: 290px; height: 42px;padding: 0 14px;border: 1px solid #cbcbcb; font-size: 1.5rem; box-sizing: border-box; border-radius: 10px; }
input.shadow { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); }

textarea { width: 100%; overflow: auto;resize: none;padding: 12px; border: 1px solid #cbcbcb; font-size: 1.5rem; box-sizing: border-box; border-radius: 10px; outline-width: 0; color: #676767; }

.inp-sch-btn { display: inline-block; vertical-align: top; }
.inp-sch-btn [type="search"] { border: 0; }
.inp-sch-btn .inp-wrap { position: relative; }
.inp-sch-btn .icon-search { position: absolute; top: 13px; right: 14px; }
.inp-sch-btn button { float: left; }

.inp-with-icon { position: relative; display: inline-block; }
.inp-with-icon i { position: absolute; right: 14px; }
.inp-with-icon .icon-eye { top: 13px; }
.inp-with-icon.password .icon-eye { top: 16px; right: 20px; }
.inp-with-icon .icon-search { top: 12px; }

.inp-with-btn input { float: left; margin-right: 30px; }
.inp-with-btn button { float: left; }

.inp-inside-btn { position: relative; display: inline-block; }
.inp-inside-btn .btn-wrap { position: absolute; top: 8px; right: 10px; }

.inp-top-label > label { display: block; font-size: 1.2rem; margin-bottom: 10px; text-align: left; font-weight: 700; }
.inp-top-label input { width: 290px; }

.inp-phone-wrap .select.big { float: left; padding-bottom: 0; }
.inp-phone-wrap input { float: left; }
.inp-phone-wrap span { float: left; display: inline-block; width: 30px; text-align: center; line-height: 4.2rem; }

.inp-period .select { float: left; padding-bottom: 0; }
.inp-period input { float: left; }
.inp-period .wave { float: left; display: inline-block; width: 30px; text-align: center; line-height: 4.2rem; }

/* file upload */
.filebox {position: relative;}
.filebox.no-photo .upload-display {display: none !important; position: relative; }
.filebox input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}
.filebox label {cursor: pointer;}
.filebox .upload-nm { display: inline-block; height: 42px; width: 240px; padding: 0 12px; background-color: #fff; border: 1px solid #cbcbcb; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box;}
.filebox.no-photo {display: inline-block;max-width: 100%; box-sizing: border-box;}
.filebox.no-photo label {position: absolute;top: 11px;right: 10px;}
.filebox.no-photo .upload-nm {width: auto;max-width: 100%;padding: 0;border: 1px solid #cbcbcb; border-radius: 10px; font-size: 1.5rem; text-indent: 1.4rem; text-overflow: ellipsis; padding-right: 50px;}
.filebox.no-photo .btn-close {display: none;position: absolute;top: 2px;right: 0;}
.filebox.no-photo .upload-display ~ .btn-close {display: block;}

/* imaged preview */
.filebox.preview-image {display: inline-block;font-size: 0;}
.filebox .photoBox {position: relative; display: inline-block; width: 94px; height: 94px;border-radius: 50%; background: #fff url(../img/icon/icon_photo_below.png) no-repeat;background-size: 100%; cursor: pointer; box-sizing: border-box; text-align: center;}
.filebox .photoBox span {display: block; content: ""; position: absolute;right: 0;bottom: 0;z-index: 10;}
.filebox .photoBox .icon-photo-line {width: 16px;height: 13px;background-position: 100%;opacity: .3;}
.filebox .photoBox + .del {display: none; position: absolute; top: 0; right: 0; width: 9px; height: 9px; background: rgba(0, 0, 0, .8) url(../img/icon/btn_delete_w.png) 50% no-repeat; cursor: pointer}
.filebox .photoBox.after {position: absolute; top: 0; left: 0; background: none;}
.filebox .photoBox.after span {font-size: 0;opacity: 0;}
.filebox .photoBox.after + .del {display: block; padding: 5px;}
.filebox .upload-thumb-wrap {overflow: hidden;position: relative;display: block;width: 94px;height: 94px;border: 2px solid #EDEDED;border-radius: 50%;box-sizing: border-box;}
.filebox .upload-display img {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);width: 90px;height: 90px;box-sizing: border-box;}

.filebox-wrap { margin-bottom: 12px;}
.filebox-wrap .upload-nm { vertical-align: top;}
.filebox-wrap .comment { vertical-align: top; display: inline-block; text-align: left; margin-left: 10px;}
.filebox-wrap .comment .txt { color: #919191; padding: 4px 0; }
.filebox-wrap .comment .size { font-weight: bold; color: #3DBEEF; }
.filebox-wrap > button { vertical-align: top; margin: 10px;}
.upload-comment .txt { color: #919191; padding: 4px 0; }
.upload-comment .size { font-weight: bold; color: #3DBEEF; }

/* ==================================================
	Select
================================================== */
.select { display: inline-block; *display: inline; position: relative; /* z-index:60; */ line-height: normal; font-size: 1.2rem; vertical-align: top; *zoom: 1; padding-bottom: 10px; }
.select * { margin: 0; padding: 0; cursor: pointer}
.select .my_value { overflow: hidden; position: relative; top: 0; left: 0; z-index: 2; border: 1px solid #cdcdcd; padding-right: 30px; background: transparent; color: #838383; text-align: left; line-height: 19px; border-radius: 25px; font-weight: 300; }
.select .my_value.selected { color: #111; }
.select.open .my_value,
.select .my_value.outLine { border: 1px solid #919191;}
.select button.my_value { width: 100%; height: 32px; *padding-left: 10px; text-indent: 14px; *text-indent: 0; color: #111;}
.select button.my_value > span {position: relative;}
.select div.my_value { height: 19px; text-indent: 8px}
.select .ctrl { position: absolute; top: 0; right: 0; width: 40px; height: 32px; box-sizing: border-box;}
.select .arrow { position: absolute; top: 14px; right: 14px; font-size: 0; line-height: 0}
.select .a_list { display: none; overflow: hidden; position: absolute; top: 40px; left: 0; z-index: 65; width: 100%; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1); background: #fff; list-style: none; box-sizing: border-box; text-align: left;}
.select .a_list ul.options { max-height: 165px; overflow-y: auto; padding: 6px 14px; }
.select .a_list img { vertical-align: baseline;}
.select.open .a_list { display: block}
.select ul.i_list { left: -2000%}
.select.open ul.i_list { left: 0}
.select li { overflow: hidden; position: relative; /* border-left:1px solid #000; border-right:1px solid #000; */ white-space: nowrap; margin: 0px !important;}
.select li input.option { position: absolute; width: 100%; height: 20px; line-height: 20px}
.select li label { position: absolute; top: 0; left: 0; width: 100%; height: 18px; background: #fff; color: #767676; line-height: 18px; text-indent: 8px; *text-indent: 6px}
.select li a { display: inline-block; width: 100%; height: 26px; background: #fff; color: #676767; line-height: 26px; box-sizing: border-box;}
.select li .btn-delete-ctgr { position: absolute; top: 5px; right: 0; font-size: 1.1rem; color: #F579A4; }
.select li a:hover { color: #3ABFEF; font-weight: 700; }
/* .select li.hover * {  color:#3ABFEF; } */
.select_go { overflow: visible; height: 21px; width: 28px; *margin: -1px 0 -1px 4px; padding: 0; border: 1px solid #bababa; background: #f1f1f1; color: #767676; line-height: 19px; vertical-align: middle; cursor: pointer}
.select.none-line .my_value {border-color: #fff;}

.select.no-outline { padding-bottom: 0; }
.select.no-outline .my_value { border: none; }
.select.no-outline .a_list { top: 32px; }
.select.underline button.my_value { border: none; border-radius: 0; height: 28px; border-bottom: 1px solid #E2E2E2; text-indent: 0; color: #676767; }
.select.underline .ctrl { width: 8px; height: 28px; }
.select.underline .arrow { top: 11px; right: 0;}
.select.big button.my_value { height: 42px; background-color: #fff; border-radius: 10px; color: #676767; }
.select.big .ctrl { height: 42px; z-index: 3; }
.select.big ul { top: 50px; }
.select.big .arrow { top: 20px; }
.select.big .a_list { top: 50px; }

.add-category { border-top: 1px solid #e2e2e2; padding: 0 14px; }
.add-category .create-area { display: none; }
.add-category .btn-new-ctgr { display: none; }
.add-category .create-area.active { display: block; }
.add-category .btn-new-ctgr.active { display: block; }
.add-category .btn-new-ctgr { padding: 13px 0; color: #3ABFEF; font-weight: 700;}
.add-category .create-area { padding: 13px 0; }
.add-category .create-area .caption { margin-bottom: 12px; font-size: 1.2rem; font-weight: 700; color: #676767; }
.add-category .create-area .btn-add-ctgr { width: 72px; }
.add-category #inp-new-ctgr { width: 100%; height: 30px; padding: 0 12px; font-size: 1.2rem; color: #676767; box-sizing: border-box; margin-bottom: 12px;; border-radius: 5px; }

/* ==================================================
	Tab menu
================================================== */
.tab-menu { display: inline-block; border-bottom: 1px solid #e2e2e2; }
.tab-menu li { float: left; text-align: center; line-height: 42px; font-size: 1.3rem; color: #e2e2e2; font-weight: 700; box-sizing: border-box; margin-left: 30px;}
.tab-menu li:first-child { margin-left: 0; }
.tab-menu li a { display: block; border-bottom: 4px solid transparent; }
.tab-menu.type01 li { width: 180px; }
.tab-menu.type02 li { width: 130px; }
.tab-menu li.active a { color: #676767; border-color: #3ABFEF; }
.tab-contents .tab-con { display: none; }
.tab-contents .tab-con.active { display: block; }
.tab-menu li.new span { display: inline-block; position: relative; }
.tab-menu li.new span:after { content: ""; display: inline-block; width: 10px; height: 10px; background: url(../img/icon/icon_new.png) no-repeat center; background-size: cover; position: absolute; top: 10px; right: -10px; }

/* ==================================================
	Date Picker
================================================== */
.date-picker-wrap { display: inline-block; }
.date-picker-wrap .divider { display: inline-block; margin: 0 6px;}
.date-picker-wrap .btn-search-period { margin-left: 6px; width: 80px; display: none; }
.date-picker { display: inline-block; position: relative; }
.date-picker .date-selector { position: relative; cursor: pointer; }
.date-picker .date-selector input { width: 140px; font-size: 1.3rem; font-weight: 700; color: #3ABFEF; cursor: pointer; }
.date-picker .date-selector input:read-only { background-color: #fff;}
.date-picker .date-selector .icon-calendar { position: absolute; top: 10px; right: 8px; }
.date-picker .calendar { position: absolute; top: 50px; left: 0; width: 370px; display: none; z-index: 3; }
.date-picker .calendar.active { display: block; }
.date-picker .pignose-calendar { margin: 0; }
.date-picker .pignose-calendar .pignose-calendar-unit a { color: #bbb; }
.date-picker .pignose-calendar .pignose-calendar-header .pignose-calendar-week { color: #919191;}
.date-picker .pignose-calendar .pignose-calendar-header .pignose-calendar-week:first-child { color: #F579A4; }
.date-picker .pignose-calendar .pignose-calendar-unit:first-child a { color: #F579A4; }
.date-picker .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-active a { background-color: #3ABFEF; color: #fff; box-shadow: none; }
.date-picker .pignose-calendar .icon-arrow-left { content: ""; display: inline-block; width: 13px; height: 11px; background: url(../img/icon/icon_arrow_prev.png) no-repeat center; background-size: cover; }
.date-picker .pignose-calendar .icon-arrow-right { content: ""; display: inline-block; width: 13px; height: 11px; background: url(../img/icon/icon_arrow_next.png) no-repeat center; background-size: cover; }
.date-picker .pignose-calendar .pignose-calendar-top { box-shadow: none; }
.date-picker .pignose-calendar .pignose-calendar-unit { height: 2.8em; }

.date-picker .pignose-calendar .icon-arrow-left:before,
.date-picker .pignose-calendar .icon-arrow-right:before { display: none; }

/* ==================================================
	Layer Popup
================================================== */
.layer-popup { display: table; position: fixed; top: 0; left: 0; z-index: -1; width: 100%; height: 100vh; text-align: center; visibility: hidden; }
.layer-popup.active { z-index: 1000; visibility: visible; }
.layer-popup .dim { position: absolute; top: 0; left: 0; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.8); z-index: -1; }
.layer-popup .wrapper { display: table-cell; vertical-align: middle; }
.layer-popup .wrapper .form { display: inline-block; padding: 30px 20px; background-color: #fff; border-radius: 38px; opacity: 0; margin-top: -100px; transition: all .3s ease; }
.layer-popup.active .wrapper .form { margin-top: 0; opacity: 1; transition: all .3s ease; }
.layer-popup .top { margin-bottom: 30px; }
.layer-popup .top h4 { float: left; font-size: 1.8rem; font-weight: 700; }
.layer-popup .top .btn-close { float: right; }
.layer-popup .btn-wrap { margin-top: 60px; }
.layer-popup .btn-wrap button { margin: 0 6px; }

.input-area .row { margin-bottom: 20px; }
.input-area .col { float: left; margin-left: 30px; }
.input-area .col:first-child { margin-left: 0; }

.layer-popup .tb-show-info tbody th { font-size: 1.5rem; font-weight: 300; line-height: 40px; text-align: left;}
.layer-popup .tb-show-info tbody td { font-size: 1.5rem; font-weight: 700; text-align: left; color: #676767;}

/* ==================================================
	Search Area
================================================== */
.search-area { margin-bottom: 10px;}
.search-area .left { float: left; }
.search-area .right { float: right; }
.search-area .tab-btns { display: inline-block; }
.search-area .tab-btns li { display: inline-block; margin-right: 5px; }
.search-area .tab-btns button { background-color: #fff; border: 1px solid #cbcbcb; color: #676767; }
.search-area .tab-btns li.active button { background-color: #3ABFEF; color: #fff; border-color: #3ABFEF;}

.select-with-sub { display: inline-block; vertical-align: top; }
.select-with-sub .sub-opts { display: inline-block; }
.select-with-sub .sub-opts .con { display: none; }
.select-with-sub .sub-opts .con.active { display: inline-block;}

/* ==================================================
	Table
	================================================== */
table caption { visibility: hidden; font-size: 0; height: 0; }

.tb-basic { table-layout: fixed; width: 100%; }
.tb-basic tbody td { height: 44px; }

/* dataTable로 문제 없을 시 삭제할 예정

.tb-basic { table-layout: fixed;  width:100%; }
.tb-basic thead th { font-size:1.3rem; color:#919191; text-align:center; }
.tb-basic tbody td { font-size:1.3rem; color:#676767; text-align:center; height:46px; }
.tb-basic thead th.ordering span { display:inline-block; position:relative; cursor:pointer; }
.tb-basic thead th.ordering span:after { content:""; display:inline-block; width:5px; height:9px; position:absolute; top:6px; right:-14px; background:url(../img/icon/icon_ordering.png) no-repeat -10px 0;}
.tb-basic thead th.ordering.default span:after { background-position:0 0; }
.tb-basic thead th.ordering.change-order span:after { background-position:-5px 0; }
.tb-basic tbody td.ta-l { padding-left:16px; }
.tb-basic tbody td.ta-r { padding-right:16px; }
.tb-basic tbody tr.disable td { opacity:0.3; }
.tb-basic tbody tr.disable td .more-dots-wrap .opt-list { display:none !important; }
.tb-basic tbody tr.disable td .a_list { display:none !important; }
.tb-basic tbody tr.active { border-radius:10px; box-shadow:0 3px 6px rgba(0,0,0,0.1)}
.tb-basic tbody tr.active td:first-child { border-radius:10px 0 0 10px; }
.tb-basic tbody tr.active td:last-child { border-radius:0 10px 10px 0; }

.tb-basic.type-check { border-collapse: separate; border-spacing:0 8px;}
.tb-basic.type-check tbody { border-collapse: separate; border-spacing:0 8px;}
.tb-basic.type-check tbody tr.active td { background-color:#fff; }

.tb-basic.type-check.blue tbody tr.active td { background-color:#3ABFEF; }
.tb-basic.type-check.blue tbody tr.active td { background-color:#3ABFEF; color:#fff;}
.tb-basic.type-check.blue tbody tr.active .my_value { color:#fff !important;}
.tb-basic.type-check.blue tbody tr.active .my_value > span { color:#fff !important; }
.tb-basic.type-check.blue tbody tr.active .select .icon-select-down {
background:url(../img/icon/icon_select_down_white.png) no-repeat center; background-size:cover;}
.tb-basic.type-check.blue tbody tr.active .icon-move-up { background:url(../img/icon/icon_move_up_white.png) no-repeat center; background-size:cover;}
.tb-basic.type-check.blue tbody tr.active .icon-move-down { background:url(../img/icon/icon_move_down_white.png) no-repeat center; background-size:cover;}
.tb-basic.type-check.blue tbody tr.active .icon-more-dots { background:url(../img/icon/icon_more_dots_white.png) no-repeat center; background-size:cover;}

.order-control { display:inline-block; }
.order-control button { margin:0 3px;}
*/

.more-dots-wrap { display: inline-block; position: relative; }
.more-dots-wrap .opt-list { display: none; width: 62px; background-color: #fff; padding: 6px 0; border: 1px solid #e2e2e2; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1); position: absolute; top: 20px; right: 0; box-sizing: border-box; z-index: 2; }
.more-dots-wrap .opt-list.active { display: inline-block; }
.more-dots-wrap .opt-list li { font-size: 1.1rem; color: #919191; cursor: pointer; line-height: 2.2rem; text-align: center; }
.more-dots-wrap .opt-list li:hover { font-size: 1.1rem; color: #F579A4; }

.tb-scroll { overflow: auto;}
.tb-scroll .tb-basic { min-width: 1200px; }

@media (max-width: 1280px) {
  .tb-scroll { width: 100%;}
}

/* ==================================================
	Data Table
	================================================== */
.dt-basic { position: relative; }
.dt-basic table.dataTable th { font-size: 1.3rem; color: #919191; text-align: center; font-weight: 400; }
.dt-basic table.dataTable td { font-size: 1.3rem; color: #676767; text-align: center; height: 46px; box-sizing: border-box; }
.dt-basic table.dataTable td.clip-wrap { padding: 0; }
.dt-basic table.dataTable td.clip-wrap i { margin-top: -2px; opacity: 0.8; }

.dt-basic table.dataTable thead th,
.dt-basic table.dataTable thead td { border-bottom: 0; }
.dt-basic table.dataTable tbody tr { background-color: transparent; }

.dt-basic table { table-layout: fixed; width: 100%; }
.dt-basic table.dt-table { border-collapse: separate; border-spacing: 0 8px;}
.dt-basic tbody { border-collapse: separate; border-spacing: 0 8px;}
.dt-basic tbody tr.active td { background-color: #fff; }

.dt-basic tbody td.ta-l { padding-left: 16px; }
.dt-basic tbody td.ta-r { padding-right: 16px; }
.dt-basic tbody tr.disable td { opacity: 0.3; }
.dt-basic tbody tr.disable td .more-dots-wrap .opt-list { display: none !important; }
.dt-basic tbody tr.disable td .a_list { display: none !important; }

.dt-basic tbody tr.active { border-radius: 10px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1)}
.dt-basic tbody tr.active td:first-child { border-radius: 10px 0 0 10px; }
.dt-basic tbody tr.active td:last-child { border-radius: 0 10px 10px 0; }

.dt-basic.normal tbody tr { border-radius: 10px; cursor: pointer;}
.dt-basic.normal tbody tr:hover { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1); }
.dt-basic.normal tbody tr:hover td { background-color: #fff; }
.dt-basic.normal tbody tr td:first-child { border-radius: 10px 0 0 10px; }
.dt-basic.normal tbody tr td:last-child { border-radius: 0 10px 10px 0; }
.dt-basic.selectable tbody tr { cursor: pointer; }

.dt-basic.check-type-blue tbody tr.active td { background-color: #3ABFEF; }
.dt-basic.check-type-blue tbody tr.active td { background-color: #3ABFEF; color: #fff;}
.dt-basic.check-type-blue tbody tr.active .my_value { color: #fff !important;}
.dt-basic.check-type-blue tbody tr.active .my_value > span { color: #fff !important; }
.dt-basic.check-type-blue tbody tr.active .select .icon-select-down {
  background: url(../img/icon/icon_select_down_white.png) no-repeat center; background-size: cover;}
.dt-basic.check-type-blue tbody tr.active .icon-move-up { background: url(../img/icon/icon_move_up_white.png) no-repeat center; background-size: cover;}
.dt-basic.check-type-blue tbody tr.active .icon-move-down { background: url(../img/icon/icon_move_down_white.png) no-repeat center; background-size: cover;}
.dt-basic.check-type-blue tbody tr.active .icon-more-dots { background: url(../img/icon/icon_more_dots_white.png) no-repeat center; background-size: cover;}

.dt-basic th,
.dt-basic td { white-space: nowrap; }
.dt-basic .dt-table { width: 100% !important;}
.dt-basic .dt-table.store-sales-total { width: 1700px !important;}

.dt-basic .dataTables_wrapper.no-footer .dataTables_scrollBody { border-bottom: 0; }
.dt-basic table.dataTable.no-footer { border-bottom: 0; }

.dt-basic table.dataTable thead th .ordering { display: inline-block; position: relative; }
.dt-basic table.dataTable thead th.sorting,
.dt-basic table.dataTable thead th.sorting_asc,
.dt-basic table.dataTable thead th.sorting_desc { background: none; }
.dt-basic table.dataTable thead th .icon-sort { display: inline-block; width: 5px; height: 9px; position: absolute; top: 6px; right: -16px; }
.dt-basic table.dataTable thead th.sorting .icon-sort { background: url(../img/icon/icon_ordering.png) no-repeat 0 0; }
.dt-basic table.dataTable thead th.sorting_asc .icon-sort { background: url(../img/icon/icon_ordering.png) no-repeat -5px 0; }
.dt-basic table.dataTable thead th.sorting_desc .icon-sort { background: url(../img/icon/icon_ordering.png) no-repeat -10px 0; }

.dt-basic .bottom-btns { position: absolute; right: 0; bottom: -50px; }
.dt-basic .bottom-btns button { margin-left: 10px; }
.dt-basic .bottom-total-sale { position: absolute; right: 0; bottom: -10px;}
.dt-basic .bottom-total-user { position: absolute; left: 0; bottom: -10px;}
.dt-basic .bottom-total-summary { position: absolute; right: 0; bottom: -40px; }
.dt-basic .bottom-total-summary .count { display: inline-block; margin-left: 50px; }

.dt-basic tfoot td { font-size: 1.5rem; font-weight: 700; }
.dt-basic tfoot td label { font-size: 1rem; font-weight: 400; }

.dt-basic tr.fc-red td { color: #F579A4;}

/* paginate */
.dt-basic .dataTables_wrapper .dataTables_paginate .paginate_button { color: #676767 !important; outline-width: 0; box-shadow: none !important;padding: 0; width: 26px; height: 26px; line-height: 26px; }
.dt-basic .dataTables_wrapper .dataTables_paginate .paginate_button.current { background: none; background-color: #3ABFEF !important; border: 0; border-radius: 50%; color: #fff !important;}
.dt-basic .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { background: none; border: 0; color: #fff !important;}
.dt-basic .dataTables_wrapper .dataTables_paginate .paginate_button:hover { background: none; color: #676767 !important; border-color: transparent; }
.dt-basic .dataTables_wrapper .dataTables_paginate .paginate_button.previous { text-indent: -9999px; width: 13px; height: 11px; background: url(../img/icon/icon_paging_prev.png) no-repeat center !important; background-size: 12px !important; vertical-align: middle; margin-right: 20px;}
.dt-basic .dataTables_wrapper .dataTables_paginate .paginate_button.next { text-indent: -9999px; width: 13px; height: 11px; background: url(../img/icon/icon_paging_next.png) no-repeat center !important; background-size: 12px !important; vertical-align: middle; margin-left: 20px;}

.select-store { margin-bottom: 30px; }
.select-store .inp-with-icon { width: 100%; margin-bottom: 30px; }
.select-store input[type="search"] { width: 100%; }
.select-store .list-wrap { float: left; width: 30%; }
.select-store .tags-wrap { float: left; width: 70%; padding-left: 30px; box-sizing: border-box; }
.select-store label { display: block; font-size: 1.2rem; font-weight: 700; margin-bottom: 10px; }
.select-store .list-wrap .list { height: 186px; overflow-y: auto; margin-bottom: 30px; }
.select-store .list-wrap .list li { font-size: 1.5rem; line-height: 2.4rem; color: #919191; cursor: pointer; }
.select-store .list-wrap .list li.active { color: #3ABFEF; font-weight: 700;}
.select-store .tags { height: 186px; overflow-y: auto; margin-bottom: 30px; }
.select-store .tags li { float: left; margin-right: 8px; margin-bottom: 8px; padding: 6px 10px; border-radius: 25px; background-color: #3ABFEF; color: #fff; }
.select-store .tags li span { display: inline-block; font-size: 1.2rem; line-height: 2.2rem; vertical-align: top; }
.select-store .tags li .btn-delete-tag { vertical-align: top; margin-left: 4px; }
.select-store #btn-select-all span,
.select-store #btn-delete-all span { font-size: 1.2rem; text-decoration: underline; }

.accordion { border-bottom: 1px solid #cfcfcf; }
.accordion .accordion-top { border-top: 1px solid #cfcfcf; padding: 0 20px; position: relative; cursor: pointer;}
.accordion .accordion-top h3 { display: inline-block; font-size: 1.3rem; font-weight: 700; width: 110px; line-height: 50px; vertical-align: middle;}
.accordion .accordion-top .left { float: left; }
.accordion .accordion-top .right { float: right; padding-top: 18px; }
.accordion .accordion-top .ment { display: inline-block; font-size: 1.2rem; width: 320px; vertical-align: middle; word-break: keep-all; color: #aaa;}
.accordion .accordion-top .count { display: inline-block; font-size: 1.3rem; margin-top: -4px; margin-right: 15px; vertical-align: middle; }
.accordion .accordion-top .btn-arrow { vertical-align: middle;}
.accordion .accordion-top .btn-arrow i { display: inline-block; width: 14px; height: 14px; background: url(../img/icon/icon_arrow_down.png) no-repeat center; background-size: cover; }
.accordion .accordion-top .btn-arrow.unfold i { background: url(../img/icon/icon_arrow_up.png) no-repeat center; background-size: cover; }
.accordion .history { display: none; background-color: #fff; padding: 7px 0; max-height: 150px; overflow-y: auto; }
.accordion .sec:first-child .history { display: block; }
.accordion .history li { font-size: 1.3rem; padding: 8px 20px; }
.accordion .history li span { display: inline-block; font-size: 1.1rem; margin-right: 20px; vertical-align: middle; }
.accordion .history li .date { width: 200px; }
.accordion .history li .ticket { width: 150px; }
.accordion .history li .status { width: 55px; margin-right: 0; }
.accordion .history li .store { width: 120px; margin-right: 0; }

.accordion .sec .btn-arrow.unfold i { background: url(../img/icon/icon_arrow_up.png) no-repeat center; background-size: cover; }

.select-radio-box li { float: left; width: 100px; line-height: 4.2rem; font-size: 1.5rem; color: #676767; text-align: center; border: 1px solid #ccc; margin-right: 10px; margin-bottom: 10px; border-radius: 10px; cursor: pointer; }
.select-radio-box li.active { background-color: #3DBEEF; border-color: #3DBEEF; color: #fff; }

.time-select-wrap { display: inline-block; }
.time-select-wrap .select { vertical-align: top; }
.time-select-wrap .divider { vertical-align: top; margin: 0 6px; line-height: 4.2rem; }

@media (max-width: 1440px) {
  .inp-sch-btn .inp-wrap input[type="search"] { width: 300px !important; }
}

@media (max-width: 1280px) {
  .dt-basic .dataTables_wrapper { width: 100%; }
  .dt-basic .dt-table { width: 1200px !important; }
}