@charset "utf-8";

@font-face {
    font-family: 'Nanum Gothic';
    src: url('../fonts/NanumGothic.eot');
}

@font-face {
    font-family: 'NotoSansCJKkr-Regular';
    src: url(../fonts/NotoSansCJKkr/NotoSansCJKkr-Regular.otf);
}
@font-face {
    font-family: 'NotoSansCJKkr-Black';
    src: url(../fonts/NotoSansCJKkr/NotoSansCJKkr-Black.otf);
}
@font-face {
    font-family: 'NotoSansCJKkr-Bold';
    src: url(../fonts/NotoSansCJKkr/NotoSansCJKkr-Bold.otf);
}
@font-face {
    font-family: 'NotoSansCJKkr-DemiLight';
    src: url(../fonts/NotoSansCJKkr/NotoSansCJKkr-DemiLight.otf);
}
@font-face {
    font-family: 'NotoSansCJKkr-Light';
    src: url(../fonts/NotoSansCJKkr/NotoSansCJKkr-Light.otf);
}
@font-face {
    font-family: 'NotoSansCJKkr-Medium';
    src: url(../fonts/NotoSansCJKkr/NotoSansCJKkr-Medium.otf);
}
@font-face {
    font-family: 'NotoSansCJKkr-Thin';
    src: url(../fonts/NotoSansCJKkr/NotoSansCJKkr-Thin.otf);
}

:root {
    --color--primary: #0b7b4b;
    --color--dark: #111111;
    --color--yellow: #ff9100;
    --color--yellow--origin: #ffe500;
    --color--steel: #505050;
    --color--steel--two: #767676;
    --color--steel--three: #aeaeae;
    --color--border: #dbdbdb;
    --color--seperate: #ededed;
    --color-light-gray: #fbfbfb;
    --color--placeholder: #767676;

    --header--height: 60px;
    --sidebar--width: 286px;
}

* {
    box-sizing: border-box;
}

i.icon {
    display: inline-block;
    vertical-align: middle;
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;
    font-style: normal;
    position: relative;
}

@media (min-width: 1200px) {
    .form-bordered .form-group select {
        float: left;
        width: 32%;
        margin-right: 1%;
    }

    .form-bordered .form-group input[type='text'] {
        float: left;
        width: 65%;
    }
}

html, body {
    /*min-width: 1800px !important;*/
    overflow: auto;
    font-family: 'NotoSansCJKkr-Regular' !important;
}

.no-padding {
    padding: 0 !important;
}

.padding-10 {
    padding: 10px;
}

.padding-12 {
    padding: 12px;
}

.padding-top-none {
    padding-top: 0;
}

.padding-vertical-none {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.margin-bottom-none {
    margin-bottom: 0 !important;
}

.margin-0-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

.margin-auto {
    margin: auto !important;
}

.margin-bottom-45 {
    margin-bottom: 45px !important;
}

.margin-top-none {
    margin-top: 0 !important;
}

.padding-20 {
    padding: 20px !important;
}

.padding-0-10 {
    padding: 0 10px !important;
}

.pl-20 {
    padding-left: 20px !important;
}

.pl-15 {
    padding-left: 15px !important;
}

.pt-60 {
    padding-top: 60px !important;
}

.pl-30 {
    padding-left: 30px !important;
}

.pl-40 {
    padding-left: 40px !important;
}

.pr-20 {
    padding-right: 20px !important;
}

.pr-40 {
    padding-right: 40px !important;
}

.pr-25 {
    padding-right: 25px !important;
}

.padding-0-20 {
    padding: 0 20px !important;
}

.padding-0-40 {
    padding: 0 40px !important;
}

.padding-bottom-40 {
    padding-bottom: 40px !important;
}

.margin-left-5 {
    margin-left: 5px !important;
}

.margin-left-10 {
    margin-left: 10px !important;
}

.margin-left-15 {
    margin-left: 15px !important;
}

.margin-left-20 {
    margin-left: 20px !important;
}

.margin-left-25 {
    margin-left: 25px !important;
}

.margin-left-30 {
    margin-left: 30px !important;
}

.margin-left-100 {
    margin-left: 100px !important;
}

.margin-right-15 {
    margin-right: 15px !important;
}

.margin-top-5 {
    margin-top: 5px !important;
}

.margin-top-25 {
    margin-top: 25px !important;
}

.margin-right-20 {
    margin-right: 20px !important;
}

.margin-right-25 {
    margin-right: 25px !important;
}

.margin-right-30 {
    margin-right: 30px !important;
}

.margin-right-35 {
    margin-right: 35px !important;
}

.margin-right-40 {
    margin-right: 40px !important;
}

.margin-right-45 {
    margin-right: 45px !important;
}

.margin-right-50 {
    margin-right: 50px !important;
}

.no-margin {
    margin: 0 !important;
}

.no-padding {
    padding: 0 !important;
}

.margin-right-55 {
    margin-right: 55px !important;
}

.margin-right-60 {
    margin-right: 60px !important;
}

.margin-right-65 {
    margin-right: 65px !important;
}

.margin-right-70 {
    margin-right: 70px !important;
}

.bg-white {
    background-color: white;
}

.color-dark {
    color: #111111 !important;
}

.color-yellow {
    color: #ff9100 !important;
}

.color-steel {
    color: #505050 !important;
}

.color-steel-two {
    color: #767676 !important;
}

.float-right {
    float: right !important;
}

.bg-primary {
    background-color: #0b7b4b !important;
}

.bg-dark {
    background-color: #111111 !important;
}

.bg-black {
    background-color: black !important;
}

.bg-yellow {
    background-color: #ff9100 !important;
}

.bg-red {
    background: #ff0000;
    color: white !important;
}

.btn.bg-dark, .btn.bg-yellow, .btn.bg-primary, .btn.bg-black {
    color: white;
}

.btn.bg-white {
    color: #111111;
}

.bg-white {
    background-color: white !important;
}

.border-primary {
    border: 1px solid #0b7b4b !important;
}

.color-white {
    color: white !important;
}

.color-steel-three {
    color: #aeaeae !important;
}

.color-primary {
    color: #0b7b4b !important;
}

.btn.no-fill {
    background-color: transparent;
}

.font-8 {
    font-size: 8px !important;
}

.font-10 {
    font-size: 10px !important;
}

.font-12 {
    font-size: 12px !important;
}

.font-13 {
    font-size: 13px !important;
}

.font-14 {
    font-size: 14px !important;
}

.font-16 {
    font-size: 16px !important;
}

.font-20 {
    font-size: 20px !important;
}

.font-22 {
    font-size: 22px !important;
}

.font-24 {
    font-size: 24px !important;
}

.font-26 {
    font-size: 26px !important;
}

.font-28 {
    font-size: 28px !important;
}

.font-30 {
    font-size: 30px !important;
}

.font-38 {
    font-size: 38px !important;
}

.font-40 {
    font-size: 40px !important;
}

.font-80 {
    font-size: 80px !important;
}

.font-bold {
    font-family: 'NotoSansCJKkr-Bold' !important;
    font-weight: bold !important;
}

.font-light {
    font-family: 'NotoSansCJKkr-Regular' !important;
    font-weight: inherit !important;
}

body {
    font-family: 'NotoSansCJKkr-Regular' !important;
}

a.no-decoration {
    text-decoration: none;
}

.text-center {
    text-align: center !important;
}

.flex {
    display: flex !important;
}

.inline-block {
    display: inline-block !important;
}

/*popup dialog css*/
.new-popup-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10001;
    background-color: rgba(0, 0, 0, 0.5);
}

.new-popup-bg > .popup {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    min-width: 313px;
    padding: 28px 28px 0 28px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: white;
    box-shadow: 2px 0 2px 2px rgba(0, 0, 0, 0.3);
    display: block;
    border-radius: 4px;
}

.new-popup-bg .popup-content {
    padding-top: 28px;
    padding-bottom: 28px;
}

.hidden {
    visibility: hidden;
}

.display-none {
    display: none !important;
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all) {
    font-weight: inherit;
}

.btn-group > .btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all), .btn.btn-link:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all):hover, .btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all) {
    box-shadow: none;
    border-radius: 10px;
    font-size: 16px;
}

.font-size-small {
    font-size: 12px;
}

.font-size-medium {
    font-size: 16px;
}

.font-size-large {
    font-size: 20px;
}

.bg-transparent {
    background: transparent;
}

.align-items-center {
    align-items: center;
}

.align-items-end {
    align-items: flex-end !important;
}

.shadow {
    box-shadow: 0 10px 15px rgba(0, 0, 0, .1), 0 0px 0px rgba(0, 0, 0, .18) !important;
}

