@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;200;300;400;500;600;700;800;900&display=swap');


/* 221024 renewal */

/* common */
* {box-sizing: border-box; margin: 0; padding: 0; line-height: 1.4; font-family: 'Noto Sans Thai', sans-serif; font-weight: 400; font-size: 12px;}
input::-webkit-input-placeholder{color:#999; font-size:inherit;}
ul, li {list-style: none;}
a {color: inherit; text-decoration: none;}
b, strong, h1, h2, h3, h4, h5, h6 {font-weight: 700;}

input[type=tel],
input[type=text],
input[type=password],
input[type=email], 
input[type=search] {height: 32px; padding: 0 10px; border: solid 1px #ddd; max-width: 100%; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
input[type=tel][readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=email][readonly], 
input[type=search][readonly], 
input[type=tel][disabled],
input[type=text][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=email][disabled]{background:#f5f5f5; border-color:#c0c0c0; color:#666;}
textarea[readonly],
textarea[disabled]{color:#666;}
input[type=submit] {border-radius: 0px 0px 0px 0px; -moz-border-radius: 0px 0px 0px 0px; -webkit-border-radius: 0px 0px 0px 0px;}
input[type="checkbox"] {display: inline-block; vertical-align: middle; width: 18px; height: 18px; border: solid 1px #999; position: relative; cursor: pointer; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
input[type="checkbox"]:checked {border-color: #0082FF; background: #0082FF url('https://img.megastudyth.com/admin/checkbox.png')no-repeat center center / 12px auto;}
input[type="checkbox"] + label {display: inline-block; vertical-align: middle; cursor: pointer; margin-left: 5px;}
input[type="radio"] {display: inline-block; vertical-align: middle; width: 18px; height: 18px; border: solid 1px #999; position: relative; cursor: pointer; -webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%;}
input[type="radio"]:checked:after {content: ''; display: block; background: #000; position: absolute; left: 4px; right: 4px; top: 4px; bottom: 4px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%;}
input[type="radio"] + label {display: inline-block; vertical-align: middle; cursor: pointer; margin-left: 5px;}
input[type="file"] {font-size: 12px;}
select {height: 32px; padding-left: 10px; border: solid 1px #d9d9d9; cursor: pointer; padding-right: 22px; background: #fff url('https://img.megastudyth.com/admin/select_arrow.png')no-repeat center right 7px / 9px auto; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
textarea {resize: none; display: block; width: 100%; border: solid 1px #ddd; padding: 10px;}
button {cursor: pointer; background: none; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
.tal {text-align: left !important;}
.tac {text-align: center !important;}
.tar {text-align: right !important;}
.w100 {width: 100% !important; min-width: 100% !important;}



/* layout */
#header {width: 100%; height: 60px; background: #29334C; padding: 0 20px;}
#header:after {content: ''; display: table; clear: both;}
.header-logo {height: 60px; width: 170px; float: left; margin: 0; padding-top: 10px; cursor: pointer;}
.header-logo img {display: block; width: 100%;}
.header-logout {float: right; display: block; background: none; color: #fff; border: solid 1px #fff; padding: 0 10px; height: 30px; line-height: 28px; margin-top: 15px; cursor: pointer; -webkit-border-radius: 3px; border-radius: 3px;}
.header-title {position: fixed; z-index: 100; top: 0; left: 290px; color: #fff; text-transform: uppercase; font-size: 20px; margin: 0; height: 60px; line-height: 60px;}
.header-breadcrumb {position: fixed; z-index: 100; top: 20px; right: 120px; height: 20px; line-height: 20px; color: #fff; font-weight: 300;}
.msa-wrap {padding: 20px;}
.msa-wrap .msa-box {background: #fff; border: solid 1px #E9EBF1; padding: 20px; margin-bottom: 10px; min-width: 1280px; position: relative;}
.msa-wrap .msa-box:last-child {margin-bottom: 0;}
.msa-half {display: flex; margin: 0 -15px;}
.msa-half > div {width: 50%; padding: 0 15px;}


/* search */
.msa-sch {margin: -5px 0;}
.msa-sch table {width: 100%;}
.msa-sch th,
.msa-sch td {text-align: left; padding: 5px; font-size: 14px;}
.msa-sch th {font-weight: 700; font-size: 12px; text-align: right;}
.msa-sch td input[type="text"],
.msa-sch select {display: block; width: 100%;}
.list-chk.inline {display: inline-block;}
.list-chk:after {content: ''; display: block; clear: both;}
.list-chk li {margin-right: 20px; float: left; padding: 2px 0;}
.list-chk li:last-child {margin-right: 0;}

.list-ipt {}
.list-ipt li {margin-bottom: 5px;}
.list-ipt li:last-child {margin-bottom: 0;}

.msa-sch__bot {position: relative; padding-right: 80px; height: 32px;}
.msa-sch__bot.chk {padding-left: 400px;}
.msa-sch__bot.chk.col2 {padding-left: 300px;}
.msa-sch__bot--input {display: block; width: 100%;}
.msa-sch__bot--submit {display: block; height: 32px; line-height: 32px; width: 80px; text-align: center; cursor: pointer; background: #29334C; color: #fff; border: none; position: absolute; right: 0; top: 0;}
.msa-sch__bot--chk {position: absolute; left: 0; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); width: 400px;}
.msa-sch__bot--chk.col2 {width: 300px;}
.msa-sch__double {display: flex;}
.msa-sch__double a,
.msa-sch__double button {display: block; height: 32px; line-height: 32px; width: 80px; text-align: center; cursor: pointer; border: none; background: #e5e5e5; border: solid 1px #ccc; margin-right: 10px;}
.msa-sch__double a.nvy,
.msa-sch__double button.nvy {background: #29334C; border-color: #29334C; color: #fff;}

.msa-sch__date {height: 32px;}
.msa-sch__date:after {content: ''; display: table; clear: both;}
.msa-sch__date li {float: left; width: 45%; position: relative;}
.msa-sch__date li:nth-child(2) {width: 10%; text-align: center; height: 32px; line-height: 32px;}
.msa-sch__date li input[readonly] + img {display: block; width: 16px; position: absolute; right: 8px; top: 50%; margin-top: -8px; cursor: pointer;}


/* list */
.msa-info {margin-bottom: 10px; position: relative;}
.msa-info.bot {margin-bottom: 0; margin-top: 10px;}
.msa-info .left {position: absolute; left: 0; bottom: 0;}
.msa-info > a,
.msa-info > button {float: left;}
.msa-info:after {content: ''; display: table; clear: both;}
.msa-info ul {float: right;}
.msa-info ul:after {content: ''; display: table; clear: both;}
.msa-info ul li {float: left; margin-right: 5px;}
.msa-info ul li:last-child {margin-right: 0;}
.msa-info ul li a {display: block;}

.msa-btn {display: inline-block; vertical-align: middle; cursor: pointer; background: none; border: solid 1px #0082FF; color: #0082FF; font-size: 12px; padding: 5px 15px; -webkit-border-radius: 3px !important; border-radius: 3px !important;}
.msa-btn.sm {padding: 3px 10px; font-size: 11px;}
.msa-btn.xsm {padding: 1px 5px; font-size: 10px;}
.msa-btn:hover,
.msa-btn.blu {background: #0082FF; color: #fff;}
.msa-btn.red {background: #f00; border-color: #f00; color: #fff;}
.msa-btn.grn {background: green; border-color: green; color: #fff;}
.msa-btn.gry {background: #ddd; border-color: #ddd; color: #fff;}
.msa-btn.bk {background: #333; border-color: #333; color: #fff;}
.msa-btn.up,
.msa-btn.down {height: 24px; width: 24px; text-indent: -9999px; padding: 0; position: relative;}
.msa-btn.up:after,
.msa-btn.down:after {border-left: 5px solid transparent; border-right: 5px solid transparent; content: ''; display: block; position: absolute; left: 50%; top: 50%; margin-left: -5px; margin-top: -3px;}
.msa-btn.up:after {border-bottom: 6px solid #0082FF;}
.msa-btn.down:after {border-top: 6px solid #0082FF;}
.msa-btn.up:hover:after {border-bottom-color: #fff;}
.msa-btn.down:hover:after {border-top-color: #fff;}

.msa-tb {border-collapse: collapse; width: 100%;}
.msa-tb.fixed {table-layout: fixed;}
.msa-tb.school {width: 3000px;}
.msa-tb.list tr:hover {background: #e8f4ff;}
.msa-tb th,
.msa-tb td {padding: 10px; text-align: center; border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; word-break: break-all;}
.msa-tb.bdl th,
.msa-tb.bdl td {border-left: solid 1px #ddd;}
.msa-tb.bdr th,
.msa-tb.bdr td {border-right: solid 1px #ddd;}
.msa-tb.bdl th:before,
.msa-tb.bdl td:before {content: ''; display: block; width: 1px; background: #ddd; position: absolute; left: -1px; top: 0; bottom: 0;}
.msa-tb.bdr th:after,
.msa-tb.bdr td:after {content: ''; display: block; width: 1px; background: #ddd; position: absolute; right: -1px; top: 0; bottom: 0;}

.msa-tb.bdl th span {display: block;}
.msa-tb.bdl th span:before,
.msa-tb.bdl th span:after {content: ''; display: block; height: 1px; background: #ddd; position: absolute; left: 0; right: 0;}
.msa-tb.bdl th span:before {top: -1px;}
.msa-tb.bdl th span:after {bottom: -1px;}


.msa-tb.sm th,
.msa-tb.sm td {font-size: 11px; padding: 8px 4px;}
.msa-tb th {background: #f5f5f5; font-size: 12px;}
.msa-tb td {font-size: 12px;}
.msa-tb td a.title {font-weight: 700; text-decoration: underline; word-break: break-all;}
.msa-tb td.msa-tb__content {padding: 30px 20px;}
.msa-tb td.msa-tb__content img {max-width: 100%;}
.msa-tb img {max-width: 100%;}

.msa-sort {display: inline-block; vertical-align: middle; text-indent: -9999px; width: 11px; height: 12px; margin-right: -6px; margin-top: -2px; cursor: pointer;}
.msa-sort.asc {background: url('https://img.megastudyth.com/admin/sort_asc.png')no-repeat center center / 5px auto;}
.msa-sort.desc {background: url('https://img.megastudyth.com/admin/sort_desc.png')no-repeat center center / 5px auto;}
.msa-sort:hover {border: solid 1px #333;}

.msa-title {margin-bottom: 10px; margin-top: 30px; font-size: 18px; letter-spacing: -0.025em; position: relative; padding-left: 10px; line-height: 1.0;}
.msa-title:before {content: ''; display: block; width: 3px; height: 15px; background: #0082FF; position: absolute; left: 0; top: 50%; margin-top: -10px;}
.msa-text {font-size: 12px;}

.mt0 {margin-top: 0 !important;}
.mt5 {margin-top: 5px !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}
.mb0 {margin-bottom: 0 !important;}
.mb5 {margin-bottom: 5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb20 {margin-bottom: 20px !important;}
.ml5 {margin-left: 5px !important;}
.ml10 {margin-left: 10px !important;}
.mr5 {margin-right: 5px !important;}
.mr10 {margin-right: 10px !important;}
.pd20 {padding: 20px !important;}
.pd0 {padding: 0px !important;}
.w100 {width: 100%;}
span.red {color: #f00 !important;}
span.blu {color: #0082FF !important;}
span.grn {color: #29a500 !important;}
span.gry {color: #888 !important;}


.paging {text-align: center; margin-top: 20px;}
.paging a {width: 30px; height: 30px; line-height: 28px; text-align: center; border: solid 1px #ddd; font-size: 12px;}
.paging > a {display: inline-block; vertical-align: middle; text-indent: -9999px; margin: 0 2px;}
.paging > a.first {background: url('https://img.megastudyth.com/common/paging_first.png') no-repeat center center / 12px auto;}
.paging > a.prev {background: url('https://img.megastudyth.com/common/paging_prev.png') no-repeat center center / 12px auto;}
.paging > a.next {background: url('https://img.megastudyth.com/common/paging_next.png') no-repeat center center / 12px auto;}
.paging > a.last {background: url('https://img.megastudyth.com/common/paging_last.png') no-repeat center center / 12px auto;}
.paging > a.disabled {opacity: 0.3;}
.paging ul {display: inline-block; vertical-align: middle; margin: 0 10px; height: 30px;}
.paging ul:after {content: ''; display: table; clear: both;}
.paging ul li {float: left; margin-right: 5px;}
.paging ul li:last-child {margin-right: 0;}
.paging ul li a {display: block;}
.paging ul li a.on {font-weight: 700; color: #007af3;}

.msa-time {text-align: center;}
.msa-time li {display: inline-block;}
.msa-time li input {width: 40px;}

.msa-tab {}
.msa-tab:after {content: ''; display: table; clear: both;}
.msa-tab li {float: left; margin-right: -1px;}
.msa-tab li button,
.msa-tab li a {display: block; border: solid 1px #aaa; height: 34px; line-height: 32px; padding: 0 15px; position: relative;}
.msa-tab li button.on,
.msa-tab li a.on {background: #0082FF; border-color: #0082FF; color: #fff; z-index: 1;}
.msa-tab.navy li button.on,
.msa-tab.navy li a.on {background: #29334C; border-color: #29334C; color: #fff; z-index: 1;}
.msa-tab.sm li {margin-right: 2px; margin-bottom: 2px;}
.msa-tab.sm li button,
.msa-tab.sm li a {height: 30px; line-height: 28px; padding: 0 5px; font-size: 11px; -webkit-border-radius: 3px; border-radius: 3px;}
.msa-tab li:first-child button,
.msa-tab li:first-child a {-webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px;}
.msa-tab li:last-child button,
.msa-tab li:last-child a {-webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;}

.msa-school {display: inline-block; background:#fff; padding: 20px; margin: -20px; margin-right: 20px;}
.msa-pop {position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1000; background: rgba(0,0,0,0.5);}
.msa-pop > div {display: table; width: 100%; height: 100%;}
.msa-pop > div > div {display: table-cell; width: 100%; vertical-align: middle;}
.msa-pop__box {background: #fff; padding: 30px; width: 100%; max-width: 420px; margin: 0 auto; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 20%); box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 20%);}
.msa-pop__title {font-size: 14px;}
.msa-pop__top {background: #29334C; padding: 10px 20px;}
.msa-pop__top:after {content: ''; display: table; clear: both;}
.msa-pop__top h3 {float: left; color: #fff; height: 30px; line-height: 30px; font-size: 20px;}
.msa-pop__close {float: right; width: 30px; height: 30px; margin-right: -10px; text-indent: -9999px; position: relative; background: none; border: none; cursor: pointer;}
.msa-pop__close:before,
.msa-pop__close:after {content: ''; display: block; width: 20px; height: 2px; background: #fff; position: absolute; left: 50%; top: 50%; margin-left: -10px; margin-top: -1px;}
.msa-pop__close:before {transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);}
.msa-pop__close:after {transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg);}

.msa-layer {display: none; background: #fff; position: fixed; left: 50%; top: 50%; z-index: 9999; width: 400px; border: solid 2px #29334C; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%);}
.msa-layer__top {background: #29334C; padding: 10px 20px;}
.msa-layer__top:after {content: ''; display: table; clear: both;}
.msa-layer__title {float: left; color: #fff; height: 30px; line-height: 30px; font-size: 16px; font-weight: 500;}
.msa-layer__close {display: block; float: right;}
.msa-layer__cont {padding: 30px 20px;}



.msa-period {}
.msa-period .msa-sch__date {display: inline-block; vertical-align: middle; margin-right: 20px;}
.msa-period b {margin-right: 10px;}
.msa-period span {margin-right: 20px; font-size: 20px; font-weight: 700; color: #0082FF; display: inline-block; padding-right: 20px; position: relative;}
.msa-period span:after {content: ''; display: block; width: 1px; height: 14px; background: #aaa; position: absolute; right: 0; top: 50%; margin-top: -7px;}
.msa-period span:last-child {padding-right: 0; margin-right: 0;}
.msa-period span:last-child:after {display: none;}

.msa-addlist {}
.msa-addlist:after {content: ''; display: table; clear: both;}
.msa-addlist li {float: left; margin-right: 5px; margin-bottom: 5px;}
.msa-addlist li > div {border: solid 1px #aaa; position: relative; padding: 5px 30px 5px 10px; -webkit-border-radius: 20px; border-radius: 20px;}
.msa-addlist li span {display: block;}
.msa-addlist li a {display: block; width: 20px; height: 20px; position: absolute; right: 5px; top: 50%; margin-top: -10px; text-indent: -9999px;}
.msa-addlist li a:before,
.msa-addlist li a:after {content: ''; display: block; width: 12px; height: 2px; background: #666; position: absolute; left: 50%; top: 50%; margin-left: -6px; margin-top: -1px;}
.msa-addlist li a:before {transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.msa-addlist li a:after {transform: rotate(45deg); -webkit-transform: rotate(45deg);}


/* login */
#login {display: table; width: 100%; height: 100%; position: relative;}
#login:after {content: ''; display: table-cell; width: 50%; height: 100%; background: #0082FF url('https://img.megastudyth.com/admin/login_logo.png')no-repeat center center / 140px auto;}
.login-vertical {display: table-cell; width: 50%; vertical-align: middle;}
.login-box {width: 320px; margin: 0 auto;}
.login-title {text-align: center; font-size: 30px; margin-bottom: 20px;}
.login-title:before {content: ''; display: inline-block; vertical-align: middle; margin-top: -10px; width: 180px; margin-right: 13px; height: 35px; border-right: solid 1px #666; background: url('https://img.megastudyth.com/admin/login_megastudy.png')no-repeat left center / auto 100%;}
.login-form li {margin-bottom: 10px;}
.login-form li:last-child {margin-bottom: 0;}
.login-input {display: block; width: 100%; height: 40px !important; border: solid 1px #E8E6F8; background: #F7F7FD; -webkit-border-radius: 3px; border-radius: 3px;}
.login-submit {display: block; text-align: center; cursor: pointer; height: 50px; line-height: 50px; background: #29334C; color: #fff; font-size: 16px; font-weight: 700; -webkit-border-radius: 3px; border-radius: 3px;}
.login-text {text-align: center; font-size: 11px; color: #4B5C6D; margin-top: 30px; letter-spacing: -0.075em;}
.login-copy {font-size: 12px; text-align: center; color: #BCBFCD; left: 0; bottom: 30px; width: 50%; position: absolute;}

@media all and (max-width: 992px){
	#login:after {display: none;}
	.login-vertical {width: 100%;}
}





/* dashboard */
#dashboard {padding: 15px; position: relative;}
.dsh-row {min-width: 1100px;}
.dsh-row:after {content: ''; display: table; clear: both;}
.min-row__none {min-width: auto;}
.dsh-col {float: left; padding: 5px;}
.dsh-col.col20 {width: 20%;}
.dsh-col.col25 {width: 25%;}
.dsh-col.col30 {width: 30%;}
.dsh-col.col33 {width: 33.3333%;}
.dsh-col.col35 {width: 35%;}
.dsh-col.col40 {width: 40%;}
.dsh-col.col50 {width: 50%;}
.dsh-col.col60 {width: 60%;}
.dsh-col.col70 {width: 70%;}
.dsh-col.col75 {width: 75%;}
.dsh-col.col80 {width: 80%;}
.dsh-col.col100 {width: 100%;}
.dsh-box > .dsh-row {margin-left: -5px; margin-right: -5px; min-width: 100%;}
.dsh-box {background: #fff; border: solid 1px #E9EBF1; padding: 40px 30px; position: relative; -webkit-border-radius: 3px; border-radius: 3px;}
.dsh-title {font-size: 22px; float: left; height: 32px; line-height: 32px; letter-spacing: -0.025em;}
.dsh-date {}
.dsh-date:after {content: ''; display: table; clear: both;}
.dsh-date li {float: left; margin-right: 3px; position: relative;}
.dsh-date li:last-child {margin-right: 0;}
.dsh-date li:nth-child(2) {height: 32px; line-height: 32px; text-align: center;}
.dsh-date li input {width: 120px; -webkit-border-radius: 3px; border-radius: 3px;}
.dsh-date li input[readonly] {background: #fff; padding-right: 30px;}
.dsh-date li input[readonly] + img {display: block; width: 16px; position: absolute; right: 8px; top: 50%; margin-top: -8px; cursor: pointer;}
.dsh-date li button {display: block; width: 32px; height: 32px; line-height: 32px; text-indent: -9999px; background: #29334C url('https://img.megastudyth.com/common/gnb_search.png')no-repeat center center / 16px auto; color: #fff; border: none; -webkit-border-radius: 3px; border-radius: 3px;}

.dsh-thumb {height: 250px;}

.dsh-tab {}
.dsh-tab:after {content: ''; display: table; clear: both;}
.dsh-tab li {float: left; margin-right: -1px;}
.dsh-tab li button,
.dsh-tab li a {display: block; height: 32px; line-height: 30px; padding: 0 10px; border: solid 1px #c0c0c0; position: relative; background: #fff;}
.dsh-tab li button.on,
.dsh-tab li a.on {background: #0082FF; border-color: #0082FF; color: #fff; z-index: 1;}
.dsh-tab li:first-child button,
.dsh-tab li:first-child a {-webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px;}
.dsh-tab li:last-child button,
.dsh-tab li:last-child a {-webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;}
.dsh-tab.lg li button,
.dsh-tab.lg li a {height: 40px; line-height: 38px; padding: 0 15px; font-size: 14px; width: 100px; text-align: center;}
.dsh-sales {margin: -10px;}
.dsh-sales:before {font-size: 12px; font-weight: 500; color: #aaa; display: inline-block; height: 18px; line-height: 18px;}
.dsh-sales#dash_a:before {content: "this year, this week";}
.dsh-sales#dash_b:before {content: "last year, this week";}
.dsh-sales#dash_m:before {content: "current month's";}
.dsh-sales#dash_y:before {content: "current year's";}
.dsh-sales h5 {font-size: 16px; height: 25px; line-height: 25px;}
.dsh-sales h6 {display: inline-block; vertical-align: middle; height: 18px; line-height: 18px; margin-top: -4px; margin-left: 5px; font-weight: 500; background: #0082FF; color: #fff; font-size: 10px; padding: 1px 5px; -webkit-border-radius: 20px; border-radius: 20px;}
.dsh-sales h4 { position: relative; font-weight: 700; font-size: 25px; line-height: 1.0; margin-top: 5px; height: 30px; line-height: 30px; margin-top: 10px;}
.dsh-sales ul {position: absolute; right: 20px; width: 170px; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%);}
.dsh-sales ul li {padding: 3px 0;}
.dsh-sales dl {position: relative;}
.dsh-sales dl:before {content: ''; display: block; position: absolute; left: 0; right: 0; top: 50%; border-bottom: dotted 1px #aaa;}
.dsh-sales dl:after {content: ''; display: table; clear: both;}
.dsh-sales dl dt {float: left; font-size: 12px; padding-right: 5px; background: #fff; z-index: 1; position: relative;}
.dsh-sales dl dt span {display: inline-block; vertical-align: middle; margin-top: -1px; background: #bbb; color: #fff; font-size: 10px; margin-left: 5px; padding: 0 5px; -webkit-border-radius: 10px; border-radius: 10px;}
.dsh-sales dl dd {float: right; font-size: 12px; padding-left: 5px; background: #fff;  z-index: 1; position: relative;}
.dsh-sales dl dd b {color: #000; font-size: 12px;}
.dsh-sales p {}
.dsh-sales p b {margin-right: 5px;}
.dsh-sales p.up b {color: #53bb41;}
.dsh-sales p.down b {color: #e94b4b;}
.dsh-sales p:before {}
.dsh-sales p.up:before {}
.dsh-sales p.down:before {}
.dsh-sales__name {font-size: 16px; font-weight: 500; margin-bottom: 5px; color: #aaa; display: inline;}
.dsh-exc {float: right; padding-top: 13px;}

.dsh-compared {margin-top: -10px;}
.dsh-compared h5 {font-size: 19px; letter-spacing: -0.025em; line-height: 1.2;}
.dsh-compared h5 span {display: block; font-size: 12px; color: #666; margin-top: 2px;}
.dsh-compared h5 span:before {content: '(';}
.dsh-compared h5 span:after {content: ')';}
.dsh-compared > ul {margin-top: 15px;}
.dsh-compared > ul > li {margin-bottom: 5px;}
.dsh-compared > ul > li:last-child {margin-bottom: 0;}
.dsh-compared > ul > li > ul {}
.dsh-compared > ul > li > ul:after {content: ''; display: table; clear: both;}
.dsh-compared > ul > li > ul > li {float: left; width: 50%; font-size: 11px;}
.dsh-compared > ul > li > ul.col1 > li {width: 100%;}
.dsh-compared > ul > li > ul > li:before {display: inline-block; vertical-align: middle; margin-right: 4px; font-size: 10px;}
/* .dsh-compared > ul > li > ul > li.up:before {background: url('https://img.megastudyth.com/admin/dashboard_up.png')no-repeat center center / cover;}
.dsh-compared > ul > li > ul > li.down:before {background: url('https://img.megastudyth.com/admin/dashboard_down.png')no-repeat center center / cover;} */
.dsh-compared > ul > li > ul > li.up:before {content: '▲'; color: #00b31e;}
.dsh-compared > ul > li > ul > li.down:before {content: '▼'; color: #f00;}
.dsh-compared > ul > li > ul > li.dash:before {content: ''; height: 1px; background: #333; width: 8px; margin-left: 1px; margin-right: 5px;}

.dsh-sales__top {padding-bottom: 15px; margin-bottom: 15px; border-bottom: solid 1px #e5e5e5;}
.dsh-sales__top:after {content: ''; display: table; clear: both;}
.dsh-sales__top .dsh-title {float: left;}
.dsh-sales__top .dsh-date {float: left; margin-left: 20px;}

.dsh-sales__mode {float: right;}
.dsh-sales__mode li button:before {content: ''; display: inline-block; vertical-align: middle; width: 13px; height: 13px; margin-top: -2px; margin-right: 7px; background: #eee;}
.dsh-sales__mode li button.graph:before {background: url('https://img.megastudyth.com/admin/dashboard_tab_graph.png')no-repeat center center / cover;}
.dsh-sales__mode li button.table:before {background: url('https://img.megastudyth.com/admin/dashboard_tab_table.png')no-repeat center center / cover;}
.dsh-sales__mode li button.graph.on:before {background: url('https://img.megastudyth.com/admin/dashboard_tab_graph_on.png')no-repeat center center / cover;}
.dsh-sales__mode li button.table.on:before {background: url('https://img.megastudyth.com/admin/dashboard_tab_table_on.png')no-repeat center center / cover;}

.dsh-sales__user {}
.dsh-sales__user th,
.dsh-sales__user td {font-size: 12px;}
.dsh-sales__user th {text-align: left; padding-right: 20px;}
.dsh-sales__user td {text-align: right;}
.dsh-sales__user td b {font-weight: 700; font-size: 15px;}

.dsh-sales__period {float: left; margin-left: 15px;}
.dsh-sales__wkly {float: left; margin-left: 10px; margin-top: 7px;}

.dsh-sales__row {margin: 0 -10px;}
.dsh-sales__row:after {content: ''; display: table; clear: both;}
.dsh-sales__left {float: left; width: calc(100% - 500px); padding-right: 30px;}
.dsh-sales__right {float: left; width: 500px;}
.dsh-sales__right:after {content: ''; display: table; clear: both;}
.dsh-sales__grph {padding: 0 10px;}
.dsh-sales__tb {width: 100%; border-collapse: collapse; font-size: 12px; table-layout: fixed;}
.dsh-sales__tb th,
.dsh-sales__tb td {border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; text-align: center;}
.dsh-sales__tb th {padding: 9px;}
.dsh-sales__tb td {padding: 21px 20px;}
.dsh-sales__tb td b {font-size: 16px; font-weight: 700;}
.dsh-sales__cont {display: none; height: 240px; overflow: hidden;}

.dsh-sales__table {position: relative; padding-top: 39px;}
#dsh-table__top {position: absolute; left: 0; right: 0; top: 0; padding-right: 17px; background: #f5f5f5; border-top: solid 1px #ddd; border-bottom: solid 1px #ddd;}
#dsh-table__top .msa-tb {margin-top: -1px;}
#dsh-table__top .msa-tb th {line-height: 16px; border-bottom: none; padding: 11px 10px;}
.dsh-sales__scroll {height: 201px; overflow-y: auto;}
#dsh-table__bot {}



.dash-none {width: 100%; height: 100%; background: url('https://img.megastudyth.com/admin/admin_bg.png')no-repeat center center;}
.dash-donut__count {}
.dash-donut__count p {font-size: 14px; font-weight: 700;}
.dash-donut__count h5 {font-size: 26px; font-weight: 700; line-height: 1.0; white-space: nowrap;}
.dash-donut__count span {display: block; font-size: 11px; color: #aaa;}
.dash-donut__half {border: solid 1px #e5e5e5; padding: 10px 0; height: 250px;}
.dash-donut__half:after {content: ''; display: table; clear: both;}
.dash-donut__legend {height: 160px; float: left; width: calc(100% - 200px); position: relative; z-index: 1; padding-top: 40px; padding-left: 20px;}
.dash-donut__legend > div {}
.dash-donut__list {margin-top: 10px;}
.dash-donut__list ul {}
.dash-donut__list ul li {margin-bottom: 5px;}
.dash-donut__list ul li:last-child {margin-bottom: 0;}
.dash-donut__list ul li em {display: inline-block; vertical-align: middle; width: 20px; height: 8px; margin-right: 3px; -webkit-border-radius: 5px; border-radius: 5px;}
.dash-donut__list ul li b {vertical-align: middle;}
.dash-donut__list ul li span {vertical-align: middle;}
.dash-donut__chart {float: left;}

.dash-donut__slider {border: solid 1px #e5e5e5; position: relative;}
.dash-donut__slider .dash-donut__half {border: none; height: 248px !important;}
.dash-donut__slider .slick-dots {position: absolute; left: 10px; top: 10px;}
.dash-donut__slider .slick-dots:after {content: ''; display: table; clear: both;}
.dash-donut__slider .slick-dots li {float: left; margin-right: 5px;}
.dash-donut__slider .slick-dots li:last-child {margin-right: 0;}
.dash-donut__slider .slick-dots li button {display: block; width: 10px; height: 10px; border: none; background: #ddd; text-indent: -9999px; -webkit-border-radius: 50%; border-radius: 50%;}
.dash-donut__slider .slick-dots li.slick-active button {background: #0082FF;}
.dash-donut__slider .slick-arrow {position: absolute; top: 6px; z-index: 1; width: 24px; height: 24px; border: solid 1px #c0c0c0; text-indent: -9999px;}
.dash-donut__slider .slick-prev {right: 30px; border-right: none;}
.dash-donut__slider .slick-next {right: 6px;}
.dash-donut__slider .slick-arrow:before,
.dash-donut__slider .slick-arrow:after {content: ''; display: block; width: 6px; height: 1px; background: #000; position: absolute; left: 50%; top: 50%; margin-left: -3px;}
.dash-donut__slider .slick-arrow:before {transform: rotate(45deg); -webkit-transform: rotate(45deg);}
.dash-donut__slider .slick-arrow:after {transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.dash-donut__slider .slick-prev:before {margin-top: 1px;}
.dash-donut__slider .slick-prev:after {margin-top: -3px;}
.dash-donut__slider .slick-next:before {margin-top: -3px;}
.dash-donut__slider .slick-next:after {margin-top: 1px;}
.dash-donut__schoolLv h5 {font-size: 14px;}

.dsh-head {padding: 0 20px;}
.dsh-head:after {content: ''; display: table; clear: both;}
.dsh-head h2 {float: left; font-size: 30px; letter-spacing: -0.025em;}
.dsh-join {margin-top: 15px; padding-top: 10px; border-top: dotted 1px #ddd;}
.dsh-join:after {content: ''; display: table; clear: both;}
.dsh-join li {float: left; width: 50%; padding: 0 20px; position: relative;}
.dsh-join li:before {content: ''; display: block; width: 14px; height: 10px; position: absolute; left: 0; top: 50%; margin-top: -7px;}
.dsh-join li:first-child:before {background: url('https://img.megastudyth.com/admin/dashboard_person1.png')no-repeat center center / cover;}
.dsh-join li:last-child:before {background: url('https://img.megastudyth.com/admin/dashboard_person2.png')no-repeat center center / cover;}
.dsh-join li dl:after {content: ''; display: table; clear: both;}
.dsh-join li dl dt {float: left;}
.dsh-join li dl dd {float: left; margin-left: 10px;}

.dsh-rank {padding: 20px; border: solid 1px #e5e5e5; height: 250px;}
.dsh-rank__top {margin-bottom: 20px;}
.dsh-rank__top:after {content: ''; display: table; clear: both;}
.dsh-rank__top h5 {float: left; font-size: 22px; height: 32px; line-height: 32px;}
.dsh-rank__top .dsh-tab {float: right;}
#topItemList ul {display: none;}
.dsh-rank__list {}
.dsh-rank__list li {margin-bottom: 8px;}
.dsh-rank__list li:last-child {margin-bottom: 0;}
.dsh-rank__list li em {display: inline-block; margin-right: 10px; vertical-align: middle; font-style: normal; width: 18px; height: 18px; line-height: 18px; text-align: center; background: #0082FF; color: #fff; font-size: 12px; font-weight: 500; -webkit-border-radius: 5px; border-radius: 5px;}
.dsh-rank__list li p {display: inline-block; vertical-align: middle; max-width: 75%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.dsh-rank__list li span {display: inline-block; vertical-align: middle; margin-top: -1px; background: #bbb; color: #fff; font-size: 11px; margin-left: 5px; padding: 0 5px; -webkit-border-radius: 10px; border-radius: 10px;}
.dsh-rank__list li.nodata {text-align: center; line-height: 120px; font-size: 16px; color: #aaa;}



#loading {position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 100; background: rgba(0,0,0,0.1);}
#loading > div {display: table; width: 100%; height: 100%;}
#loading > div > div {display: table-cell; width: 100%; vertical-align: middle;}
#loading > div > div > div {background: #fff; width: 150px; margin: 0 auto; padding: 25px 0;
	-webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.15); box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.15);
	-webkit-border-radius: 10px; border-radius: 10px;
}
#loading > div > div > div:after {content: 'Loading...'; text-align: center; display: block; font-size: 20px; margin-top: 10px; font-weight: 700;}
#loading img {display: block; margin: 0 auto; width: 70px;}



/* 메모작성 */
.memo-apply {position: relative; padding-right: 80px;}
.memo-apply textarea {display: block; width: 100%; height: 80px; resize: none; box-sizing: border-box; padding: 10px; border-color: #aaa; border-right: none;}
.memo-apply button,
.memo-apply input[type="submit"],
.memo-apply a {display: block; width: 80px; height: 80px; background: #29334C; border: solid 1px #29334C; color: #fff; position: absolute; right: 0; top: 0; cursor: pointer;}

.cmt-list {}
.cmt-list h6 {font-weight: 400;}
.cmt-list h6:after {content: ''; display: table; clear: both;}
.cmt-list h6 a {display: block; float: right;}
.cmt-list p {font-size: 14px; font-weight: 500;}

.hairmetal {position: fixed; left: 0; bottom: 0; z-index: 1000; padding: 10px; word-break: break-all; font-family: 'dotum', sans-serif; font-size: 11px; width: 268px; box-sizing: border-box; text-align: left;}
.funcNav {display: none;}




.cart-pop__title {font-size: 13px; margin-bottom: 3px; margin-top: 15px;}
.cart-pop__course {margin: -2px;}
.cart-pop__course:after {content: ''; display: table; clear: both;}
.cart-pop__course li {width: 50%; float: left; padding: 2px;}
.cart-pop__course li:last-child {width: 100%;}
.cart-pop__course li select {display: block; width: 100%;}
.cart-pop__num {}
.cart-pop__num input[type="text"] {width: 100px;}







.edit-top {position: relative; padding-left: 60px; padding-right: 100px; margin-top: 30px; margin-bottom: 10px;}
.edit-top h5 {position: absolute; left: 0; top: 0; height: 32px; line-height: 32px; font-size: 14px;}
.edit-top input[type="text"] {display: block; width: 100%;}
.edit-top a {display: block; position: absolute; right: 0; top: 0;}
.edit-prv {position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 1000; display: none;}
.edit-prv > div {display: table; width: 100%; height: 100%;}
.edit-prv > div > div {display: table-cell; width: 100%; vertical-align: middle;}
.edit-prv__box {background: #fff; margin: 0 auto; width: 1100px; -webkit-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.25); box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.25);}
.edit-prv__top {border-bottom: solid 1px #e5e5e5; position: relative;}
.edit-prv__mode {text-align: center;}
.edit-prv__mode li {display: inline-block; vertical-align: middle;}
.edit-prv__mode li button {display: block; width: 50px; height: 50px; border: none; text-indent: -9999px; position: relative;}
.edit-prv__mode li button.pc {background: url('https://img.megastudyth.com/admin/edit_preview_pc.png')no-repeat center center; margin-right: 5px;}
.edit-prv__mode li button.tablet {background: url('https://img.megastudyth.com/admin/edit_preview_tablet.png')no-repeat center center;}
.edit-prv__mode li button.mobile {background: url('https://img.megastudyth.com/admin/edit_preview_mobile.png')no-repeat center center;}
.edit-prv__mode li button.pc.on {background: url('https://img.megastudyth.com/admin/edit_preview_pc_on.png')no-repeat center center;}
.edit-prv__mode li button.tablet.on {background: url('https://img.megastudyth.com/admin/edit_preview_tablet_on.png')no-repeat center center;}
.edit-prv__mode li button.mobile.on {background: url('https://img.megastudyth.com/admin/edit_preview_mobile_on.png')no-repeat center center;}
.edit-prv__mode li button:after {content: attr(data-title); text-indent: 0; display: block; background: rgba(0,0,0,0.5); color: #fff; padding: 3px 5px; position: absolute; top: 100%; left: 50%; opacity: 0; font-family: 'dotum', sans-serif; white-space: nowrap; font-size: 11px; margin-top: -5px; transform: translate(-50%, 0); -webkit-transition: all 0.4s; transition: all 0.4s; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
.edit-prv__mode li button:hover:after {margin-top: 5px; opacity: 1.0;}
.edit-prv__close {display: block; position: absolute; right: 0; top: 0; width: 60px; height: 50px; text-indent: -9999px; border: none;}
.edit-prv__close:before,
.edit-prv__close:after {content: ''; display: block; width: 20px; height: 2px; background: #333; position: absolute; left: 50%; top: 50%; margin-left: -10px; margin-top: -1px;}
.edit-prv__close:before {transform: rotate(45deg); -webkit-transform: rotate(45deg);}
.edit-prv__close:after {transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.edit-prv__inner {}
.edit-prv__iframe {display: block; width: 100%; height: 500px;}
.edit-prv__load {padding: 30px;}





/* 230116 강사 커리큘럼 테이블 */
.curri-top {margin-bottom: 10px; position: relative;}
.curri-top:after {content: ''; display: table; clear: both;}
.curri-top p {position: absolute; right: 0; bottom: 5px;}
.curri-top p b {font-weight: 700;}
.curri-tb {overflow: hidden; border: solid 1px #0082ff; -webkit-border-radius: 20px; border-radius: 10px;}
.curri-tb > div {margin: -1px;}
.curri-tb table {border-collapse: collapse; width: 100%; table-layout: fixed;}
.curri-tb th,
.curri-tb td {border: solid 1px #0082ff; padding: 10px; font-size: 14px;}
.curri-tb th {background: #e9f4ff; font-weight: 700; color: #004485;}
.curri-tb td {line-height: 1.8;}
.curri-tb td a {text-decoration: underline; font-weight: 700;}
.curri-tb ul {list-style: none; margin: 0; padding: 0;}
.curri-tb li {position: relative; padding-left: 8px;}
.curri-tb li:before {content: ''; display: block; width: 3px; height: 3px; background: #333; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; left: 0; top: 10px;}

@media all and (max-width: 1200px){
	.curri-top p {display: none;}
}

@media all and (max-width: 992px){
	.curri-tb th,
	.curri-tb td {font-size: 13px; padding: 8px;}
}

@media all and (max-width: 768px){
	.curri-tb thead,
	.curri-tb colgroup {display: none;}
	.curri-tb table,
	.curri-tb tbody,
	.curri-tb tr,
	.curri-tb th,
	.curri-tb td {display: block; width: 100%;}
	.curri-tb {margin-top: 20px; -webkit-border-radius: 10px; border-radius: 10px;}
	.curri-tb > div {margin: 0; padding: 15px;}
	.curri-tb th,
	.curri-tb td {border: none; padding: 0;}
	.curri-tb th {background: none; text-align: left; font-size: 18px; margin-top: 20px; padding-top: 20px; border-top: solid 1px #ddd; margin-bottom: 10px; color: #000;}
	.curri-tb th br {display: none;}
	.curri-tb tr:first-child > th:not(.sub) {margin-top: 0; padding-top: 0; border-top: none;}
	.curri-tb th.sub {font-size: 14px; margin-top: 20px; font-weight: 500; padding-bottom: 5px; margin-bottom: 5px; margin-left: -5px; border-bottom: none; display: inline-block; color: #0082ff; border: solid 1px #0082ff; width: auto; padding: 2px 10px; -webkit-border-radius: 20px; border-radius: 20px;}
	.curri-tb th ~ th.sub {margin-top: 0;}	
	.curri-tb td:before {content: attr(data-th); font-weight: 500;}
}




/* 230216 리스트 토글 */
.grp-wrap {}
.grp-wrap .msa-btn {margin-left: 2px; vertical-align: bottom;}
.grp-toggle {display: inline-block; vertical-align: bottom; position: relative; width: 300px; height: 32px;}
.grp-toggle ul {height: 32px; border: solid 1px #ddd; padding-right: 32px; position: absolute; left: 0; top: 0; width: 100%; overflow: hidden; background: #fff;}
.grp-toggle ul li {height: 30px; line-height: 30px; padding: 0 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.grp-toggle.on ul {height: auto;}
.grp-toggle button {position: absolute; left: 0; top: 0; width: 100%; height: 32px; text-indent: -9999px; border: none;}
.grp-toggle button:after {content: ''; display: block; width: 4px; height: 4px; border-right: solid 1px #333; border-bottom: solid 1px #333; position: absolute; right: 14px; top: 50%; margin-top: -3px; transform: rotate(45deg); -webkit-transform: rotate(45deg);}
.grp-toggle button.on:after {transform: rotate(-135deg); -webkit-transform: rotate(-135deg); margin-top: -2px;}




/* 230410 배송현황 */
.deli-wrap {position: relative; padding-top: 50px; height: 100%;}
.deli-wrap .msa-pop__top {position: absolute; left: 0; right: 0; top: 0;}
.deli-inner {display: flex; width: 100%; height: 100%; flex-flow: column;}
.deli-info {}
.deli-info table {width: 100%; border-collapse: collapse; text-align: left;}
.deli-info th,
.deli-info td {border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; padding: 8px; font-size: 12px;}
.deli-info th {background: #f5f5f5; width: 100px; font-weight: 500; text-align: center;}
.deli-info td {}
.deli-list {}
.deli-list {position: relative; border-top: solid 1px #ddd; border-bottom: solid 1px #ddd; padding: 30px; overflow-y: auto; margin-top: 20px;}
.deli-list li {padding-bottom: 30px; position: relative;}
.deli-list li:last-child {padding-bottom: 0;}
.deli-list li:before {content: ''; display: block; border-left: dashed 1px #bbb; position: absolute; left: 24px; top: 0; bottom: 0;}
.deli-list li:last-child:before {display: none;}
.deli-list__cont {position: relative; padding-left: 80px;}
.deli-list__cont:before {content: ''; display: block; width: 46px; height: 26px; position: absolute; left: 0; top: 0; background: url('https://img.megastudyth.com/mypage/order_truck.png')no-repeat center center / cover;}
.deli-list__cont span {display: inline-block; font-size: 11px; background: #03a9f3; color: #fff !important; padding: 2px 4px; font-family: 'dotum', sans-serif; -webkit-border-radius: 3px; border-radius: 3px;}
.deli-list__cont span.red {background: #dd4b39;}
.deli-list__cont span.ylw {background: #fec107; color: #000 !important;}
.deli-list__cont span.grn {background: #00c292;}
.deli-list__cont span.blu {}
.deli-list__cont h5 {font-size: 14px; margin-top: 5px;}
.deli-list__cont p {font-size: 13px; font-weight: 300; margin-top: 5px;}

@media(max-width:768px){
	.deli-list {padding: 20px 10px;}
	.deli-list li:before {left: 20px;}
	.deli-list__cont {padding-left: 60px;}
	.deli-list__cont:before {width: 40px; height: 23px;}
}





/* 관리자관리 */
.adm-grp__wrap {display: flex; margin-top: 10px;}
.adm-grp__list {flex-shrink: 0; flex-grow: 0; width: 300px; border: solid 1px #ddd; margin-right: 10px; min-height: 400px;}
.adm-grp__list dl {display: flex; align-items: center; background: #f5f5f5; border-bottom: solid 1px #ddd; text-align: center; font-size: 11px; padding: 3px 0;}
.adm-grp__list dl dt {flex-grow: 1;}
.adm-grp__list dl dd {flex-shrink: 0; flex-grow: 0; width: 60px;}
.adm-grp__list ul {padding: 10px 0;}
.adm-grp__list ul li {display: flex; align-items: center;}
.adm-grp__list ul li p {flex-grow: 1; padding: 5px 10px;}
.adm-grp__list ul li p a.active {text-decoration: underline; font-weight: 700;}
.adm-grp__list ul li span {flex-shrink: 0; flex-grow: 0; width: 60px; text-align: center;}
.adm-grp__cont {display: flex; flex-grow: 1; border: solid 1px #ddd; padding: 10px; flex-direction: column; padding: 10px;}
.adm-grp__cont .cont_area {padding-top: 10px;}
.adm-grp__none {flex-grow: 1; display: flex; justify-content: center; align-items: center; width: 100%; color: #666;}

.adm-grp__top {display: flex; justify-content: space-between; align-items: center; border-bottom: solid 1px #ddd;}
.adm-grp__top ul {display: flex; margin-bottom: -1px;}
.adm-grp__top ul li {margin-right: -1px;}
.adm-grp__top ul li a {display: flex; width: 100px; height: 34px; border: solid 1px #ddd; background: #f5f5f5; color: #888; justify-content: center; align-items: center;}
.adm-grp__top ul li.on a {border-bottom-color: #fff; position: relative; background: #fff; color: #000;}
.adm-grp__top p span {font-weight: 700;}

.adm-grp__tree {}
.adm-grp__tree li {margin-bottom: 5px; cursor: pointer;}
.adm-grp__tree li:last-child {margin-bottom: 0;}
.adm-grp__tree li span {margin-right: 5px;}



/* 강사료정산 */
.ico-info {display: flex; align-items: center;}
.ico-info:before {content: '?'; display: flex; align-items: center; justify-content: center; width: 14px; height: 14px; background: #666; color: #fff; font-family: 'dotum', sans-serif; margin-right: 5px; -webkit-border-radius: 50%; border-radius: 50%;}
.pl5 {padding-left: 5px !important;}
.pr5 {padding-right: 5px !important;}

.tp-info__title {display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;}
.tp-info__title dt {flex-grow: 1; display: flex; align-items: center;}
.tp-info__title dd {flex-shrink: 0;}
.tp-info__title h5 {font-size: 20px;}
.tp-info__title span {margin-left: 10px; font-size: 16px;}
.tp-info__title span.sm {font-size: 12px; color: #f00;}
.tp-info__title a {}
.tp-info__cost {display: flex; justify-content: space-between; align-items: center;}
.tp-info__cost.inline {display: inline-flex;}
.tp-info__cost dt {font-size: 14px; font-weight: 500;}
.tp-info__cost dd span {margin-right: 10px;}
.tp-actual__add {display: flex; align-items: center; margin-bottom: 10px;}
.tp-actual__add li {padding-right: 5px; flex-grow: 1;}
.tp-actual__add li:last-child {flex-shrink: 0; flex-grow: 0; width: 50px; padding-right: 0;}
.tp-actual__add li input[type="text"] {width: 100%; display: block; height: 28px;}
.tp-actual__add li a {padding: 0; height: 28px; line-height: 28px; display: block; width: 100%; text-align: center;}
.tp-actual__add li select {height: 28px; width: 100%;}

.tp-pop {display: none; justify-content: center; align-items: center; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 10;}
.tp-pop__box {background: #fff; width: 100%; margin: 0 auto; padding: 0 0 20px; -webkit-border-radius: 3px; border-radius: 3px;}
.tp-pop__box.w400 {max-width: 400px;}
.tp-pop__box.w800 {max-width: 800px;}
.tp-pop__box.w1000 {max-width: 1000px;}
.tp-pop__title {display: flex; justify-content: space-between; align-items: center; padding: 15px 20px;}
.tp-pop__title h3 {font-size: 15px;}
.tp-pop__close {width: 30px; height: 30px; text-indent: -9999px; position: relative; background: none; border: none; cursor: pointer;}
.tp-pop__close:before,
.tp-pop__close:after {content: ''; display: block; width: 20px; height: 2px; background: #333; position: absolute; left: 50%; top: 50%; margin-left: -10px; margin-top: -1px;}
.tp-pop__close:before {transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg);}
.tp-pop__close:after {transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg);}
.tp-pop__cont {padding: 0 20px;}
.tp-pop__btn {display: flex; align-items: center; justify-content: center; margin-top: 20px;}
.tp-pop__btn li {}




.tp-tooltip {position: relative; display: inline-flex; margin-left: 5px; align-items: center; justify-content: center; width: 14px; height: 14px; background: #666; color: #fff; font-family: 'dotum', sans-serif; -webkit-border-radius: 50%; border-radius: 50%;}
.tp-tooltip:before,
.tp-tooltip:after {visibility: hidden;}
.tp-tooltip:before {
	position: absolute; bottom: 100%; left: 50%; margin-bottom: 5px; transform: translate(-50%, 0); padding: 4px 10px;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; letter-spacing: 0em;
	background-color: #0082FF; color: #fff; font-family: 'dotum', sans-serif; font-size: 11px;
	content: attr(data-tooltip); text-align: center; line-height: 1.2; width: 240px;
}
.tp-tooltip:after {position: absolute; bottom: 100%; left: 50%; margin-left: -5px; width: 0; border-top: 5px solid #0082FF; border-right: 5px solid transparent; border-left: 5px solid transparent; content: " "; font-size: 0; line-height: 0;}
.tp-tooltip:hover:before,
.tp-tooltip:hover:after {visibility: visible; opacity: 1;}



#qns_img_pop_info {align-items: center; justify-content: center; position: fixed; z-index: 1000; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,0.7);}
.qns_img_pop_inner {width: 100%; max-width: 50%; position: relative;}
.qns_img_pop_inner img {display: block; width: 100%;}
.qns_img_pop_inner button {display: block; width: 40px; height: 40px; background: none; position: absolute; right: 0; bottom: 100%; border: none; text-indent: -9999px;}
.qns_img_pop_inner button:before,
.qns_img_pop_inner button:after {content: ''; display: block; width: 40px; height: 2px; background: #fff; position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -1px;}
.qns_img_pop_inner button:before {transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.qns_img_pop_inner button:after {transform: rotate(45deg); -webkit-transform: rotate(45deg);}




/* 일일매출 240830 */
.sales-exh {float: right; display: flex; align-items: flex-end;}
.sales-exh p {margin-right: 10px;}
.sales-title {font-size: 22px; letter-spacing: -0.025em; line-height: 1.2; font-weight: 700; display: flex; align-items: center;}
.sales-title.sm {font-size: 18px;}
.sales-title.sm:before {content: ''; display: block; width: 4px; height: 20px; background: #333; margin-right: 6px; margin-top: -3px;}
.sales-data ul {border-top: solid 1px #e5e5e5; margin-top: 10px;}
.sales-data ul li {padding: 10px 0; font-size: 11px; border-bottom: solid 1px #e5e5e5; display: flex; align-items: center;}
.sales-data ul li:before {flex-shrink: 0; font-size: 10px; display: block; width: 30px; text-align: center;}
.sales-data ul li.up:before {content: '▲'; color: #00b31e;}
.sales-data ul li.down:before {content: '▼'; color: #f00;}
.sales-data ul li.dash:before {content: ''; height: 1px; background: #333; width: 6px; margin: 0 12px; display: block;}
.sales-data ul li span {flex-shrink: 0; display: block; width: 100px;}
.sales-data ul li b {flex-grow: 1;}

.sales-chk {display: flex; align-items: flex-end;}
.sales-chk h5 {margin-bottom: 0; flex-grow: 1;}
.sales-chk ul {display: flex; align-items: center;}
.sales-chk ul li {margin-right: 4px; display: flex; align-items: center;}
.sales-chk ul li:last-child {margin-right: 0;}
.sales-chk ul li input[type="checkbox"] {display: none;}
.sales-chk ul li input[type="checkbox"] + label {padding: 0 10px; height: 30px; margin-left: 0; border: solid 1px #e5e5e5; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 4px; border-radius: 4px;}
.sales-chk ul li input[type="checkbox"]:checked + label {background: #0082FF; border-color: #0082FF; color: #fff;}
.sales-chk ul li input[type="checkbox"]#pass:checked + label {background: #7531f5; border-color: #7531f5;}
.sales-chk ul li input[type="checkbox"]#book:checked + label {background: #00c3ff; border-color: #00c3ff;}
.sales-chk ul li input[type="checkbox"]#buffet:checked + label {background: #102e70; border-color: #102e70;}
.sales-chk ul li input[type="checkbox"]#course:checked + label {background: #0069cf; border-color: #0069cf;}

.sales-chk p {margin-left: 10px;}

.sales-top {margin-bottom: 10px; display: flex; justify-content: space-between; align-items: flex-end;}
.sales-top p {}
.sales-sort {display: flex; align-items: center;}
.sales-sort dl {margin-left: 10px; flex-shrink: 0; display: flex; align-items: center;}
.sales-sort dl dt {margin-right: 5px; line-height: 1.0;}
.sales-sort dl dt:last-child {margin-left: 0;}
.sales-sort dl dd {border: solid 1px #333;}
.sales-sort dl dd:nth-child(2) {-webkit-border-radius: 2px 0 0 2px; border-radius: 2px 0 0 2px; border-right: none;}
.sales-sort dl dd:nth-child(3) {-webkit-border-radius: 0 2px 2px 0; border-radius: 0 2px 2px 0;}
.sales-sort dl dd a {width: 16px; height: 16px; font-size: 9px; line-height: 1.0; font-family: 'dotum'; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 2px; border-radius: 2px;}
.sales-sort p {margin-left: 10px;}
.sales-info {position: relative; bottom: -25px; z-index: 1;}
.sales-unit {text-align: right; margin-top: 30px; margin-bottom: 10px;}

.sales-half {display: flex; margin: 0 -20px;}
.sales-half > div {width: 50%; padding: 0 20px;}

.sales-thead {padding-right: 17px; margin-right: -17px;}
.sales-tbody {padding-right: 17px; margin-right: -17px; margin-top: -1px;}
.sales-tbody > div {margin-right: -17px; height: 240px; overflow-y: scroll;}

.sales-index {display: inline-flex; align-items: center;}
.sales-index:before {flex-shrink: 0; font-size: 10px; margin-right: 5px;}
.sales-index.up:before {content: '▲'; color: #00b31e;}
.sales-index.down:before {content: '▼'; color: #f00;}


.pyramid-chart {display: flex; margin: 0 -5px;}
.pyramid-title {text-align: right; font-size: 20px; margin-bottom: 10px;}
.pyramid-half {width: 50%; padding: 0 5px;}
.pyramid-list {}
.pyramid-list dl {margin-bottom: 20px;}
.pyramid-list dl:last-child {margin-bottom: 0;}
.pyramid-list dl dt {display: flex; align-items: center; justify-content: space-between;}
.pyramid-list dl dt h5 {font-size: 12px; font-weight: 600;}
.pyramid-list dl dt p {display: flex; align-items: center; color: #666; flex-shrink: 0;}
.pyramid-list dl dt p span {display: flex; align-items: center; font-size: 11px;}
.pyramid-list dl dt p span:after {content: '/'; margin: 0 5px;}
.pyramid-list dl dt p span:last-child:after {display: none;}
.pyramid-list dl dd {position: relative; background: #e5e5e5; height: 24px; margin-top: 2px; -webkit-border-radius: 4px; border-radius: 4px;}
.pyramid-list dl dd span {position: absolute; top: 0; z-index: 1; -webkit-border-radius: 4px; border-radius: 4px;}
.pyramid-list dl dd span {background: #f00; height: 24px; padding: 0 6px; overflow: hidden; color: #fff; font-weight: 600; font-size: 11px; right: 0; animation: progress 1s ease-out forwards; -webkit-border-radius: 4px; border-radius: 4px;}
.pyramid-list dl dd span.pass {background: #7531f5;}
.pyramid-list dl dd span.book {background: #00c3ff;}
.pyramid-list dl dd span.buffet {background: #102e70;}
.pyramid-list dl dd span.course {background: #0069cf;}
.pyramid-list dl dd em {font-style: normal; line-height: 24px; position: absolute; padding: 0 6px; right: 0; white-space: nowrap; color: #fff;}
.pyramid-list dl dd > em {z-index: 0; color: #000;}

.pyramid-half:nth-child(even) .pyramid-title {text-align: left;}
.pyramid-half:nth-child(even) dl dt h5 {order: 1;}
.pyramid-half:nth-child(even) dl dt p span:first-child {order: 1;}
.pyramid-half:nth-child(even) dl dt p span:first-child:after {display: none;}
.pyramid-half:nth-child(even) dl dt p span:last-child:after {display: block;}
.pyramid-half:nth-child(even) dl dd span {right: auto; left: 0; justify-content: flex-start;}
.pyramid-half:nth-child(even) dl dd em {right: auto; left: 0;}

@keyframes progress {100% {width: calc(var(--p)*1%);}}