.border {
    border: 1px solid #dbdbdb;
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-small {
    font-size: 12px;
    height: 36px;
    border-radius: 18px !important;
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-medium {
    font-size: 16px;
    height: 50px;
    border-radius: 25px !important;
}

.input-control {
    height: 36px;
    border-radius: 18px;
    border: 1px solid #dbdbdb;
    display: flex;
}

.input-control input {
    width: 100%;
    height: 100%;
    background: transparent;
    border: none;
}

input, input:focus, input:active {
    border: none;
    outline: 0;
}

input.form-control:focus {
    border: 1px solid #c2cad8;
}

.no-border {
    border: none !important;
    border-radius: 0 !important;
}

button:hover {
    box-shadow: none !important;
}

.page-header-fixed .page-container {
    margin-top: 0 !important;
}

.page-sidebar-fixed .page-sidebar {
    /*top: 60px;*/
}

.bg-light-gray {
    background: #fbfbfb !important;
}

.mt-10 {
    margin-top: 10px !important;
}

.pb-20 {
    padding-bottom: 20px !important;
}

.mb-10 {
    margin-bottom: 10px !important;
}

.mt-15 {
    margin-top: 15px !important;
}

.mt-25 {
    margin-top: 25px !important;
}

.mb-30 {
    margin-bottom: 30px !important;
}

.mt-27 {
    margin-top: 27px !important;
}

.mt-35 {
    margin-top: 35px !important;
}

.mt-100 {
    margin-top: 100px !important;
}

.mt-110 {
    margin-top: 110px !important;
}

.page-sidebar .page-sidebar-menu > li, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li {
    margin-top: 25px;
}

.page-sidebar .page-sidebar-menu > li.active > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a {
    color: white;
    font-family: 'NotoSansCJKkr-Medium';
    font-size: 16px;
    background: #0b7b4b;
}

.page-sidebar .page-sidebar-menu > li > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a {
    padding: 14px 50px;
}

.page-sidebar {
    width: 286px;
}

.page-content-wrapper .page-content {
    margin-left: 165px;
}

.page-sidebar .page-sidebar-menu > li > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a {
    font-size: 16px;
    color: #111111;
}

.page-sidebar .page-sidebar-menu > li.active > a > .selected, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a > .selected {
    display: block;
    position: inherit;
    width: 18px;
    height: 3px;
    margin-left: -30px;
    background-color: #024625;
    border: none;
    float: left;
}

.ml-5 {
    margin-left: 5px;
}

.ml-10 {
    margin-left: 10px;
}

.mr-10 {
    margin-right: 10px !important;
}

.ml-40 {
    margin-left: 40px;
}

.ml-20 {
    margin-left: 20px;
}

.ml-15 {
    margin-left: 15px;
}

.ml-25 {
    margin-left: 25px;
}

.ml-30 {
    margin-left: 30px;
}

.ml-auto {
    margin-left: auto;
}

.mt-5 {
    margin-top: 5px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-60 {
    margin-top: 60px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}

.display-block {
    display: block !important;
}

.display-grid {
    display: grid !important;
}

.display-flex {
    display: flex;
}

.display-inline {
    display: inline;
}

.display-inline-table {
    display: inline-table;
}

.display-inline-block {
    display: inline-block !important;
}

.text-align-left {
    text-align: left !important;
}

.text-align-center {
    text-align: center;
}

.text-align-center.space {
    width: 9% !important;
}

.table>thead>tr>th {
    color: black !important;
    font-family: NotoSansCJKkr-Bold !important;
    font-size: 12px !important;
}

.table>tbody>tr>td {
    color: dimgray !important;
    font-family: NotoSansCJKkr-Medium !important;
    font-size: 12px !important;
}

.text-align-right {
    text-align: right;
}

.kh-btn-delete {
    width: 80px !important;
    position: absolute;
    margin-top: -25px;
    margin-left: -201px !important;
    background: white !important;
    color: red !important;
    border-color: #adadad;
}

.row {
    margin-left: 0;
    margin-right: 0;
}

.page-body .body-title {
    font-size: 24px;
    color: #024625;
    font-family: 'NotoSansCJKkr-Medium';
}

.page-header.navbar {
    height: 60px;
    line-height: 60px;
}

.page-header.navbar .page-logo {
    height: 60px;
}

.page-content[data-name="home"] {
    /*background-image: url("../img/image_02.jpg") !important;*/
    /*background-position-y: -60px;*/
    /*background-repeat: no-repeat;*/
    /*background-size: 100% 100%;*/
    /*background-position: center;*/
}

.container-fluid:after, .container-fluid:before, .container:after, .container:before, .row:after, .row:before {
    display: none;
}

.pt-100 {
    padding-top: 100px;
}

.pt-50 {
    padding-top: 50px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pr-50 {
    padding-right: 50px;
}

.center-crop {
    object-fit: cover;
}

.center-inside {
    object-fit: contain;
}

.round-circle {
    border-radius: 50% !important;
}

body ul {
    padding-left: 0;
}

body ul li {
    display: inherit;
}

.justify-content-space-between {
    justify-content: space-between;
}

.justify-content-right {
    justify-content: flex-end;
}

.justify-content-center {
    justify-content: center;
}

.list .item-content {
    display: inline-flex;
    justify-content: space-between;
    box-sizing: border-box;
    align-items: center;
}

.list .item-inner {
    position: relative;
    width: 100%;
    min-width: 0;
    justify-content: space-between;
    box-sizing: border-box;
    align-items: center;
    align-self: stretch;
}

.break-word {
    word-break: break-word;
}

.no-outline {
    outline: 0;
}

textarea::placeholder {
    color: #767676;
}

.page-content-wrapper .page-content {
    position: relative;
}

.page-content-wrapper .page-content .page-body {
    height: 100%;
    position: absolute;
    left: 50px;
    right: 50px;
}

input::placeholder {
    color: #767676;
}

textarea {
    outline: 0;
}

.accordion .panel .panel-title .accordion-toggle.accordion-toggle-styled {
    background: url(../img/arrow_up.png);
    background-repeat: no-repeat;
    background-position: right;
    margin-right: 30px;
}

.accordion .panel .panel-title .accordion-toggle.accordion-toggle-styled.collapsed {
    background: url(../img/arrow_down.png);
    background-repeat: no-repeat;
    background-position: right;
    margin-right: 30px;
}

.panel-default > .panel-heading {
    color: #111111;
    background-color: transparent;
    border-color: transparent;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    padding-top: 0;
    padding-left: 30px;
    padding-right: 30px;
    border-top: none;
}

.panel-group .panel {
    border-radius: 0;
    border-width: 2px;
    border-color: #ededed;
    box-shadow: 0 1px 1px #ededed, 0 1px 1px #ededed;
}

.accordion .panel .panel-title .accordion-toggle {
    padding-left: 30px;
    padding-right: 30px;
}

.btn.left-point:before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #505050;
    position: absolute;
    left: 0;
    top: 12px;
}

.popup-content .message {
    font-size: 16px;
    font-family: 'NotoSansCJKkr-Medium';
    color: #111111;
    text-align: center;
}

.popup-footer {
    text-align: right;
    margin-top: 10px;
    margin-bottom: 10px;
}

.popup-footer .btn {
    font-family: 'NotoSansCJKkr-Medium' !important;
}

.block-spinner-bar div {
    background: #0b7b4b;
}

.dialog-header {
    text-align: center;
    margin-bottom: 10px;
}

.dialog-header .dialog-title {
    font-size: 20px;
    font-family: 'NotoSansCJKkr-Medium';
    color: #111111;
}

.dialog-content .item-title {
    color: #111111;
    font-size: 16px;
    width: 115px;
    text-align: left;
}

.dialog-content .row {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.dialog-content .row .input-control {
    width: 70%;
    padding: 0 20px;
    font-size: 16px;
    border: 1px solid #dbdbdb;
    border-radius: 25px;
}

.common-border {
    border: 1px solid #dbdbdb;
    border-radius: 10px;
}

.list ul {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

.margin-0-40 {
    margin: 0 40px !important;
}

.margin-10-0 {
    margin: 10px 0 !important;
}

.margin-0-10 {
    margin: 0 10px !important;
}

.message-text {
    font-size: 12px;
    color: #111111;
    font-family: 'NotoSansCJKkr-Medium';
    line-height: 20px;
    word-break: break-word;
}

.message.message-sent .message-text {
    text-align: right;
}

.message-time {
    font-size: 12px;
    color: #767676;
    margin: 0 5px;
    /*display: table;*/
}

.message-avatar {
    width: 20px;
    height: 20px;
    margin-left: 20px;
    margin-right: 25px;
}

.message {
    width: 100%;
    display: flex;
    margin-bottom: 20px;
}

.message-received {
    justify-content: flex-start;
}

.message-sent {
    justify-content: flex-end;
}

.message-bubble {
    padding: 20px;
    border-radius: 10px;
    position: relative;
}

.message-received .message-bubble {
    background: #f0ffee;
    border-top-left-radius: 0;
}

.message-sent .message-bubble {
    background: white;
    border-top-right-radius: 0;
}

.message-received .message-content {
    max-width: 75%;
}

.message-sent .message-content {
    max-width: 40%;
}

.message-content {
    display: block;
    align-items: flex-end;
    position: relative;
}

.message-received .message-bubble:before {
    top: 0;
    position: absolute;
    content: '';
    border-top: 16px solid #f0ffee;
    border-right: 0 solid transparent;
    border-left: 16px solid transparent;
    border-bottom: 0 solid transparent;
    left: -16px;
    width: 0;
    height: 0;
}

.message-sent .message-bubble:after {
    top: 0;
    position: absolute;
    content: '';
    border-top: 16px solid white;
    border-right: 16px solid transparent;
    border-left: 0 solid transparent;
    border-bottom: 0 solid transparent;
    right: -16px;
    width: 0;
    height: 0;
}

.message-sent .message-content {
    margin-right: 80px;
}

.messages-title {
    text-align: center;
    font-family: 'NotoSansCJKkr-Medium';
    height: 50px;
    line-height: 50px;
}

.btn.btn-charge {
    background: transparent;
    font-size: 12px !important;
    font-family: 'NotoSansCJKkr-Medium';
    color: #767676;
}

.btn.btn-charge.active {
    color: #ff9100;
}

.form-group {
    margin-bottom: 0;
}

select:focus {
    outline: 0;
}

.datepicker table tr td.new, .datepicker table tr td.old {
    color: #767676;
    font-size: 14px;
}

.datepicker .datepicker-switch {
    font-size: 18px;
    font-family: 'NotoSansCJKkr-Medium';
!important;
}

.datepicker-inline {
    width: 380px;
}

.datepicker .datepicker-switch {
    width: 380px;
}

.datepicker table tr td, .datepicker table tr th {
    line-height: 25px;
}

.datepicker table th.dow {
    font-family: 'NotoSansCJKkr-Medium' !important;
}

.page-sidebar-fixed .page-sidebar .page-sidebar-menu > li > a, .page-sidebar-fixed .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a {
    font-family: 'NotoSansCJKkr-Medium' !important;
}

.selep-header {
    background-image: url("../img/image_03.jpg") !important;
    background-position-y: -60px;
    background-repeat: no-repeat;
    height: 190px;
    background-size: 100%;
}

.faq-header {
    background-image: url("../img/image_01.jpg") !important;
    background-position-y: -60px;
    background-repeat: no-repeat;
    height: 190px;
    background-size: 100%;
}

.info-header {
    background-image: url("../img/image_09.jpg") !important;
    background-position-y: -60px;
    background-repeat: no-repeat;
    height: 190px;
    background-size: 100%;
}

.selep-detail-header {
    background-image: url("../img/image_04.jpg") !important;
    background-position-y: -60px;
    background-repeat: no-repeat;
    height: 220px;
    background-size: 100%;
}

.chatting-header {
    background-image: url("../img/image_05.jpg") !important;
    background-position-y: -60px;
    background-repeat: no-repeat;
    height: 190px;
    background-size: 100%;
}

.home-title {
    background-image: url("../img/image_02.jpg") !important;
    background-position-y: -60px;
    background-repeat: no-repeat;
    background-size: 100%;
}

.home-content {
    background-image: url("../img/image_02.jpg") !important;
    background-position-y: -60px;
    background-repeat: no-repeat;
    background-size: 100%;
}

.position-inherit {
    position: inherit !important;
}

.chat-badge {
    position: absolute;
    right: 0;
    color: white;
    background: #ff9100;
    width: 20px;
    height: 20px;
    text-align: center;
    font-size: 12px;
    border-radius: 50%;
}

.page-sidebar-fixed .page-sidebar {
    top: 0 !important;
    bottom: 0;
    width: 165px !important;
    background: white !important;
}

.page-sidebar .page-sidebar-menu > li > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a {
    font-size: 15px !important;
    color: #222222 !important;
    padding: 20px 0 20px 30px !important;
}

.page-sidebar .page-sidebar-menu > li, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li {
    margin-top: 0 !important;
}

.page-sidebar .page-sidebar-menu > li.active > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a {
    background: white !important;
    color: #024625 !important;
}

.footer-bg {
    height: 100px;
    border-top: solid 1px #e1e1e1;
    display: flex;
}

.footer-title {
    margin: auto;
    color: #a1a1a1;
    font-size: 13px;
}

.page-sidebar-fixed .page-footer {
    margin-left: 0 !important;
    position: relative;
    z-index: 100;
}

.home-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.bold {
    font-weight: bold;
}

.app-download-title {
    font-size: 48px;
    line-height: 62px;
    color: #222222;
    font-family: 'NotoSansCJKkr-Light';
}

.app-download-title > span { font-family: 'NotoSansCJKkr-Medium'}
.app-download-bottom {
    font-size: 20px;
    color: #5a5a5a;
    line-height: 32px;
    font-family: 'NotoSansCJKkr-Regular';
}

.app-download-btn-google {
    width: 220px !important;
    height: 65px !important;
    font-size: 20px !important;
    color: #024625 !important;
    border-radius: 3px;
    border: 1px solid #024625;
    line-height: 65px;
    text-align: center;
    cursor: pointer;
    background: url(../img/ic_google.png) 35px no-repeat;
    padding-left: 40px;
}

.app-download-btn-google:focus, .app-download-btn-google:hover {
    text-decoration: none !important;
}

.app-download-btn-app {
    width: 220px !important;
    height: 65px !important;
    font-size: 20px !important;
    color: #024625 !important;
    border-radius: 3px;
    border: 1px solid #024625;
    line-height: 65px;
    text-align: center;
    cursor: pointer;
    background: url(../img/ic_app_store.png) 45px no-repeat;
    padding-left: 35px;
}

.app-download-btn-app:focus, .app-download-btn-app:hover {
    text-decoration: none !important;
}

.img-service {
    position: absolute;
    object-fit: cover;
    width: 1100px;
    top: -155px;
    right: 0;
}

.img-green {
    position: absolute;
    object-fit: contain;
    height: calc(100% - 300px);
    bottom: 0;
    right: 0;
}

.img-item-service {
    position: absolute;
    object-fit: cover;
    height: 182px;
    width: 270px;
}

.padding-0 {
    padding: 0 !important;
}

.w-40 {
    width: 40%;
}

.w-60 {
    width: 60%;
}

.h-100 {
    height: 100%;
}

.w-100 {
    width: 100% !important;
}

.m-auto {
    margin: auto;
}

.m-r-auto {
    margin-left: auto;
}

.m-b-auto {
    margin-bottom: auto;
}

.img-green-item-gray {
    font-size: 12px;
    color: #a1a1a1;
    font-family: 'NotoSansCJKkr-Medium';
}

.img-green-item-gray-content {
    font-size: 14px;
    color: #a1a1a1;
    font-family: 'NotoSansCJKkr-Regular';
    line-height: 22px;
}

.img-green-item-title {
    font-size: 16px;
    color: #222222;
    font-family: 'NotoSansCJKkr-Medium';
}

.text-oneline {
    text-align: left !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block;
}

.lb-green {
    border: 1px solid #5b8e75;
    height: 20px;
    font-size: 12px;
    color: #5b8e75;
    line-height: 20px;
    font-family: 'NotoSansCJKkr-Regular';
    display: block;
    padding: 0 8px;
}

.lb-green-right {
    background: url(../img/ico_golf_like.png) left no-repeat;
    height: 20px;
    font-size: 12px;
    color: #222222;
    line-height: 20px;
    width: 50px;
    padding-left: 28px;
    font-family: 'NotoSansCJKkr-Regular';
}

.golf-map-pin {
    background: url(../img/ico_golf_map_pin.png) left no-repeat;
    height: 60px;
    font-size: 14px;
    color: #024625;
    line-height: 20px;
    width: 40px;
    text-align: center;
    padding-top: 13px;
    font-family: 'NotoSansCJKkr-Medium';
}

.top-index {
    height: 90px;
    width: 100%;
    display: flex;
}

.select-input {
    width: 50%;
    margin-top: auto;
    margin-bottom: auto;
    border: 1px solid #eeeeee;
    height: 50px;
}

.border-none {
    border: 0 solid;
}

.top-input-title {
    font-size: 14px;
    color: #222222;
}

.top-search {
    background: url(../img/ico_golf_search.png) center no-repeat;
    height: 50px;
    width: 50px;
    border: none;
    display: inline-block;
    float: right;
    margin-left: auto;
}

.top-gps {
    display: inline-block;
    float: left;
    background: url(../img/ico_golf_position.png) center no-repeat;
    height: 50px;
    width: 50px;
    border: none;
}

.top-input {
    margin-left: 10px;
}

.w-20 {
    width: 20%;
}

.pro-item {
    /*width: 390px;*/
    /*height: 490px;*/
}

.pro-item-img {
    height: 390px;
    width: 100%;
    object-fit: cover;
}

.pro-item-title {
    height: 35px;
    width: 85px;
    background: #024625;
    font-size: 14px;
    color: white;
    line-height: 35px;
    text-align: center;
    position: absolute;
    margin: 0;
    left: 0;
    top: 374px;
}

.page-body .body-title-detail {
    font-size: 22px;
    color: #024625;
    background: url(../img/ico_back.png) left no-repeat;
    background-size: 37px;
    width: 250px;
    padding-left: 60px;
    font-family: 'NotoSansCJKkr-Medium';
}

.page-body .body-title-detail-right {
    font-size: 14px;
    color: #222222;
    font-family: 'NotoSansCJKkr-Regular';
    text-align: center;
    line-height: 22px;
    background: url(../img/ico_info.png) left no-repeat;
    background-size: 22px;
    padding-left: 34px;
    padding-right: 50px;
    margin-top: auto;
    margin-bottom: auto;
}

.color-222222 {
    color: #222222;
}

.size-30 {
    font-size: 30px;
}

.size-16 {
    font-size: 16px;
}

.size-22 {
    font-size: 22px;
}

.color-a1a1a1 {
    color: #a1a1a1;
}

.view-go {
    width: 160px;
    height: 36px;
    border: 1px solid #044728;
    font-size: 14px;
    color: #044728;
    line-height: 35px;
    text-align: center;
    border-radius: 2px;
    cursor: pointer;
    font-family: 'NotoSansCJKkr-Regular';
}

.w-78 {
    width: 78px;
}

.w-128 {
    width: 128px;
}

.detail-item-img {
    width: 236px !important;
    height: 236px !important;
    object-fit: cover;
}

.golf-dialog {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: none;
}

.golf-dialog > .dialog-bg {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
}

.golf-dialog > .dialog-container {
    width: 1080px;
    margin: auto;
    margin-top: 50vh;
    transform: translateY(-50%);
    display: flex;
}

.golf-dialog > .dialog-container > .dialog-body {
    background: #ffffff;
    margin: auto;
}

.golf-dialog > .dialog-container > .save-alert > P:first-child {
    text-align: center;
    padding: 55px 87px 0;
    font-size: 18px;
    color: #222222;
    font-family: NotoSansCJKkr-Regular;
}

.golf-dialog > .dialog-container > .save-alert > p + p {
    text-align: center;
    font-size: 15px;
    color: #656565;
    padding-bottom: 30px;
    font-family: NotoSansCJKkr-Demilight;
}

.golf-dialog .dialog-buttons {
    text-align: center;
    padding-bottom: 20px;
}

.golf-dialog .dialog-buttons > a {
    width: 90px;
    height: 40px;
    line-height: 40px;
    font-size: 15px;
    padding: 0;
}

.golf-dialog .dialog-buttons > a:last-child {
    margin-left: 10px;
}

.lesson-review-bg {
    width: 600px;
    height: 820px;
    background: white;
}

.popup-header-title {
    height: 112px;
    margin-left: 50px;
    border-bottom: 2px solid #024625;
    display: flex;
}

.popup-header-label {
    line-height: 112px;
    font-size: 24px;
    font-family: 'NotoSansCJKkr-Medium';
    color: #024625;
}

.popup-header-close {
    height: 112px;
    width: 112px;
    margin: 0;
    font-size: 24px;
    line-height: 112px;
    text-align: center;
    display: block;
    color: #a5a5a5;
    margin-left: auto;
    cursor: pointer;
    /*background: url(../img/ico_golf_position.png) center no-repeat;*/
}

.popup-top-title {
    height: 75px;
    line-height: 75px;
    font-size: 14px;
    color: #222222;
}

.color-024625 {
    color: #024625;
}

.home-container {width: 100%;height: auto;display: block}
.home-log-container {width: 100%;height:100vmin;position: relative;display: block}
.home-log-container > img.bg-home {position: absolute;right: 0;bottom: 0;min-width: 100%;min-height: 100%;width: auto;height: auto;z-index: -100;background-size: cover;overflow: hidden;object-fit: cover;opacity: 0;transition:all 0.7s ease;}
.home-log-container > img.bg-home.active {opacity: 1}
.home-container img.service-logo {position: absolute;top: 43px;left: 45px;z-index: 100000}
.home-menu-container {width: 100%;height: 100%;display: flex;position: absolute;top: 0;left: 0;}
.home-menu-item {width: 25%;height: auto;display: block;position: relative;background: rgba(0,0,0,0.4);cursor: pointer}
.home-menu-item:hover {width: 25%;height: auto;display: block;position: relative;background: rgba(0,0,0,0)}

.main-bg-banner {opacity: 0;transition:all 0.7s ease;}
.main-bg-banner.active {opacity: 1;}

.home-menu-content {width: 90%;height: 50%;display: block;position: absolute;top: 50%;left: 0;transform: translateY(-50%) !important;padding: 40px 24px}

.home-menu-item.service .home-menu-content:hover {background: rgba(2,70,37,0.8)}
.home-menu-item.download .home-menu-content:hover {background: rgba(95,142,108,0.8)}
.home-menu-item.golf .home-menu-content:hover {background: rgba(76,82,10,0.8)}
.home-menu-item.pro .home-menu-content:hover {background: rgba(62,114,91,0.8)}
.menu-title {font-size: 46px;color: #fff;margin-top: 32px;}
.menu-sub-title {font-size: 13px;color: #fff;margin-top: 3px;letter-spacing: 3px;}

.img-forward {position: absolute;bottom: 4.1vw;left: 24px}
.main-arrow {position: absolute;bottom: 2.5vw;left: 50%;transform: translateX(-50%);z-index: 100;display: flex;width: 42px;height: 85px}
.main-arrow li {width: 40px;height: 85px;list-style: none;display: table}
.home-arrow-down {display: block;z-index: 1000}
.main-content {width: 1200px;min-width: 1200px;margin: auto;display: block;height: auto}
.notice-content {width: 100%;height: auto;display: block;margin-top: 102px}
.notice-title {font-size: 28px;color: #484848}
.notice-sub-content {width: 100%;display: flex;height: auto;margin-top: 10px}
.notice-sub-title {font-size: 16px;color: #5a5a5a}
.notice-view-more {font-size: 14px;color: #024625;margin-left: auto;cursor: pointer}
.notice-list {width: 100%;display: flex;height: auto;margin-top: 20px;margin-bottom: 120px}
.notice-item {width: 370px;height: auto;display: block;margin-right: 30px;float: left;background: #f6f8f7;padding: 50px 30px;border: 3px solid #f6f8f7;}
.notice-item.active {border: 3px solid #024625;}
.notice-time {font-size: 12px;color: #a1a1a1}
.notice-name {font-size: 18px;color: #242625;margin-top: 10px}

ul.sub-menu li a.nav-link {padding-left: 30px !important;color: #aaaaaa !important;font-family: 'NotoSansCJKkr-Regular' !important}
ul.sub-menu li.active a.nav-link {padding-left: 30px !important;color: #000 !important;font-family: 'NotoSansCJKkr-Medium' !important}

.c-content {width: 100%;height: auto;display: block}
.c-header {width: 100%;height: auto;display: block;position: relative;}
.c-header > img {width: 100%;height: 564px;object-fit: cover}
.c-header > img.ico-human {width: 46px;height: 46px;object-fit: cover;position: absolute;top: 120px;left: 174px}
.c-header-intro {color: #fff;font-size: 52px;line-height: 66px;position: absolute;top: 180px;left: 172px;font-family: 'NotoSansCJKkr-Bold'}
.c-middle {width: 100%;height: auto;display: block;position: relative}
.c-middle > img {width: 100%;height: 737px;object-fit: cover}
.c-middle-content {width: 100%;height: 737px;display: block;padding: 110px 50px 77px 50px;position: absolute;top: 0;left: 0}
.c-m-greet {font-size: 14px;color: #024625;font-family: 'NotoSansCJKkr-Medium'}
.c-m-title {font-size: 48px;color: #5a5a5a;margin-top: 30px;line-height: 62px;font-family: 'NotoSansCJKkr-Light'}
.c-m-title > span {font-family: 'NotoSansCJKkr-Medium'}
.c-m-content {font-size: 16px;color: #5d5d5d;line-height: 28px;font-family: 'NotoSansCJKkr-Regular'}
.c-m-content > span {font-family: 'NotoSansCJKkr-Bold';position: relative;z-index: 10000}
.c-m-content > span > span {position: absolute;bottom: 3px;left: 0;width: 100%;height: 7px;background: #d3ded6;z-index: -1}

.c-m-btn {width: 230px;height: 50px;text-align: center;line-height: 50px;background: #024625;font-size: 14px;color: #fff;position: absolute;left: 50%;bottom: 38px}
.c-footer {width: 100%;height: 477px;position: relative;display: block}
.c-footer > img {width: 100%;height: 477px;object-fit: cover}
.c-footer-content {width: auto;height: auto;display: block;position: absolute;top: 0;left: 50%;transform: translateX(-50%)}
.c-f-title {font-size: 14px;color: #fff;margin-top: 110px;text-align: center;font-family: 'NotoSansCJKkr-Medium'}
.c-f-sub-title {font-size: 48px;text-align: center;color: #fff;margin-top: 30px;font-family: 'NotoSansCJKkr-Light'}
.c-f-sub-title > span {font-family: 'NotoSansCJKkr-Medium'}
.c-f-content {font-size: 20px;color: #fff;text-align: center;margin-top: 45px;line-height: 34px;font-family: 'NotoSansCJKkr-Regular'}

.company-main-content {width: 100%;height: auto;padding: 100px 0 100px 50px}
.c-main-title {font-size: 13px;color: #024625;font-family: 'NotoSansCJKkr-Medium'}

.c-main-content {width: 100%;height: auto;display: flex}
.c-work-item {width: 530px;height: 900px;display: block;background: #f6f8f7;position: relative}
.c-work-header {width: 100%;height: auto;padding: 55px 62px;}
.c-w-h {width: 100%;height: auto;position: relative}
.c-w-num {font-size: 170px;color: #f1f1f1;line-height: 170px;font-family: 'NotoSansCJKkr-Black'}
.c-w-title {font-size: 20px;color: #5a5a5a;position: absolute;bottom: 18px;left: 0;line-height: 24px;font-family: 'NotoSansCJKkr-Medium'}
.c-w-content {font-size: 14px;color: #474948;margin-top: 50px;font-family: 'NotoSansCJKkr-Regular'}
.c-w-img {width: 450px;height: 390px;position: absolute;left: 0;bottom: 50px;object-fit: cover;opacity: 0.9}

.c-info-content {width: 100%;height: 990px;display: block;position: relative}
.c-info-banner {width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.c-info-c {width: 100%;height: 990px;display: block;padding: 110px 0 0 330px;position: absolute;top: 0;left: 0}
.c-info-pad {width: 100%;height: auto;display: flex}
.c-info-title {width: 250px;height: auto;display: block;text-align: left;font-size: 18px;color: #222222;padding-left: 70px;margin-top: auto;margin-bottom: auto;font-family: 'NotoSansCJKkr-Regular'}
.c-info-mean {width: auto;height: auto;display: block;text-align: left;font-size: 24px;color: #024625;font-family: 'NotoSansCJKkr-Medium'}
.line-spec {width: 100%;height: 1px;background: #ddd}
.c-info-item {width: 227px;height: auto;display: block;margin-right: 120px;float: left;margin-bottom: 20px}
/*.c-info-item > img {border: 1px solid #ddd}*/
.c-info-item > .c-main-title {margin-top: 10px}
.c-info-style {width: 1050px;display: block}

.c-intro-content {width: 100%;height: 755px;background: url("../img/bg_company_social.png") no-repeat 100% 100%;position: relative;padding: 110px 0 0 330px}
.c-i-title {font-size: 14px;color: #8fa495;font-family: 'NotoSansCJKkr-Medium'}
.c-i-content {font-size: 48px;color: #fff;margin-top: 28px;line-height: 62px;font-family: 'NotoSansCJKkr-Light'}
.c-i-content > span {font-family: 'NotoSansCJKkr-Medium'}
.c-info-pad {width: 100%;display: flex;height: auto}
.c-info-m {font-size: 20px;color: #89a095;margin-top: 45px;line-height: 24px;font-family: 'NotoSansCJKkr-Regular'}
.c-in-item {width: 600px;height: auto;display: block}
.c-info-img {width: 182px;height: 182px;border-radius: 50%}

.c-con-content {width: 1100px;height: auto;display: block;margin: auto}
.c-con-title {font-size: 48px;color: #222;margin-top: 35px;height: 50px;font-family: 'NotoSansCJKkr-Medium'}
.c-con-map {width: 100%;height: 520px;object-fit: cover;margin-top: 44px}
.c-con-sub {font-size: 32px;color: #222;margin-top: 45px;font-family: 'NotoSansCJKkr-Regular'}
.c-addr-content {width: 100%;display: flex;height: 56px}
.c-addr-left {width: 630px;height: auto;display: block;font-size: 16px;line-height: 28px;color: #5a5a5a;font-family: 'NotoSansCJKkr-Regular'}
.line-ver {width: 1px;height: 100%;background: #ddd}
.c-addr-right {width: auto;height: auto;display: block;font-size: 16px;line-height: 28px;color: #5a5a5a;padding-left: 90px;font-family: 'NotoSansCJKkr-Regular'}

.work-content {width: 100%;height: auto;display: block;padding: 60px 0 0 50px;}
.work-tab {width: 100%;height: 80px;display: flex}
.work-tab-item {background: #f5f7f6;width: 25%;height: 100%;text-align: center;font-size: 16px;color: #9fa1a0;line-height: 80px;cursor: pointer}
.work-tab-item.active {background: #024625;color: #fff;box-shadow: 10px 10px 25px 5px rgba(3, 33, 18,0.2);z-index: 999}
.work-tab-content {width: 100%;height: auto;display: block}
.work-tab-main {width: 100%;display: flex;height: auto}
.work-tab-main > img {width: 55%;height: 850px;object-fit: cover;margin-left: auto}
.work-tab-left {width: 45%;height: auto;display: block}
.w-title {font-size: 48px;color: #222;margin-top: 35px;line-height: 62px;font-family: 'NotoSansCJKkr-Light'}
.w-title > span {font-family: 'NotoSansCJKkr-Medium'}
.w-sub-title {font-size: 48px;color: #222;font-family: 'NotoSansCJKkr-Light'}
.w-sub-title > span {font-family: 'NotoSansCJKkr-Medium'}
.w-lesson-title {font-size: 48px;color: #222;margin-top: 45px;font-family: 'NotoSansCJKkr-Medium';line-height: 62px}
.w-content {font-size: 16px;line-height: 28px;color: #5a5a5a;padding-right: 100px;margin-top: 15px;font-family: 'NotoSansCJKkr-Regular'}
.w-lesson-content {font-size: 16px;line-height: 28px;color: #5a5a5a;margin-top: 35px;font-family: 'NotoSansCJKkr-Regular'}
.w-label {font-size: 20px;color: #024625}
.w-rank-content {width: 100%;display: flex;height: auto}
.w-rank-item {width : 100px;height: 100px;font-size: 16px;color: #5a5a5a;line-height: 100px;text-align: center;display: block;font-size: 16px;border-radius: 50%;background: #e6ecea;background-size: 100%;}
.w-rank-item .w-rank-bg {width: 100px;height: 100px;line-height: 100px;font-size: 16px;color: #222;border-radius: 50%;background: #e6ecea;background-size: 100%;}
.w-rank-line {margin-left: 26px;margin-right: 26px;width: 16px;height: 27px;margin-top: auto;margin-bottom: auto;line-height: 100px}
.w-rank-item.active {background: #024625;color: #fff}
.s-content {width: 100%;height: auto;display: flex}
.s-item {width: 25%;height: auto;display: block}
.i-detail {width: 32px;height: 42px}
.s-label {margin-top: 20px;font-size: 16px;font-family: 'NotoSansCJKkr-Black';color: #222}
.s-content {font-size: 16px;color: #5a5a5a;margin-top: 10px}
.i-price {width: 42px;height: 42px}
.i-event {width: 42px;height: 42px}
.i-moon {width: 42px;height: 42px}
.i-graph {width: 42px;height: 30px}
.i-golf {width: 49px;height: 42px}
.i-camera {width: 47px;height: 32px}
.i-phone{width: 22px;}
.g-content {width: 100%;display: block;height: auto}
.g-item {width: 31%;height: auto;display: block;float: left;}
.g-sub-title {font-size: 20px;color: #000;line-height: 30px}
.g-title {font-size: 16px;color: #5a5a5a;line-height: 28px;font-family: 'NotoSansCJKkr-Regular'}
.g-item > img {width: 100%;height: 500px;object-fit: cover;margin-top: 28px}
.c-p-title {font-size: 48px;color: #222;font-family: 'NotoSansCJKkr-Medium'}
.c-p-info {font-size: 16px;color: #5a5a5a;line-height: 28px;font-family: 'NotoSansCJKkr-Regular'}
.c-p-content {width: 100%;height: 270px;display: flex;background: #024625}
.c-p-item {width: 33.33%;height: 100%;display: block;position: relative}
.p-item-label {font-size: 102px;color: #335d49;line-height:102px;position: absolute;top: 70px;left: 90px;font-family: 'NotoSansCJKkr-Black'}
.p-item-title {font-size: 42px;color: #fff;z-index: 1;position: absolute;top: 115px;left: 110px;font-family: 'NotoSansCJKkr-Bold'}
.p-item-title > span {font-family: 'NotoSansCJKkr-Regular'}
.btn-desire {width: 220px;height: 66px;line-height: 66px;text-align: center;color: #024625 !important;border: 1px solid #024625;font-size: 20px;margin-top: 28px;margin-bottom: 120px;cursor: pointer;display: block;text-decoration: none !important;font-family: 'NotoSansCJKkr-Regular'}

.w-notice-title {font-size: 46px;font-family: 'NotoSansCJKkr-Medium';color: #222}
.faq-content {width: 100%;display: block;height: auto}

.faq-list {width: 50%;display: block;height: auto;float: left;padding-right: 32px;margin-bottom: 33px}
.faq-item {width: 100%;display: block;height: auto;}
.faq-top-pad {width: 100%;padding-top: 47px;padding-bottom: 47px;padding-right: 103px;padding-left: 50px;background: url("../img/01_main_ico_arrow_more.png") right center no-repeat;background-size: 26px;background-position: 90%;background-color: #f6f8f7;cursor: pointer;display: flex;font-size: 18px;line-height: 26px;font-family: 'NotoSansCJKkr-Regular';color: #181a19}
.faq-list.active .faq-item .faq-top-pad {background: url("../img/07_signup_ico_allow_top.png") right center no-repeat;background-size: 26px;background-position: 90%;background-color: #f6f8f7;}

.faq-sub-content {width: 100%;padding-left: 50px;display: none;background-color: #f6f8f7;}

.faq-line-content {width: 100%;padding-right: 50px;display: block}
.faq-line {width: 100%;height: 1px;background: #b9bbba}
.faq-mean {width: 100%;padding: 50px 50px 50px 0;color: #5a5a5a;font-family: 'NotoSansCJKkr-Regular';font-size: 14px;line-height: 26px;}
.faq-list.active .faq-sub-content {display: block;}

.n-d-content {width: 100%;height: auto;display: block}
.n-d-header {display: flex;width: 100%;height: auto}
.n-d-title {font-size: 18px;color: #222}
.n-d-time {font-size: 14px;color: #a1a1a1;margin-left: auto}

.n-d-mean {width: 100%;height: auto;background: #f6f8f7;padding: 46px 52px;font-size: 14px;line-height: 26px;color: #5a5a5a;}
.n-d-list {width: 140px;height: 50px;line-height: 50px;text-align: center;color: #024625;border: 1px solid #024625;font-size: 14px;margin-top: 50px;margin-bottom: 120px}


.pagination-content {width: auto;display: flex;margin: 50px auto 100px;position: absolute;left: 50%;transform: translateX(-50%)}
.btn-page {width: 32px;height: 32px;font-size: 12px;line-height: 32px;text-align: center;border: 1px solid #bbb;display: block;margin-right: 10px;color: #bbb}
.btn-page.active {background: #024625;color: #fff;border: 1px solid #024625}

.c-info-i {width: 100%;height: 100%;position: absolute;left: 0;top: 0;z-index: -1}
.media-ico {
    content: "";
    position: absolute;
    top: 20px;
    right: 20px;
    background-image: url(../img/21_ico_type_movie.png);
    background-size: 100% 100%;
    width: 30px;
    height: 20px;
}
.detail-item-img {position: relative}
.g-detail-content {width: auto;display: flex;height: 30px}
.golf-form-control {width: 100%;display: flex;height: 32px}
.golf-label {width: 128px;font-size: 14px;font-family: 'NotoSansCJKkr-Regular';color: #a1a1a1;display: block;line-height: 32px}
.pro-label {width: 78px;font-size: 14px;font-family: 'NotoSansCJKkr-Regular';color: #a1a1a1;display: block;line-height: 32px}
.golf-c {font-family: 'NotoSansCJKkr-Regular';color: #222;line-height: 32px}
.f-addr-map {width: 700px;height: 290px;object-fit: cover;margin-bottom: 40px}
.pro-item-gray {width: 100%;height: auto;display: block;font-family: 'NotoSansCJKkr-Regular';color: #a1a1a1;margin-top: 5px}

/*select*/
.golf-select {position: relative;width: 100%;height: 50px;cursor: pointer;border: 1px solid #eeeeee;}
.golf-select > a {line-height: 48px;text-align: center;font-size: 14px !important;color: #222 !important;border-radius: 0 !important;font-family: 'NotoSansCJKkr-Regular' !important;text-decoration: none !important;display: block}
.golf-select input {cursor: pointer;}
.golf-select:after {content: ' ';position: absolute;width: 26px;height: 100%;right: 20px;top: 0;background: url('../img/ico_arrow_down.png') right center no-repeat;background-size: 10px;}
.golf-select > ul {display: none;position: absolute;width: 100%;margin: 0;padding: 0;list-style: none;background: #ffffff;box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.3);border-radius: 3px;z-index: 1;max-height:268px;overflow-y: auto;margin-top: 0 !important}
.golf-select > ul > li {height: 50px;}
.golf-select > ul > li > a {display: block;height: 100%;font-size: 14px;color: #222;cursor: pointer;line-height: 50px;text-align: center;text-decoration: none !important}
.golf-select > ul > li.active a {color: #000;}
.golf-select > ul > li > a:hover {background: #f6f8f7;text-decoration: none !important}
/*.golf-select {width: 100%;background-color: #fff !important;border-bottom: 1px solid #c9c9c9 !important;height: 50px;font-size: 14px !important;color: #222 !important;border-radius: 0 !important;font-family: 'NotoSansCJKkr-Regular' !important;background: url('../img/ico_arrow_down.png') right center no-repeat;background-size: 10px;}*/

.golf-area-select {position: relative;width: 100%;height: 50px;cursor: pointer;border: 1px solid #eeeeee;}
.golf-area-select > a {line-height: 48px;text-align: left;font-size: 14px !important;color: #222 !important;border-radius: 0 !important;font-family: 'NotoSansCJKkr-Regular' !important;padding-left: 51px;text-decoration: none !important}
.golf-area-select input {cursor: pointer;}
.golf-area-select:after {content: ' ';position: absolute;width: 26px;height: 100%;left: 25px;top: 0;background: url('../img/ico_golf_position.png') left center no-repeat;background-size: 15px;}
.golf-area-select .province-content {display: none;position: absolute;margin: 0;padding: 0;background: #ffffff;box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.3);border-radius: 3px;z-index: 1;max-height:268px;height:268px;overflow-y: auto;margin-top: 0 !important;width: 450px;min-width: 400px;}
.city-content {width: 100px;height: auto;display: block;float: left}
.city-content .city-item {width: 100px;height: 50px;display: block;text-align: center;line-height: 50px;text-decoration: none;color: #777;font-family: 'NotoSansCJKkr-Regular';background: #f6f8f7;cursor: pointer;font-size: 14px}
.city-content .city-item.active {background: #fff;color: #5b8e75}
.area-content {width: 300px;display: block;height: auto;float: left}
.area-content .area-item {width: 100px;height: 50px;line-height: 50px;display: block;text-align: center;font-size: 14px;color: #222;float: left;text-decoration: none !important}

 .owl-controls {
     position: absolute !important;
     bottom: 30px !important;
     left: 50% !important;
     transform: translateX(-50%) !important;
 }

/*.owl-dot {width: 70px;height:4px}*/
.owl-dot > span {background: rgba(255,255,255,0.3) !important; width: 7px !important; height: 7px !important; border-radius: 5px !important; margin-left: 15px !important; margin-right: 15px !important;}
.owl-dot.active > span {background: rgba(255,255,255,1) !important; width: 7px !important; height: 7px !important; border-radius: 5px !important; margin-left: 15px !important; margin-right: 15px !important;}

.slide_num {font-size: 20px;font-family: 'NotoSansCJKkr-Bold';color: #fff;left: 63px;bottom: 77px;position: absolute}
.pro-line {width: 100%;height: 1px;background: #ededed;display: block;margin-bottom: 30px}

#gallery_slide_pad .owl-item {width: 240px !important}

.modal-backdrop, .modal-backdrop.fade.in {
    opacity: 0.5 !important;
}
.detail-pad {width: 722px;height: 405px;display: block;position: fixed;z-index: 10000000;top: 50%;left: 50%;transform: translate(-50%,-50%)}
#detail_slide .owl-controls {position: absolute;top: 50% !important;left: 50% !important;transform: translate(-50%,-50%)}
#detail_slide .owl-nav {width: 100%;display: flex;height: 82px}
#detail_slide .owl-nav > div {width: 82px;height: 82px;background-color: #3f3f3f !important;margin: 0 !important;border-radius: 0 !important;display: block;position: relative}
#detail_slide .owl-nav > div:hover {width: 82px;height: 82px;background-color: #024625 !important;}
#detail_slide .owl-nav > div.owl-next {margin-left: auto !important}
#detail_slide .owl-nav > div.owl-next {background: url("../img/ic_next.png") no-repeat center center;background-size: 20px}
#detail_slide .owl-nav > div.owl-prev {background: url("../img/ic_prev.png") no-repeat center center;background-size: 20px}

.modal-close {width: 100px;height: 100px;display: block;position: relative;cursor: pointer;background: url("../img/ic_close.png") no-repeat center center;background-size: 35px;position: fixed;top: 0;right: 0}

.fs-20 {font-size: 20px !important}

.kh-container {
    width: 100%;
    height: auto;
    display: block;
}

.kh-header {
    line-height: 36px;
    height: 36px;
    width: 100%;
    background-color: #e9e9e9;
}

.kh-content {
    height: 490px;
    width: 100%;
    background-color: #e9e9e9;
}

.kh-item-group {
    margin: auto;
    width: 940px;
    padding-top: 55px;
    display: flex;
}

.kh-footer-content {
    margin: auto;
    width: 940px;
    padding-top: 30px;
    padding-bottom: 30px;
}

.kh-footer {
    height: auto;
    min-height: 300px;
    width: 100%;
    background-color: #666666;
    display: grid;
    align-items: center;
}

.kh-menu-logo {
    line-height: 63px;
    height: 63px;
    background-color: white;
    text-align: center;
}

.kh-menu-tab {
    font-size: 20px;
    display: flex;
    cursor: pointer;
}

.kh-menu-tab>div:hover {
    color: #2d4285;;
}

.kh-slider {
    width: 100%;
    height: 560px;
    object-fit: cover;
    cursor: pointer;
}

.kh-content-item {
    margin: auto;
    width: 300px;
    cursor: pointer;
}

.kh-content-item a {
    text-decoration: none !important;
}

.kh-item-top {
    width: 300px;
    height: 100px;
    border: solid #c5c5c5 1px;
    margin-bottom: 10px;
    background-color: white;
}

.kh-top-bg {
    margin: 10px;
    height: 78px;
}

.kh-top-img {
    line-height: 36px;
    text-align: center;
}

.kh-top-title {
    line-height: 44px;
    text-align: center;
    color: white;
    font-size: 19px;
    cursor: pointer;
    font-family: NotoSansCJKkr-Bold;
}

.datepicker-dropdown {
    width: 330px;
}

span.month {
    font-size: 14px;
}

table.table-condensed>thead>tr>th, table.table-condensed tr:last-child {
    border-bottom: none !important;
    border-top: none !important;
}

.kh-item-bottom {
    width: 300px;
    height: 260px;
    border: solid #c5c5c5 1px;
    text-align: center;
    background-color: white;
    color: grey;
    display: grid;
    align-items: center;
}

.kh-bottom-content {
    font-size: 16px;
    cursor: pointer;
    padding: 0 8px !important;
    height: 260px;
}

.kh-footer-line {
    height: 2px;
    background-color: white;
    margin-top: 20px;
    margin-bottom: 40px;
}

.kh-notice-title {
    font-family: NotoSansCJKkr-Bold;
    font-size: 36px;
    color: white;
    cursor: pointer;
}

.kh-notice-content {
    font-size: 16px;
    font-family: NotoSansCJKkr-Medium;
    color: white;
    cursor: pointer;
}

.dropdown-tab {
    width: 100% !important;
    border-radius: 0px !important;
    height: 285px;
    margin-top: -1px;
    background-color: #f1f2f2;
    border: none;
}

.kh_menu_group {
    width: 9vw;
    text-align: center;
    color: black;
    font-weight: bold;
    padding-top: 10px;
}

.kh_menu_group:hover .kh_menu_item {
    color: black;
    font-weight: bold;
}

.kh_menu_item {
    cursor: pointer;
    font-weight: lighter;
    display: block;
    height: 28px;
    line-height: 28px;
    color: #c2cad8;
}

.kh_menu_group:hover .kh_menu_item:hover {
    color: #FF3F3F;
}

.kh-modal-layout {
    display: grid;
    align-items: center;
}

.kh-signup-layout {
    width: 800px;
    height: 500px;
    background-color: white;
    margin: auto;
    text-align: center;
}

.kh-popup-layout {
    width: 600px;
    height: 400px;
    background-color: white;
    margin: auto;
    text-align: center;
}

.kh-add-class {
    width: 480px;
    min-height: 400px;
    max-height: 600px;
    height: auto;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 30px;;
}

.kh-add-record {
    width: 400px;
    min-height: 180px;
    max-height: 250px;
    height: auto;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 20px;;
}
.kh-add-subject {
    width: 480px;
    height: 260px;
    background-color: white;
    margin: auto;
    text-align: center;
}

.kh-reg-student {
    width: 480px;
    min-height: 430px;
    max-height: 600px;
    height: auto;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 30px;
}

.kh-modify-student {
    width: 480px;
    min-height: 360px;
    max-height: 600px;
    height: auto;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 30px;
}

.kh-deposit {
    width: 480px;
    /* 2023.01.22 minseok height 430 -> 500 */
    height: 500px;
    background-color: white;
    margin: auto;
    text-align: center;
}

.kh-manage_timetable {
    width: 480px;
    min-height: 350px;
    max-height: 440px;
    height: auto;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 30px;
}

.kh-change-grade {
    width: 480px;
    height: auto;
    min-height: 366px;
    max-height: 600px;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 30px;
}

.kh-card-type {
    width: 800px;
    height: 700px;
    background-color: white;
    margin: auto;
    text-align: center;
    overflow-y: auto;
    padding-bottom: 30px;
}

.kh-forward {
    width: 480px;
    height: 300px;
    background-color: white;
    margin: auto;
    text-align: center;
    overflow-y: auto;
    padding-bottom: 30px;
}

.kh-time_table {
    width: 480px;
    height: 860px;
    background-color: white;
    margin: auto;
    text-align: center;
}

.kh-add-subject {
    width: 400px;
    height: 250px;
    background-color: white;
    margin: auto;
    text-align: center;
    z-index: 100;
}

.kh-signup-content {
    font-size: 20px;
    color: grey;
}

.kh-modal-line {
    display: flex;
    margin-top: 16px;
}

.kh-modal-line-left {
    font-size: 12px;
    width: 30%;
    text-align: right;
    padding-right: 10px;
    padding-left: 30px;
    margin-top: 2px;
    color: black
}

.kh-select {
    border-radius: 0px;
    height: 20px;
    font-size: 12px;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 100px;
}

.kh-input {
    border-radius: 0px;
    height: 20px;
    font-size: 12px;
    width: 100px;
}

.kh-modal-line-right {
    font-size: 12px;
    width: 70%;
    text-align: left;
    padding-left: 10px;
    padding-right: 50px;
    color: black
}

.kh-btn-back {
    width: 120px;
    height: 40px;
    border-radius: 0 !important;
    margin-left: auto;
    margin-right: 10px;
}

.kh-btn-login {
    width: 120px;
    height: 40px;
    border-radius: 0 !important;
    margin-right: auto;
    margin-left: 10px;
    background-color: #2d4285;
}

.kh-popup-close {
    width: 120px;
    height: 40px;
    border-radius: 0 !important;
    margin-right: auto;
    margin-left: 10px;
    margin-top: -10px;
    background-color: #2d4285;
}

.kh-btn-back {
    width: 120px;
    height: 40px;
    border-radius: 0 !important;
    margin-left: auto;
    margin-right: 10px;
}

.kh-page-container {
    padding-left: 0px;
    padding-right: 0px;
    border-top: solid 1px lightgray;
}

.kh-content-menu {
    float: left;
    width: 240px;
    margin-right: 10px;
    margin-left: 21%;
    border: solid 1px lightgray;
}

.font-title {
    font-family: NotoSansCJKkr-Bold;
    font-size: 20px;
}

.kh-content-content {
    float: left;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
    text-align: center;
}

.kh-academic-title {
    font-size: 20px;
    background-color: #2d4285;
    line-height: 40px;
    height: 40px;
    width: 100%;
    text-align: center;
    color: white;
}

.kh-academic-item {
    font-size: 16px;
    margin-left: 20px;
    margin-right: 20px;
    border-bottom: solid 1px lightgray;
    line-height: 55px;
    height: 55px;
    text-align: center;
    color: gray;
    cursor: pointer;
}

.kh-academic-item:hover {
    color: #2d4285;
}

.kh-academic-item.active {
    color: #2d4285;
}

.kh-content-title {
    font-size: 14px;
    margin-top: 20px;
    margin-bottom: 20px;
    color: grey
}

.kh-footer1 {
    height: 137px;
    width: 100%;
    color: #666666;
    background-color: white;
    align-items: center;
}

.foot_content {
    text-align: left;
    font-size: 14px;
    cursor: pointer;
    color: #666666;
    padding: 20px !important;
    line-height: 28px;
}

.foot_logo {
    text-align: left;
    font-weight: bold;
    font-size: 20px;
    cursor: pointer;
    color: black;
    padding: 20px 0 !important;
}

.kh-custom-pagination {
    width: 20px !important;
    height: 20px !important;
    margin-top: 9px !important;
    margin-left: 5px !important;
    margin-right: 5px !important;
    padding: 0px !important;
}

.kh-custom-page-active {
    background-color: white !important;
    border-color: white !important;
    color: red !important;
    margin-top: 3px;
    width: 20px;
    height: 20px;
    margin-right: 3px;
}

.kh-custom-page-normal {
    background-color: white !important;
    border-color: white !important;
    color: darkslategray !important;
    margin-top: 3px;
    width: 20px;
    height: 20px;
    margin-right: 3px;
}

.border_label {
    border: 1px solid #a3a3a3;
    height: 140px;
    width: 79%;
    padding: 20px;
    display: inline-block;
    overflow-y: scroll;
}

.label_agree {
    width: 20%;
    height: 100%;
    vertical-align: top;
    margin-top: 35px;
}

.kh-checkbox1 input[type="checkbox"] {
    display: none;
}

.kh-checkbox1 input[type="checkbox"] + i {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 30px 30px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-checkbox1 input[type="checkbox"]:checked + i {
    background: url("../img/ic_check_on.png") no-repeat center;
    background-size: 30px 30px;
}

.kh-checkbox1 input[type="radio"] {
    display: none;
}

.kh-checkbox1 input[type="radio"] + i {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 30px 30px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-checkbox1 input[type="radio"]:checked + i {
    background: url("../img/ic_check_on.png") no-repeat center;
    background-size: 30px 30px;
}

table tr:last-child {
    border-bottom: solid 1px lightgray;
}

table.tbl_video tr:last-child {
    border-bottom: none !important;
}

table.dataTable.table-shipping thead th {
    padding: 14px 0 !important;
    color: #666666 !important;
    font-weight: bold;
    font-size: 20px !important;
    vertical-align: middle;
    border: none !important;
    cursor: pointer;
}

#tbl_pay_month_wrapper {
    width: 100%;
}

.table_no_footer .dataTables_paginate {
    display: none !important;
}

.table.table-shipping>tbody>tr>td:first-child {
    text-align: left;
}
.table.table-shipping>tbody>tr>td {
    vertical-align: inherit;
    cursor: pointer;
    text-align: center;
    font-size: 16px !important;
}

table.dataTable.table-shipping.table-bordered-gray thead th, .table-bordered-gray, .table-bordered-gray>tbody>tr>td, .table-bordered-gray>tbody>tr>th, .table-bordered-gray>tfoot>tr>td, .table-bordered-gray>tfoot>tr>th, .table-bordered-gray>thead>tr>td, .table-bordered-gray>thead>tr>th {
    border: 1px solid #b7b8b9 !important;
}

.table.table-shipping>tbody>tr>td.price_info {
    height: 140px;
    font-size: 36px !important;
    color: black !important;
}

.shipping_list_img {
    width: 70px;
    height: 100px;
    object-fit: cover;
    margin-left: 20px;
}

.enter_data {
    margin-top: 40px;
    padding: 30px 40px !important;
    border: 1px solid #b7b8b9;
}

label {
    font-weight: 400;
}

.btn_order {
    border-radius: 0 !important;
    background: #2d4285;
    color: white;
    width: 100%;
    height: 221px;
}

.shipping_list_img {
    width: 70px;
    height: 100px;
    margin-left: 20px;
}

.shipping_info_title {
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #c5c5c6;
    text-align: center;
    color: #666666;
    padding-top: 15px;
}

.cart_btn {
    padding: 5px !important;
    background: white !important;
    border: 1px solid #c2c2c2;
    color: #666666 !important;
    vertical-align: initial;
    margin-left: 20px !important;
    border-radius: 0 !important;
    width: 240px;
    height: 40px;
}

.shipping_btn {
    padding: 5px !important;
    background: white !important;
    margin-top: 31px !important;
    border: 1px solid #c2c2c2;
    color: #666666 !important;
    vertical-align: initial;
    margin-left: 20px !important;
    border-radius: 0 !important;
}

.detail_row {
    height: 55px;
    padding-top: 12px;
    border-bottom: solid 1px #c5c5c6;
}

.text-gray {
    color: #666666;
}

.dataTables_empty {
    text-align: center !important;
}

.shipping_info_title {
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #c5c5c6;
    text-align: center;
    color: #666666;
    padding-top: 15px;
}

.select2-container .select2-selection--single .select2-selection__clear, .select2-container--bootstrap .select2-selection--single .select2-selection__arrow {
    display: none;
}

.select2-container--bootstrap .select2-dropdown {
    z-index: 1500;
    border-top: 1px solid #c5c5c6;
}

.select2-bootstrap-append .input-group-btn {
    border: 1px solid #c5c5c6;
    width: 55px;
    text-align: center;
    position: absolute;
    margin-left: calc(100% - 55px);
    z-index: 1500;
    height: 60px;
    line-height: 60px;
    cursor: pointer;
}

.gray_label {
    width: 100%;
    height: 60px;
    border: 1px solid #b7b8b9;
    border-left: none;
    background: #e9e9e9;
    text-align: center;
    line-height: 55px;
}

.ic_cs_arrow_bottom {
    width: 16px;
}

.white_label {
    width: 100%;
    height: 160px;
    border: 1px solid #b7b8b9;
    border-top: none;
    border-left: none;
    text-align: center;
    line-height: 130px;
    margin-top: -5px;
    margin-bottom: 0;
}

.select2-selection {
    height: 60px !important;
    font-size: 16px !important;
    color: #666666 !important;
    line-height: 47px !important;
    border: 1px solid #c5c5c6 !important;
}

.label_info {
    width: 100%;
    overflow: hidden;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 95px;
    text-align: center;
}

table>thead>tr>th {
    border-top: solid 2px #2d4285 !important;
    border-bottom: solid 2px #2d4285 !important;
}

.table>thead>tr>th {
    border-bottom-width: 0px;
}

.table>tbody>tr>td {
    padding-top: 12px !important;
}

.kh-btn-primary {
    width: 60px;
    height: 20px;
    border-radius: 0 !important;
    margin-right: auto;
    margin-left: auto;
    background-color: #2d4285;
    font-size: 12px !important;
    padding: 0px;
    color: white;
}

.kh-btn-primary:hover {
    color: white;
}

.kh-btn-primary:focus {
    color: white;
}

.kh-btn-default {
    width: 60px;
    height: 20px;
    border-radius: 0 !important;
    margin-right: auto;
    margin-left: auto;
    background-color: white;
    font-size: 12px !important;
    padding: 0px;
    border-color: #adadad;
    color: dimgray;
}

.kh-btn-modal {
    width: 60px;
    height: 20px;
    margin-right: 10px;
    font-size: 12px !important;
}

.kh-modal-top {
    width: 40px;
    height: 6px;
    background-color: #2d4285;
}

.kh-checkbox {
    margin-right: 15px;
}

.kh-tbl-checkbox {
    margin-right: 10px !important;
    font-size: 12px;
    cursor: pointer;
}

.push_target {
    width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn_search {
    font-size: 20px !important;
    color: white !important;
    width: 140px;
    height: 60px;
    background: #2d4285;
    border-radius: 0 !important;
    font-weight: bold !important;
}

.table.tbl_textbook>tbody>tr>td {
    padding: 0 !important;
    border: 1px solid #a9aaab;
}

.table.tbl_textbook.tbl_video>tbody>tr>td {
    border: none !important;
}

.progress {
    height: 4px;
    background-color: #999999;
    margin-top: 10px;
}

.progress-bar-success {
    background-color: #2d4285;
}

.tab-content .tab-pane .input-group {
    padding-left: 70px;
    padding-right: 70px;
    margin-top: 20px;
}

.nav-pills>li.book_nav {
    margin: 0 5px;
    border: 1px solid #c2c2c2;
}

.nav-pills>li.book_nav.active {
    border: 1px solid #2d4285;
}

.nav-pills>li.book_nav>a {
    color: #666666;
    font-weight: bold;
    font-size: 20px;
    background-color: white;
    padding: 6px 0;
    border: none !important;
    border-radius: 0;
}

.nav-pills>li.book_nav.active>a, .nav-pills>li.book_nav.active>a:focus, .nav-pills>li.book_nav.active>a:hover {
    color: white;
    background-color: #2d4285;
    border: none !important;
}

.tbl_textbook>thead {
    display: none !important;
}

.table.table_teacher.table_push>thead>tr>th {
    font-size: 15px !important;
    vertical-align: middle;
    padding: 15px 0 !important;
    font-weight: bold !important;
    text-align: center;
}

.ic_temp_book {
    width: 150px;
    height: 190px;
    object-fit: cover;
}

.book_item:hover, .tj-video-item:hover {
    background: #e9e9e9;
}

.book_item {
    padding: 14px 0;
}

.text_detail_img {
    width: 250px;
    height: 350px;
    object-fit: cover;
}

.text_detail {
    margin-bottom: 12px;
}

.spin_group .bootstrap-touchspin {
    float: left;
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 40px !important;
    margin-bottom: 0;
}

.bootstrap-touchspin .input-group-btn {
    padding: 0;
}

.bootstrap-touchspin-down, .bootstrap-touchspin-up {
    border-radius: 0 !important;
    height: 25px;
    width: 40px;
    padding: 0;
}

.cart_touchspin {
    width: 40px;
    height: 25px;
    display: block;
    font-size: 16px;
    padding: 0 !important;
    text-align: center;
}

.bootstrap-touchspin {
    display: table;
    border-collapse: separate;
    width: 118px !important;
    margin: auto;
}

table.dataTable.no-footer {
    border-bottom: none;
}

.table-shipping {
    border: 1px solid #c2c2c2 !important;
    font-size: 12px !important;
}

.btn_download {
    height: 40px;
    color: #666666;
    font-weight: normal !important;
    font-size: 16px !important;
    margin-bottom: 10px;
    border-radius: 0 !important;
    background: #ffffff !important;
    border: 1px solid #a5a5a5;
}

.table.table_teacher.table_push>tbody>tr>td {
    padding: 9px 0 !important;
    font-size: 15px !important;
    font-weight: normal !important;
    border-top: none !important;
    vertical-align: middle;
}

.table.table_teacher.table_push>tbody>tr>td {
    padding: 9px 0 !important;
    font-size: 15px !important;
    font-weight: normal !important;
    border-top: none !important;
    vertical-align: middle;
}

.table.table_teacher.table_semester td {
    vertical-align: initial !important;
}

.table.table_teacher.table_semester>tbody>tr:nth-of-type(even) {
    background-color: #fafbfd;
}

.kh-checkbox input[type="checkbox"] {
    display: none;
}

.kh-checkbox input[type="checkbox"] + i {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 20px 20px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-checkbox input[type="checkbox"]:checked + i {
    background: url("../img/ic_check_on.png") no-repeat center;
    background-size: 20px 20px;
}

.kh-date-checkbox input[type="checkbox"] {
    display: none;
}

.kh-date-checkbox input[type="checkbox"] + i {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 20px 20px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-date-checkbox input[type="checkbox"]:checked + i {
    background: url("../img/ic_check_on_gray.png") no-repeat center;
    background-size: 20px 20px;
}

.kh-full-checkbox input[type="checkbox"] {
    display: none;
}

.kh-full-checkbox input[type="checkbox"] + i {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 20px 20px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-full-checkbox input[type="checkbox"]:checked + i {
    background: url("../img/ic_check_on_green.png") no-repeat center;
    background-size: 20px 20px;
}

.kh-checkbox input[type="radio"] {
    display: none;
}

.kh-checkbox input[type="radio"] + i {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 20px 20px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-checkbox input[type="radio"]:checked + i {
    background: url("../img/ic_check_on.png") no-repeat center;
    background-size: 20px 20px;
}

.kh-checkbox-gray input[type="checkbox"] {
    display: none;
}

.kh-checkbox-gray input[type="checkbox"] + i {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 20px 20px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-checkbox-gray input[type="checkbox"]:checked + i {
    background: url("../img/ic_check_on_gray.png") no-repeat center;
    background-size: 20px 20px;
}

.kh-checkbox-empty input[type="checkbox"] {
    display: none;
}

.kh-checkbox-empty input[type="checkbox"] + i {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 20px 20px;
    vertical-align: middle;
    margin-right: 10px;
    transition: 0.2s;
}

.kh-checkbox-empty input[type="checkbox"]:checked + i {
    background: url("../img/ic_check_off.png") no-repeat center;
    background-size: 20px 20px;
}

.kh-grade-modal-content {
    display: flex;
    margin-left: auto;
    margin-right: auto;
}

.kh-time-table {
    /*width: 70%;*/
    /*margin-left: auto;*/
    /*margin-right: auto*/
}

table.kh-time-table>thead>tr {
    border-top: solid 1px lightgray !important;
    border-bottom: solid 1px lightgray !important;
}

table.kh-time-table>thead>tr>th {
    border-bottom-width: 1px;
}

table.kh-time-table>thead>tr>th {
    text-align: center;
    padding: 0px;
    height: 20px;
    width: 40px;
}

table.kh-time-table>tbody>tr>th {
    height: 20px;
}

table.table-bordered.kh-time-table>thead>tr>th, table.table-bordered.kh-time-table>tbody>tr>th {
    border-color: lightgray !important;
}

table {
    font-size: 12px !important;
}

table.kh-tbl-card>thead>tr>th {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    background-color: #34669d !important;
    border-top-color: #34669d !important;
    border-bottom-color: #34669d !important;
    border-left-color: gray !important;
    border-right-color: gray !important;
    color: white !important;
}

table.kh-tbl-card>tbody>tr>td {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

table.kh-tbl-chart>thead>tr>th {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    background-color: #f0f3f5; !important;
    border: solid 1px lightgray !important;
    color: black;
}

.kh-tbl-card .kh-first-td {
    background-color: gray !important;
    color: white !important;
}

.modal-table>thead>tr>th {
    height: 20px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.modal-table>tbody>tr>td {
    height: 24px !important;
    padding-top: 5px !important;
    padding-bottom: 0px !important;
}

.kh-chart-title {
    text-align: center;
    width: 30%;
}

.kh-chart-content {
    text-align: center;
    width: 70%;
}

.modal-table .table-space {
    padding: 0px !important;
    border-color: white !important;
    width: 10px;
}

.modal-table tr:last-child .table-space {
    border-bottom: solid 1px white !important;
}

.kh-line-space {
    margin-top: 2px;
    margin-bottom: 2px;
    padding-right: 3%;
    padding-left: 3%;
    height: 17px;
}

.kh-tbl-content {
    align-items: center;
    font-size: 12px;
}

.kh-item-file {
    border-bottom: solid 1px #666666;
    font-size: 16px;
    display: flex;
    float: right;
    color: #666666;
    width: 100%;
    padding: 10px 35px 5px;
}

.kh-item-filename {
    margin-left: auto;
    margin-top: 10px;
}

.kh-item-download {
    margin-left: 20px;
    border: 1px solid;
    background-color: #e9e9e9;
    padding: 10px 20px;
    cursor: pointer;
    width: 140px;
}

.kh-item-list {
    background-color: #e9e9e9;
    padding: 10px 20px;
    cursor: pointer;
    width: 140px;
    border: none;
    font-size: 16px;
    color: #666666;
}

.kh-item-content-label {
    border-bottom: solid 1px #000000;
    height: auto;
    padding: 20px 0;
    width: 100%;
    overflow-x: auto;
}

.kh-content-center {
    display: grid;
    align-items: center;
}

.kh-content-header {
    width: 680px;
    height: 60px;
    background-color: #f1f2f2;
    display: flex;
    align-items: center;
}

.kh-consent-content {
    width: 260px;
    height: 60px;
    border: solid 1px lightgray;
    font-size: 10px;
    color: grey;
    display: grid;
    align-items: center;
}

.kh-attendance-img {
    width: 10px;
    height: 10px;
    margin-top: 5px;
}

.kh-tbl-attendance-img {
    width: 10px;
    height: 10px;
    margin-top: -5px;
    cursor: pointer;
}

.kh-header-item {
    margin-right: 20px;
    display: flex
}

.kh-tbl-student {
    width: 100px;
    height: 32px;
    border: solid 1px lightgray;
    font-size: 10px;
    color: white;
    padding: 5px;
    margin-right: 5px;
    text-align: left;
    background-color: #00aa00;
}

#tbl_daily>tbody>tr>td:nth-child(4) {
    padding-top: 6px !important;
    display: flex;
}

.kh-rect-item {
    width: 20px;
    height: 20px;
    border: solid 1px grey;
    cursor: pointer;
}

.kh-month-th {
    width: 60px;
    text-align: center;
    margin-top: 2px;
}

.kh-video-page {
    width: 40px;
    text-align: center;
    margin-top: 2px;
}

.kh-video-page.active {
    color: red;
}

.kh-month-td {
    width: 60px;
    text-align: center;
}

.kh-tbl-btn {
    width: 55px;
    margin-top: -5px
}

.kh-grade-container {
    border: solid 1px gray;
    background-color: white;
    width: 660px;
    margin-top: 10px;
}

.kh-grade-left {
    font-size: 12px;
    width: 25%;
    text-align: center;
    color: black;
    border-right: solid 1px gray;
    padding-top: 20px;
    padding-bottom: 20px;
}

.kh-grade-right {
    font-size: 12px;
    width: 75%;
    text-align: center;
    color: black;
    padding: 0px;
}

.tbl-grade {
    margin-bottom: 0px !important;
}

.tbl-grade>thead>tr>th {
    padding-top: 2px;
    padding-bottom: 2px;
    background-color: #2d4285;
    color: white !important;
    border-color: grey;
}

.tbl-grade>tbody>tr>td {
    padding-top: 2px !important;
    padding-bottom: 2px;
}

.kh-grade-checkbox {
    margin: 0px !important;
}

.kh-grade-checkbox input[type="checkbox"] + i {
    margin: 0px;
}

.kh-download {
    font-size: 16px;
    margin-right: 22px;
}

.kh-video-content {
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
}

.kh-video-pagination {
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    font-size: 12px;
}

.kh-video-line {
    display: flex;
}

.kh-video-item {
    width: 220px;
    height: 240px;
    border: solid 1px #6d6e71;
    margin: 5px;
}

.kh-video-top {
    background-color: #666666;
    height: 50%;
}

.kh-video-bottom {
    padding: 15px 10px 5px 10px;
    height: 50%;
}

.kh-video-img {
    width: 35px;
    height: 25px;
    float: left;
    cursor: pointer;
}

.kh-item-header {
    border-top: solid 2px #2d4285;
    border-bottom: solid 2px #2d4285;
    line-height: 37px;
    height: 37px;
    margin-top: 18px;
    font-size: 12px;
    color: black;
    display: flex;
}

.kh-item-title {
    margin-left: 5px;
}

.kh-item-date {
    margin-right: 5px;
    margin-left: auto;
}

.kh-item-content {
    min-height: 300px;
    height: auto;
    border-bottom: solid 1px grey;
    font-size: 12px;
    color: grey;
    text-align: left;
    padding: 5px;
    width: 100%;
    overflow-x: auto;
}

.kh-inquiry-line {
    border-bottom: solid 1px grey;
    cursor: pointer;
}

.kh-line-left {
    text-align: left;
}

.kh-line-content {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 15px;
    display: flex;
}

.kh-inquiry-lock {
    float: left;
    font-size: 18px;
    margin-left: 10px;
}

.kh-line-right {
    margin-left: auto;
}

.kh-blind {
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 30px
}

.kh-answer-content {
    border: solid 1px grey;
    padding: 10px;
    margin-bottom: 5px;
}

.kh-inquiry-tbl {
    display: grid;
    align-items: center;
}

.kh-inquiry-write {
    display: grid;
    align-items: center;
}

.kh-write-title {
    text-align: left;
    padding: 10px;
}

.kh-write-content {
    text-align: left;
    padding: 10px;
}

.kh-inquiry-content {
    text-align: left;
    padding: 10px;
}

.kh-title-label {
    padding: 5px;
}

.kh-title-ipt {
    border: solid 1px grey;
    width: 100%;
    padding: 5px;
}

.kh-title-area {
    border: solid 1px grey;
    width: 100%;
    height: 200px;
    padding: 5px;
}

.kh-title-ipt:focus {
    border: solid 1px grey;
}

.kh-card-img {
    width: 130px;
}

.kh-sign-container {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 90px;
    height: 80px;
    border: solid 1px lightgray;
}

.kh-sign-top {
    width: 100%;
    height: 20px;
    background-color: lightgray;
}

.kh-card-title {
    margin-top: 10px;
    margin-bottom: 5px;
    font-size: 18px;
    color: #34669d;
}

.kh-card-subject {
    margin-top: 10px;
}

.kh-card-graph {
    margin-top: 10px;
    width: 100%;
    height: 280px;
}

.kh-graph-half {
    width: 49%;
    height: 250px;
}

.kh-tbl-half {
    width: 49%;
    height: 400px;
}

.kh-card-mark {
    width: 8px;
    height: 8px;
    margin-top: 6px;
    margin-right: 5px;
    background-color: #34669d;
}

.kh-mark-title {
    font-size: 14px;
    color: #34669d;
}

.kh-graph-content {
    margin-top: 5px;
    border: solid 1px gray;
    width: 100%;
    height: 100%;
}

.kh-graph-info {
    margin-top: 5px;
    width: 100%;
    height: 100%;
    border: none;
    text-align: left;
    font-size: 12px;
}

.kh-graph-left {
    border-right: solid 1px gray;
    background-color: #f0f3f5;
    width: 15%;
    height: 100%;
    font-size: 13px;
    display: grid;
    align-items: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

.kh-graph-right {
    width: 85%;
    height: 100%;
}

.kh-graph-arrow {
    color: #34669d;
    font-size: 32px;
}

.kh-right-top {
    height: 50%;
    display: inline-flex;
    padding-top: 20px;
}

.kh-right-bottom {
    height: 50%;
    display: inline-flex;
    padding-bottom: 20px;
}

.kh-graph-split {
    border-top: solid 1px grey;
    margin-top: -10px;
}

.kh-chart-item {
    width: 40px;
    height: 100%;
}

.kh-double-chart {
    width: 40px;
    height: 100%;
    padding-left: 5px;
    padding-right: 5px;
    margin:auto;
}

.kh-double-content {
    display: inherit;
    width: 100%;
    height: 100%;
}

.kh-chart-color {
    background-color: #34669d;
    width: 20px;
}

.kh-mine-chart {
    background-color: #ec2552;
    width: 10px;
    margin-bottom: 4px !important;
}

.kh-avg-chart {
    background-color: #34669d;
    width: 10px;
    margin-bottom: 4px;
}

.kh-chart-lbl {
    font-size: 10px;
    margin-top: 3px;
}

.kh-graph-top {
    height: 85%;
    width: 100%;
}

.kh-graph-bottom {
    height: 15%;
    width: 100%;
    border-top: solid 1px grey;
    background-color: #f0f3f5;
    font-size: 12px;
    display: flex;
}

.kh-graph-subject {
    width: 15%;
    display: grid;
    align-items: center;
}

.kh-subject-content {
    width: 85%;
    display: inline-flex;
    align-items: center;
}

.kh-top-score {
    height: 20%;
    padding-top: 10px;
    padding-left: 20px;
    text-align: left;
    font-size: 12px;
}

.kh-top-content {
    height: 80%;
    display: flex;
}

.kh-subject-item {
    width: 20%;
    height: 100%;
}

.kh-subject-title {
    width: 20%;
}

.kh-subject-split {
    border: solid 1px grey;
    width: 40.5%;
    position: absolute;
    z-index: -1;
}

.kh-subject-chart {
    width: 100%;
    height: 100%;
    display: flex;
}

.kh-score-chart {
    height: 10px;
    width: 10px;
    border-radius: 15px;
    background-color: #ec2552;
}

.kh-subject-x {
    position: absolute;
    margin-top: 210px;
    border-top: solid 1px gray;
    width: 47.5%;
}

.kh-subject-y {
    position: absolute;
    border-right: solid 1px gray;
    left: 60px;
    height: 35.5%;
}

.kh-subject-score20 {
    position: absolute;
    left: 40px;
    margin-top: 170px;
    font-size: 12px;
}

.kh-subject-score40 {
    position: absolute;
    left: 40px;
    margin-top: 135px;
    font-size: 12px;
}

.kh-subject-score60 {
    position: absolute;
    left: 40px;
    margin-top: 100px;
    font-size: 12px;
}

.kh-subject-score80 {
    position: absolute;
    left: 40px;
    margin-top: 65px;
    font-size: 12px;
}

.kh-subject-score100 {
    position: absolute;
    left: 35px;
    margin-top: 30px;
    font-size: 12px;
}

.kh-subject-mark {
    position: absolute;
    left: 250px;
    margin-top: 15px;
    font-size: 12px;
    display: flex;
}

.kh-subject-mine {
    width: 10px;
    height: 10px;
    background-color: #ec2552;
    margin-right: 5px;
}

.kh-subject-avg {
    width: 10px;
    height: 10px;
    background-color: #34669d;
    margin-right: 5px;
}

.kh-subject-lbl {
    margin-top: -3px;
    margin-right: 10px;
}

.kh-subject-graph {
    padding: 38px 20px 38px 70px;
    width: 100%;
    height: 100%;
    display: flex;
}

.kh-td-chart {
    margin-top: 5px;
    margin-bottom: 4px;
    background-color: #34669d;
    height: 10px;
    float: left;
}

.kh-notice-top {
    background-color: white;
    width: 30px;
    height: 6px;
    margin-bottom: 0px;
}

.kh-time-item {
    position:absolute;
    width: 39px;
    background-color: #f1f2f2;
    font-size: 12px;
    border-top: solid 1px lightgray;
    border-bottom: solid 1px lightgray;
    display: grid;
    cursor: pointer;
}

.kh-forward-content {
    width: 380px;
    height: 80px;
    margin: auto;
    display: flex;
}

.kh-forward-area {
    margin: auto;
    width: 240px;
    height: 100%;
    min-height: 100%;
    min-width: 240px;
    max-height: 100%;
    max-width: 240px;
}

.kh-popup-header {
    margin-top: 30px;
    text-align: center;
    font-size: 16px;
}

.kh-popup-content {
    margin: 20px 10px 0px 10px;
    overflow-y: auto;
    height: 260px;
    font-size: 14px;
    text-align: left;
}

.kh-popup-content img {
    width: 100% !important;
}

.kh-popup-footer {
    margin: 20px 20px 0px 20px;
}

button.kh-button {
    border-radius: 0px;
    background-color: white !important;
    border: solid 1px #7f7f7f;
    height: 20px;
}

.kh-area-board {
    width: 100%;
    border: none;
    text-align: center;
    height: 85px;
    overflow-y: hidden;
    resize: none;
    background-color: white;
}

.padding-left-200 {
    padding-left: 200px !important;
}

.padding-left-150 {
    padding-left: 150px !important;
}

table.dataTable td.color_blue {
    color: #2652e0 !important;
}

.purple_seance {
    color: #ff00cc;
}

table.dataTable td {
    vertical-align: middle !important;
}

table.dataTable td.purple_seance {
    color: #ff00cc !important;
}

table.dataTable td.color_red {
    color: red !important;
}

.color_red {
    color: red;
}

.color_blue {
    color: #2652e0 !important;
}

.color_gray {
    color: #666666 !important;
}

.color_black {
    color: #000000 !important;
}

.font_bold {
    font-weight: bold !important;
}

.font_normal {
    font-weight: normal !important;
}

.ic_sns_n {
    position: absolute;
    width: 40px;
    height: 40px;
    margin-left: 10px;
    margin-top: 10px;
}

.login_input {
    border: 1px solid #c5c5c6 !important;
    height: 60px;
    width: 100%;
    font-size: 16px;
    padding: 0 24px !important;
}

.apply_content {
    border: 1px solid #c5c5c6 !important;
    width: 100%;
    height: 140px;
    font-size: 16px;
    padding: 24px !important;
}

.login_small_input {
    border: 1px solid #c5c5c6 !important;
    height: 40px;
    width: 100%;
    font-size: 16px;
    padding: 0 24px !important;
}

.logo_img {
    width: 181px;
}

.btn_login {
    color: white;
    background: #2d4285;
    width: 100%;
    height: 60px;
    font-size: 20px !important;
    border-radius: 0 !important;
    font-weight: bold !important;
}

.btn_site:hover {
    background: black;
}

.btn_site {
    color: white !important;
}

.btn_sign {
    border-radius: 0 !important;
    background: #2d4285;
    color: white;
    width: 160px;
    height: 60px;
}

textarea::placeholder, input::placeholder {
    color: #666666;
}

.btn_sns {
    color: white;
    width: 100%;
    height: 60px;
    font-size: 20px !important;
    border-radius: 0 !important;
    margin-bottom: 20px;
    font-weight: bold;
}

.col-md-12 {
    padding: 0 !important;
}

.btn {
    text-transform: none !important;
}

.btn_auth {
    font-size: 16px !important;
    border-radius: 0 !important;
    color: #666666;
    width: 120px;
    height: 40px;
    background: white;
    border: 1px solid #c5c5c6 !important;
}

.nav-pills {
    display: flex;
}

.nav-pills li {
    margin: 0;
    padding: 0;
}

.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {
    color: #000000;
    font-weight: bold;
    background-color: white;
    border-bottom: 3px solid #2d4285;
}

.nav-pills-sub {
    border-bottom: 3px solid #666666;
}

.nav-pills-sub>li.active>a, .nav-pills-sub>li.active>a:focus, .nav-pills-sub>li.active>a:hover {
    color: #2d4285;
}

.nav-pills-sub>li>a {
    border-bottom: 3px solid #ffffff;
    font-weight: bold;
}

.nav-pills-sub>li+li {
    margin-left: 0px !important;
}

.font-8 {
    font-size: 8px !important;
}

.font-10 {
    font-size: 10px !important;
}

.font-12 {
    font-size: 12px !important;
}

.font-13 {
    font-size: 13px !important;
}

.font-14 {
    font-size: 14px !important;
}

.font-15 {
    font-size: 15px !important;
}

.font-16 {
    font-size: 16px !important;
}

.font-20 {
    font-size: 20px !important;
}

.font-22 {
    font-size: 22px !important;
}

.font-24 {
    font-size: 24px !important;
}

.font-26 {
    font-size: 26px !important;
}

.font-28 {
    font-size: 28px !important;
}

.font-30 {
    font-size: 30px !important;
}

.font-36 {
    font-size: 36px !important;
}

.font-40 {
    font-size: 40px !important;
}

.font-50 {
    font-size: 50px !important;
}

.font-80 {
    font-size: 80px !important;
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-lg {
    color: white;
    background: #2d4285;
    border-radius: 0;
    text-transform: none;
}

.sweet-alert p {
    font-size: 16px;
    color: #666666;
    margin-bottom: 40px;
    margin-top: 20px;
}

.sweet-alert {
    width: 620px !important;
    border-radius: 0 !important;
    margin-left: -307px !important;
    padding: 45px !important;
}

.term_content {
    width: 100%;
    height: 600px;
    padding: 25px;
    margin-top: 20px;
    word-break: break-all;
    overflow-y: scroll;
    border: 1px solid #c3c3c5;
    text-align: left;
}

a.logout, a.logout:hover, a.logout:active, a.logout:focus {
    color: #333;
    text-decoration: none;
}

.main_logo {
    cursor: pointer;
    width: 144px;
    height: 42px;
    object-fit: cover;
}

.main_logo1 {
    cursor: pointer;
    width: 134px;
    height: 18px;
    object-fit: cover;
}

.owl-nav > div.owl-prev {
    display: inherit !important;
    background: url("../img/btn_arrow_reft.png") no-repeat center center !important;
    background-size: 26px 46px !important;
    position: absolute !important;
    margin-top: -261px !important;
    margin-left: -40vw !important;
    color: transparent !important;
}

.owl-nav > div.owl-next {
    display: inherit !important;
    background: url("../img/btn_arrow_right.png") no-repeat center center !important;
    background-size: 26px 46px !important;
    position: absolute !important;
    margin-top: -261px !important;
    margin-left: 40vw !important;
    color: transparent !important;
}

.sub_title {
    font-size: 16px;
    color: #666666;
    padding: 10px 20px;
    cursor: pointer;
}

.sub_title.sub_title_sel {
    color: #003dff;
}

.sub_title_div {
    border-bottom: 1px solid #c2c2c2;
    padding-left:37%;
    text-align: left!important;
}

.sub_title_lesson_div {
    border-bottom: 1px solid #c2c2c2;
    padding-left:29%;
    text-align: left!important;
}

.dropdown-toggle {
    cursor: pointer;
}

.drop_my_info {
    top: 34px;
    margin: 0;
    padding: 0;
}

.drop_my_info li {
    padding: 0px 20px;
}

.drop_my_info li>a {
    border-bottom: 1px solid rgba(0,0,0,.15);
    font-size: 15px;
    color: #666666;
    padding: 8px 0px;
}

.drop_my_info li:last-child>a {
    border-bottom: none !important;
}

.drop_my_info li>a:hover {
    color: #2d4285;
    background: transparent;
}

.table.table-point td {
    font-size: 15px !important;
    font-weight: bold !important;
    padding-top: 13px !important;
    padding-bottom: 13px !important;
    border-bottom: solid 1px #c2c2c2 !important;
}

table.table-point>thead>tr>th {
    border-top: solid 1px #c2c2c2 !important;
    border-bottom: solid 1px #c2c2c2 !important;
}

.table.table-point>thead>tr>th {
    font-size: 15px !important;
    font-weight: bold !important;
    padding-top: 13px !important;
    padding-bottom: 13px !important;
    color: dimgray !important;
}

.table.table-point {
    border-bottom: solid 1px #c2c2c2 !important;
    border-top: solid 1px #c2c2c2 !important;
    margin-top: 20px;
}

table.table-point tr:last-child {
    border-bottom: solid 1px #c2c2c2;
}

.kh-add-zoom {
    width: 300px;
    min-height: 180px;
    max-height: 250px;
    height: auto;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 20px;;
}
.tj-select-video
{
    border-radius: 0px;
    height: 35px;
    font-size: 14px;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 127px;
}

.tj-input-video {
    border-radius: 0px;
    height: 35px;
    font-size: 14px;
    width: 266px;

}
.tj-btn-search {
    width: 100px;
    height: 35px;
    border-radius: 0 !important;
    margin-left: -3px;
    background-color: #2b2d40;
    font-size: 14px !important;
    padding: 0px;
    color: white;
}

.tj-btn-mem-down {
    width: 160px;
    height: 35px;
    font-size: 14px !important;
    border-radius: 0 !important;
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.tj-btn-new-reg {
    height: 40px;
    width: 140px;
    border-radius: 0 !important;
    background-color: #d3000b !important;
    font-size: 14px !important;
    padding: 0px;
    color: white;
}

.tj-btn-new-reg:hover, .tj-btn-new-reg:active, .tj-btn-new-reg:focus {
    color: white;
}

.tj-btn-search:hover {
    color: white;
}

.tj-btn-search:focus {
    color: white;
}

.tj-video-content {
    margin-top: 45px;
    margin-left: -7px;
    margin-right: -7px;
}

.tj-video-pagination {
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    font-size: 12px;
    align-items: center;
}

.tj-video-item {
    width: 242px;
    height: 231px;
    border: solid 1px #6d6e71;
    margin: 5px;
}

.tj-video-top {
    background-color: #666666;
    height: 59%;
}

.tj-video-bottom {
    padding: 0px 10px 5px 10px;
    height: 41%;
}

.matter_item td, .matter_item td select, .matter_item td input {
    margin: auto;
    text-align: center;
}

.mt-radio > input:checked ~ span:after, .mt-checkbox > input:checked ~ span:after {
    display: block;
}
.mt-radio > span:after {
    left: 5px;
    top: 5px;
    height: 6px;
    width: 6px;
    border-radius: 100% !important;
    background: #888888;
}
.mt-radio > span:after, .mt-checkbox > span:after {
    content: '';
    position: absolute;
    display: none;
}

.mt-radio > span {
    -webkit-border-radius: 50%!important;
    -moz-border-radius: 50%!important;
    -ms-border-radius: 50%!important;
    -o-border-radius: 50%!important;
    border-radius: 50%!important;
}
.mt-radio > span, .mt-checkbox > span {
    border: 1px solid transparent;
    position: absolute;
    top: 1px;
    left: 0;
    height: 18px;
    width: 18px;
    background: #E6E6E6;
}

.mt-checkbox-inline, .mt-radio-inline {
    padding: 10px 0;
}

.mt-checkbox-inline .mt-checkbox, .mt-checkbox-inline .mt-radio, .mt-radio-inline .mt-checkbox, .mt-radio-inline .mt-radio {
    display: inline-block;
    margin-right: 15px;
    float: right;
}

.mt-radio, .mt-checkbox {
    display: inline-block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 15px;
    cursor: pointer;
    font-size: 14px;
    webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.mt-radio > input, .mt-checkbox > input {
    position: absolute;
    z-index: -1;
    opacity: 0;
    filter: alpha(opacity=0);
}

.portlet.light > .portlet-title > .caption {
    color: #666;
    padding: 10px 0;
}
.portlet > .portlet-title > .caption {
    float: left;
    display: inline-block;
    font-size: 18px;
    line-height: 18px;
    padding: 10px 0;
}

.portlet.light > .portlet-title > .caption > i {
    color: #777;
    font-size: 15px;
    font-weight: 300;
    margin-top: 3px;
}
.portlet > .portlet-title > .caption > i {
    float: left;
    margin-top: 4px;
    display: inline-block;
    font-size: 13px;
    margin-right: 5px;
    color: #666;
}
.font-dark {
    color: #2f353b !important;
}

.portlet.light.portlet-fit {
    padding: 0;
}

.portlet.light.bordered {
    border: 1px solid #e7ecf1 !important;
    padding: 20px 80px;
}

.btn-dash-right-danger {
    width: 120px;
    color: #d6111b !important;
    border: 1px solid #d6111b !important;
    border-radius: 0 !important;
}

.btn.red-mint:not(.btn-outline) {
    color: #ffffff;
    background-color: #e43a45;
    border-color: #e43a45;
    border-radius: 0 !important;
}

table.table_teacher>thead>tr>th {
    border-top: none !important;
    border-bottom: none !important;
    padding: 17px 0;
    text-align: center;
    vertical-align: middle;
}

.table.table_teacher>tbody>tr>td {
    padding: 18px 0 !important;
    font-size: 13px !important;
    border-top: none !important;
    vertical-align: middle;
}

table.table_teacher tr:last-child {
    border-bottom: none !important;
}


.tj-btn-primary {
    width: 60px;
    height: 23px;
    border-radius: 0 !important;
    border-color: black;
    margin-right: auto;
    margin-left: auto;
    background-color: white;
    font-size: 12px !important;
    padding: 0px;
    color: black;
}

.tj-btn-primary:hover {
    color: black;
}

.tj-btn-primary:focus {
    color: black;
}


.tj-custom-pagination {
    width: 20px !important;
    height: 20px !important;
    margin-top: 48px !important;
    margin-left: 5px !important;
    margin-right: 5px !important;
    padding: 0px !important;
}

.tj-custom-page-active {
    background-color: white !important;
    border-color: white !important;
    color: red !important;
    margin-top: 42px;
    width: 20px;
    height: 20px;
    margin-right: 3px;
}

.tj-custom-page-normal {
    background-color: white !important;
    border-color: white !important;
    color: darkslategray !important;
    margin-top: 42px;
    width: 20px;
    height: 20px;
    margin-right: 3px;
}
.tj-detail-line{
    display: flex;
    font-size: 14px;
    margin-top: 17px
}

.tj-detail-line-left {
    font-size: 14px;
    width: 13.5%;
    text-align: left;
    color: black
}

.tj-detail-line-right {
    font-size: 14px;
    width: 86.5%;
    text-align: left;
    padding: 0 8px;
    color: black;
    border-radius: 0 !important;
}

.tj-btn-caption {
    border:1px solid #7f808b !important;
}

.tj-detail-select {
    font-size: 14px;
    width: 220px;
    height: 35px;
    text-align: left;
    padding: 0 8px;
    color: black;
    border-radius: 0 !important;
    border:1px solid #7f808b !important;
}

.tj-detail-btn-withdrwal {
    border-radius: 0 !important;
    border:1px solid #d3000b !important;
    width: 120px;
    height:35px;
    background-color: white;
    color: #d3000b;
    margin-left:200px;
}
.tj-detail-btn-change {
    border-radius: 0 !important;
    width: 120px;
    height:35px;
    background-color: #d3000b;
    color: white;
    margin-left:10px;
}

.tj-detail-btn-change:hover, .tj-detail-btn-change:active, .tj-detail-btn-change:focus {
    color: white;
}

.tj-detail-btn-withdrwal:hover, .tj-detail-btn-withdrwal:active, .tj-detail-btn-withdrwal:focus {
    color: #d3000b;
}

.tj-detail-btn-golist {
    border-radius: 0 !important;
    width: 160px;
    height:35px;
    border:1px solid black !important;
    background-color: white;
}

.modal-input-mark {
    width: 720px;
    min-height: 300px;
    max-height: 600px;
    height: auto;
    overflow-y: auto;
    background-color: white;
    margin: auto;
    text-align: center;
    padding-bottom: 30px;
}

.mark-modal-caption {
    border:1px solid #a3a3a3;
    height:20px;
    width: 600px;
    margin-top: 10px!important
}

.mark-modal-calc {
    border:1px solid #a3a3a3;
    height:40px;
    width: 600px;
    margin-top: 10px!important;
}

.mark-modal-question {
    border:1px solid #a3a3a3;
    height:auto;
    width: 600px;
    margin-top: 10px!important;
    display: flex;
}

.mark-modal-question-title {
    border-right:1px solid #a3a3a3;
    height:auto;
    width: 160px;
}

.mark-modal-question-check {
    height:auto;
    width: 440px;
}

.mark-modal-question-check-index {
    height:20px;
    width: 35px;
    background-color: #2d4285;
    border-right:1px solid #a3a3a3;
}
.mark-modal-question-check-answer {
    height:31px;
    width: 35px;
    border-right:1px solid #a3a3a3;
}

.table_teacher tbody>tr>td .kh-input, .table_teacher tbody>tr>td select {
    margin: auto;
    text-align: center;
}

.kh-mark-table-input {
    border-radius: 0px;
    height: 20px;
    font-size: 12px;
    width: 60px;
    text-align: center;
    padding: 6px 2px;
}

#tbl_smester_wrapper .dataTables_paginate {
    display: none;
}

#detail_table_wrapper .dataTables_paginate {
    display: none;
}

.modal-mark-detail {
    width: 500px;
    overflow-y: auto;
    background-color: white;
    text-align: center;
    padding-bottom: 30px;
    height: auto;
    margin: auto;
}

#table_mark_simple_wrapper .dataTables_paginate {
    display: none !important;
}

.modal-mark-detail-caption {
    height:40px;
    width: 500px;
    margin-top: 10px!important
}

.modal-mark-detail-caption-title {
    font-size: 16pt!important;
    border-bottom: 1px solid #f2f5fc;
    width: calc(100% - 60px);
    padding-bottom: 10px;
}

.modal-mark-detail-name {
    height:30px;
    width: 500px;
    margin-top: 20px!important;
    display: flex;
}

.modal-mark-detail-chart {
    margin-top: 20px!important
}

.cart_check_i, .kh-checkbox2 {
    margin-right: 0 !important;
}

.cancel.btn, .confirm.btn{
    width: 100px !important;
    border-color: #2d4285;
}

.ipt_range, .ipt_ability {
    text-align: left !important;
}

.kh-popup-layout {
    width: 600px;
    height: 420px;
    background-color: white;
    margin-top: 200px;
    text-align: center;
}

.kh-popup-close {
    width: 120px;
    height: 40px;
    border-radius: 0 !important;
    margin-right: auto;
    margin-left: 10px;
    margin-top: 2px;
    background-color: #2d4285;
}

.kh-popup-header {
    margin-top: 30px;
    text-align: center;
    font-size: 16px;
    padding-top: 16px;
}

.kh-popup-content {
    margin: 20px;
    overflow-y: auto;
    height: 260px;
    font-size: 14px;
    text-align: left;
}

.kh-popup-footer {
    margin: 20px 20px 0px 20px;
}

.bootstrap-timepicker-widget {
    z-index: 100000 !important;
}

/* 출결관리 키패드 CSS 시작 */
.pwWrap {
    width: 100vw;
    height: 100vh;
    /* max-width: 450px; */
    background: white;
    margin: auto;
  }

  .pwWrap .logoSection {
      height: 15vh;
  }

  .pwWrap .logoSection .pageNameSection{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    float: left;

    width: 100vw;

    margin-top: 2vh;
    font-size: 4vh;
    color: black;
  }

  .pwWrap .logoSection .imgSection{
    position: relative;
    text-align: center;

    height: 70%;
    width: auto;
  }

  .pwWrap .logoSection .timeSection{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    float: left;

    width: 100vw;
    height: 3vh;

    font-size: 2vh;
  }
  
  .pwWrap .attendanceSection {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 15vh;
  }

  .pwWrap .attendanceSection .attendanceNumber {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;

    margin-top: 3vh;
    height: 15vh;
    width: 95%;
    font-size: 3vw;
    border-radius: 3vw;
    background: lightgray;
    color: black;
  }
  
  .pwWrap .attendanceSection .dot {
    display: block;
    width: 10px;
    height: 10px;
    background: darkgrey;
    border-radius: 100%;
    margin: 0 5px;
  }
  
  .pwWrap .attendanceSection .dot.active {
    background: rgba(0, 0, 0, 0.7);
  }
  
  .pwWrap .attendanceSection .message {
    position: absolute;
    bottom: 5px;
    left: 0;
    z-index: 1;
    min-width: 100%;
    text-align: center;
    font-size: 20rem;
    font-weight: bold;
    letter-spacing: -0.03em;
    opacity: 0;
    transition: .2s ease-out;
  }
  
  .pwWrap .numberSection {
    margin-top: 5vh;
    padding-left: 5%;
    padding-right: 5%;
    text-align: center;
    overflow: hidden;
    height: 60vh;
    width: auto;
    font-size: 4vh;
  }
  
  .pwWrap .numberSection .number {
    float: left;
    width: 33.33%;
    height: 20%;
    border: 1px solid #ffffff;
    padding: 12px 0;
    cursor: pointer;
    background: lightgray;
    color: black;
  }
  .pwWrap .numberSection .number2 {
    float: left;
    width: 33.33%;
    height: 20%;
    border: 1px solid #ffffff;
    padding: 12px 0;
    cursor: pointer;
    background: lightgray;
    color : black;
  }
  .pwWrap .numberSection .number3{
    float: left;
    width: 50%;
    height: 20%;
    border: 1px solid #ffffff;
    padding: 12px 0;
    cursor: pointer;
    background: #32a852;
    color : white;
  }
  
  .pwWrap .numberSection .number4{
    float: left;
    width: 50%;
    height: 20%;
    border: 1px solid #ffffff;
    padding: 12px 0;
    cursor: pointer;
    background: #d1a930;
    color : white;
  }
  
  .pwWrap.error .message {
    opacity: 1;
    color: red;
  }
  
  .pwWrap.confirm .message {
    opacity: 1;
    color: green;
  }

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px
}

.col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%
}

.col-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none
}

.col-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%
}

.col-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%
}

.col-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%
}

.col-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%
}

.col-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    max-width: 41.66667%
}

.col-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%
}

.col-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    max-width: 58.33333%
}

.col-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    max-width: 66.66667%
}

.col-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%
}

.col-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    max-width: 83.33333%
}

.col-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    max-width: 91.66667%
}

.col-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%
}

.ico-close {
    background: url("../img/ic_close.png") center center no-repeat;
    width: 13px;
    height: 12px;
    display: block;
}

/* 출결관리 키패드 CSS 끝 */


.bottom-statistics {
    display: flex;
    margin-bottom: 10px;
}

.date-period {width: 15px;display: block;float: left;margin-left: 15px;line-height: 34px}

.table-inner-img {
    width: 200px;
}