﻿/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

@charset "UTF-8";
@import url("ka.font.css");


/*------------------------------------------------------------------
[02. Layout]
------------------------------------------------------------------*/
html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #f6f9fc;
    -moz-osx-font-smoothing: grayscale;
}

.container {
    padding-left: 20px;
    padding-right: 20px;
}

.header {
    position: fixed;
    top: 0;
    width: 100%;
    height: 80px !important;
    z-index: 800;
    background-color: rgba(255, 255, 255, 0.97);
    -webkit-transition: top 0.4s ease-in-out;
    -o-transition: top 0.4s ease-in-out;
    transition: top 0.4s ease-in-out;
}

.header:hover {
    background-color: #ffffff;
}

.header .header-inner {
    width: 100%;
}

.header > .pull-right,
.header .pull-left {
    position: relative;
}

.nav-menu-toggler {
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    opacity: 1;
    width: 24px;
    height: 21px;
    margin-top: 34px;
    display: inline-block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    cursor: pointer;
    background: url(../img/icons/icon_header_menu.png)no-repeat center;
    background-size: 24px;
    margin-left: 13px;
}

[data-ka="header-toggle"] {
    z-index: 99;
}

.nav-menu-content[data-ka-direction="slide-right"],
.nav-menu-content[data-ka-direction="push-right"] {
    right: 0;
}

.nav-menu-content[data-ka-direction="full-screen-overlay"] {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
}

.header-logo {
    display: block;
    position: relative;
    width: 135px;
    height: 30px;
    margin: 26px 40px 0 0;
    z-index: 9;
    background: url("../img/logo_c_2x.png") no-repeat;
    background-size: 135px 30px;
}

.header-logo a {
    display: block;
    width: 100%;
    height: 100%;
}

.header-down {
    left: 0;
    right: 0;
    top: 0;
    z-index: 998;
    width: 100%;
    background-color: #fff;
}

.header-up button,
.header-down button,
.header-util button {
    border: 0;
    background: none;
    -webkit-appearance: none;
}

.header-up button:hover,
.header-down button:hover,
.header-util button:hover {
    cursor: pointer;
}

.header-up {
    top: -80px;
}

.header-wrap {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
}

.header-wrap:after {
    content: '';
    display: block;
    clear: both;
}

.nav-container {
    display: inline-block;
}

.nav-menu {
    font-size: 0;
    text-align: center;
}

.nav-menu .nav-menu-list {
    display: inline-block;
}

.nav-menu .nav-menu-list .nav-menu-item:before {
    content: '';
    position: absolute;
    left: -1px;
    bottom: 26px;
    width: calc(100% + 2px);
    height: 2px;
    background-color: #333;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1),
    -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.nav-menu .nav-menu-list:hover .nav-menu-item:before,
.nav-menu .nav-menu-list .nav-menu-item:focus:before {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
}

.nav-menu .nav-menu-list.on .nav-menu-item:before {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
}

.nav-menu .nav-menu-item {
    display: block;
    position: relative;
    margin: 0 24px;
    padding: 29px 0 37px;
    font-family: "Nanum Square", sans-serif;
    font-weight: 800;
    font-size: 18px;
    color: #333;
    /*
  text-transform: uppercase;
*/
}

/* 6월2일수정 */
.nav-menu .nav-dropmenu-wrap {
    /* display: none; */
    position: absolute;
    left: 0;
    right: 0;
    top: 80px;
    z-index: 999;
    height: 0px;
    background-color: #fff;
    font-size: 0;
    text-align: center;
    border-top: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
}

.nav-menu .nav-dropmenu-wrap.active {
    height: auto;
}


.nav-menu .nav-dropmenu-wrap > li {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 190px;
    height: 200px;
    padding: 28px 0 0;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.nav-menu .nav-dropmenu-wrap > li.wide {
    width: 380px;
}

.nav-menu .nav-dropmenu-wrap > li.wide li {
    width: 90%;
    height: 100%;
    margin: auto;
    padding: 10px 20px;
    border: 3px solid #F47104;
    font-family: "Nanum Square", sans-serif;
    font-weight: 800;
    font-size: 16px;
    color: #fff;
}

.nav-menu .nav-dropmenu-wrap > li.wide li h4 {
    font-family: "Nanum Square", sans-serif;
    font-weight: 800;
    letter-spacing: -0.06em;
    color: #F47104;
    line-height: 1;
}

.nav-menu .nav-dropmenu-wrap > li.wide li h5 {
    font-family: "Nanum Square", sans-serif;
    font-weight: 700;
    letter-spacing: -0.06em;
    color: #F47104;
    line-height: 1;
}

.nav-menu .nav-dropmenu-wrap > li.wide li p {
    font-family: "Nanum Square", sans-serif;
    font-weight: 400;
    color: #333;
    line-height: 1;
}

.nav-menu .nav-dropmenu-wrap > li.wide li:hover {
    cursor: pointer;
}

.nav-menu .nav-dropmenu-wrap > li:before,
.nav-menu .nav-dropmenu-wrap > li:last-child:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: 100%;
    background-color: #efefef;
}

.nav-menu .nav-dropmenu-wrap > li:last-child:after {
    left: auto;
    right: 0;
}

.nav-menu .nav-dropmenu-wrap > li:hover {
    /*background-color: #efefef;*/
    background-color: #f6f9fc;
}

.nav-menu .nav-dropmenu-wrap > li.wide:hover {
    background-color: transparent;
}

.nav-menu .nav-dropmenu-wrap > li:hover:before,
.nav-menu .nav-dropmenu-wrap > li:hover + li:before,
.nav-menu .nav-dropmenu-wrap > li:last-child:hover:after {
    display: none;
}

.nav-menu .nav-dropmenu {
    list-style: none;
    padding-left: 5px;
}

/*3월8일수정*/

.nav-menu .nav-dropmenu > li {
    /* margin: 0 0 5px; */
    font-size: 15px;
    text-align: left;
}

.nav-menu .nav-dropmenu > li.depth-blank {
    margin-bottom: 14px;
}

.nav-menu .nav-dropmenu > li:last-child {
    margin-bottom: 0;
}

.nav-menu .nav-dropmenu .classify {
    margin-bottom: 22px;
    padding-top: 22px;
    border-top: 1px solid #efefef;
}

.nav-menu .nav-dropmenu .classify:first-child {
    padding-top: 0;
    border-top: 0;
}

.nav-menu .nav-dropmenu .nav-dropmenu-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 0 0 28px;
    height: 48px;
    color: #333;
    line-height: 1.2;
}

#onico {
    margin-left: 5px;
}

.nav-menu .nav-dropmenu .nav-dropmenu-item.btn-link:hover {
    text-decoration: none;
}

.nav-menu .nav-dropmenu .nav-dropmenu-item.btn-link:after {
    right: 74px;
    top: 17px;
    background-position: -81px 0;
}

.nav-menu .nav-dropmenu .nav-dropmenu-item .depth {
    position: relative;
    display: inline-block;
    font-family: "Nanum Square", sans-serif;
    font-weight: 700;
    font-size: 14px;
    opacity: .8;
    filter: alpha(opacity=80);
}

.nav-menu .nav-dropmenu .nav-dropmenu-item span:not(.no-link):before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 1px;
    background-color: #333;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1),
    -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.nav-menu .nav-dropmenu .nav-dropmenu-item span.no-link {
    cursor: default;
}

.nav-menu .nav-dropmenu .nav-dropmenu-item:hover span:before,
.nav-menu .nav-dropmenu .nav-dropmenu-item:focus span:before {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
}

.nav-menu .nav-dropmenu .nav-dropmenu-item strong span {
    position: relative;
    font-family: "Nanum Square", sans-serif;
    font-weight: 800;
    -webkit-transform: skew(-0.1deg);
    -ms-transform: skew(-0.1deg);
    transform: skew(-0.1deg);
}

.nav-menu .nav-dropmenu .nav-dropmenu-item:hover .depth,
.nav-menu .nav-dropmenu .nav-dropmenu-item:focus .depth {
    font-family: "Nanum Square", sans-serif;
    opacity: 1;
    filter: alpha(opacity=100);
}

.header-util-container {
    float: right;
    width: 210px;
    margin: 31px 0 0 0;
    font-size: 0;
}

.header-util-container:after {
    content: '';
    display: block;
    clear: both;
}

.header-util-container .header-util {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    font-family: "Nanum Square", sans-serif;
    font-weight: 800;
    font-size: 12px;
}

.header-util-container .header-util a {
    /* font-family: 'Montserrat', sans-serif; */
    font-weight: 500;
    position: relative;
    display: inline-block;
    margin: 0 10px 0 0;
    color: #666666;
    opacity: 0.7;
    /* filter: alpha(opacity=70); */
}

/* .header-util-container .header-util a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
} */
.header-util-container .header-util a:first-child:after {
    content: '';
    display: block;
    position: absolute;
    right: -10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px;
    height: 9px;
    /*background-color: rgba(51, 51, 51, 0.4);*/
    background-color: rgba(82, 95, 127, 0.4);
}

.header-util-container .header-util .profile-wrapper {
    z-index: 100;
}

.header-util-container .header-util .profile-dropdown-toggle {
    background: transparent;
    border: none;
}

.header-util-container .header-util .profile-dropdown {
    background: #fff;
}

.header-util-container .header-util .profile-dropdown:before {
    position: absolute;
    top: -7px;
    left: 15px;
    display: inline-block;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #ccc;
    border-left: 7px solid transparent;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    content: "";
}

.header-util-container .header-util .profile-dropdown:after {
    content: "";
    position: absolute;
    top: -6px;
    left: 16px;
    display: inline-block;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    border-left: 6px solid transparent;
}

.header-util-container .header-util .profile-dropdown > a {
    min-width: 140px;
    height: 30px;
    padding-left: 17px;
    padding-right: 37px;
    font-weight: 700;
    font-size: 12px;
    border-left: 3px solid transparent;
    border-radius: 0;
    -webkit-transition: ease-in-out 0.3s;
    -o-transition: ease-in-out 0.3s;
    transition: ease-in-out 0.3s;
}

.header-util-container .header-util .profile-dropdown > a:hover {
    background: #f6f9fc;
    border-left: 3px solid #F47104;
    border-radius: 0;
}

.header-util-container .header-util .profile-dropdown > a:after {
    content: none;
    display: block;
    position: absolute;
    right: -10px;
    top: 2px;
    width: 0;
    height: 9px;
}

.header-util-container .header-util .profile-dropdown > a > i {
    margin-right: 10px;
}

.header-util-container .btn-search i {
    margin-bottom: 5px;
    font-weight: 500;
    opacity: 0.7;
    filter: alpha(opacity=70);
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.header-util-container .btn-search:hover i {
    opacity: 1;
    filter: alpha(opacity=100);
}

.header.searching {
    height: 80px;
    background-color: rgba(255, 255, 255, 1);
}

.header.searching .search {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 12000;
    min-width: 100%;
    background-color: #fff;
}

.search-container-wrap {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 0px;
    z-index: 12000;
    height: 200px;
    background-color: #ffffff;
    font-size: 0;
    text-align: center;
    border-top: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
}

.search-container {
    width: 100%;
    margin: 0 auto;
    padding: 35px 35px 0px;
    list-style: none;
}

.search-container:after {
    content: '';
    display: block;
    clear: both;
}

.search-container i {
    color: #333;
    font-size: 23px;
    opacity: 0.7;
    filter: alpha(opacity=70);
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.search-container i:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.search-input {
    width: 40%;
    height: 100px;
    font-weight: 700;
    font-size: 77px;
    letter-spacing: -0.06em;
    color: #F47104;
    line-height: 100px;
    padding-left: 0 !important;
}

input.search-input::-webkit-input-placeholder {
    color: #ccc;
}

input.search-input::-webkit-input-placeholder,
input.search-input::placeholder {
    color: #ccc;
}

.search-close {
    position: absolute;
    right: -3px;
    top: 0px;
    color: #333;
    z-index: 999;
}

/* Mobile Nav */
body {
    display: block !important;
}


.mobile,
.nav-menu-list.mobile a,
.nav-submenu-indicator {
    display: none;
}

/*12월18일 추가*/
.header-bg {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 900;
    content: '';
}

.modal-bg {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 900;
    content: '';
}

.search-bg {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 900;
    content: '';
}

body.nav-menu-opened .header-bg {
    display: block;
}

.nav-menu-top2 {
    padding: 12px 22px;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
}


/* Header Responsive Class */

/* Header Responsive Class: Mobile */
@media (max-width: 1199.98px) {

    .mobile,
    .nav-menu-list.mobile a,
    .nav-submenu-indicator {
        display: block;
    }

    .nav-menu-item svg {
        display: inline-block;
        margin-right: 10px;
    }

    .nav-menu-toggler-arrow a i {
        display: block;
        float: right;
        right: 200px;
        color: #333;
        opacity: 0.7;
        filter: alpha(opacity=70);
    }

    .nav-menu-toggler-arrow a:hover i {
        opacity: 1;
        filter: alpha(opacity=100);
    }

    .header-down {
        top: 0;
        width: 100%;
        height: auto;
        padding: 0;
    }

    .header-wrap {
        width: 100%;
        height: auto;
        text-align: left;
        padding-right: 14px!important;
    }

    .nav-container {
        width: 100%;
        position: relative;
    }

    .header-util {
        display: none !important;
    }

    .mobile-toggle-container {
        width: 80px;
        text-align: right;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        height: 80px;
        transform: translateY(5px);
        -webkit-transform: translateY(5px);
        -moz-transform: translateY(5px);
        -o-transform: translateY(5px);
    }

    .nav-menu-toggler{
        margin-top: 0;
        margin-bottom: 8px;
        height: 24px;
    }

    .mobile-toggle-container > div{
        padding-left: 0!important;
        margin-bottom: 0;
    }

    .mobile-toggle-container > .toggle-search {
        position: relative;
    }

    .lang-container {
        width: auto;
        display: inline-block;
        vertical-align: middle;
        margin: 0;
        font-family: "Nanum Square", sans-serif;
        font-weight: 800;
        font-size: 12px;
    }

    .lang-container a {
        position: relative;
        color: #333;
        margin: 0 15px 0 0;
        opacity: .8;
    }

    .lang-container > div > a:last-child {
        margin: 0 0px 0 0;
    }

    .lang-container a:not(:last-child):after {
        content: '';
        display: block;
        position: absolute;
        right: -9px;
        top: 2px;
        width: 1px;
        height: 9px;
        color: #fff;
        opacity: 0.5;
        filter: alpha(opacity=50);
    }

    .lang-container a:hover {
        color: #333;
        opacity: 1;
    }

    .search-container-wrap {
        height: 120px;
    }

    .search-container i {
        font-size: 20px;
    }

    .search-container {
        padding: 15px 15px 0px;
        list-style: none;
        padding-left: 5px;
    }

    .search-input {
        height: 50px;
        font-size: 36px;
        line-height: 50px;
    }

    .header:last-child.header {
        top: -200%;
    }

    .nav-menu-content {
        display: none;
        position: fixed;
        top: 0;
        bottom: 0;
        height: 100%;
        width: 250px;
        background-color: #fff;
        z-index: 1000;
        overflow-y: auto;
    }

    .nav-menu-content .header-inner {
        line-height: 0 !important;
    }

    .nav-menu-content .header-inner {
        line-height: initial;
    }

    .nav-menu-content ul {
        width: 100%;
        padding: 0;
    }

    .nav-menu-content ul li {
        padding: 0;
        margin-right: 0 !important;
    }

    .nav-menu-content ul li a {
        opacity: 1 !important;
        padding: 0;
    }

    .nav-menu-content ul li .depth-blank {
        padding: 0;
        opacity: 1;
        color: #333 !important;
    }

    .nav-menu > li {
        display: block;
    }

    .nav-menu > li > a:before,
    .nav-menu > li > a > span:before {
        display: none;
    }

    .nav-menu > li > ul.nav-dropmenu {
        margin-top: 0;
    }

    .nav-menu > li > a:not(.btn) {
        margin-bottom: 0 !important;
    }

    .nav-header,
    .nav-footer {
        display: block;
        /* float: left; */
        width: 100%;
        height: 50px;
        padding-left: 22px;
        /* margin-bottom: 20px; */
        line-height: 50px;
        font-weight: 800;
        color: #f0f0f0;
        background: #414956;
    }

    .nav-container ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .nav-container ul li {
        width: 100%;
        display: block;
        /* float: left; */
        position: relative;
    }

    .nav-container ul li a {
        text-decoration: none;
        /*
    float: left;
    position: relative;
    width: 100%;
    padding: 14px 22px;
    font-size: 14px;
    color: #f0f0f0;
    background: #414956;
    white-space: nowrap;
    overflow: hidden;
         -o-transition: color .2s linear, background .2s linear;
       -moz-transition: color .2s linear, background .2s linear;
    -webkit-transition: color .2s linear, background .2s linear;
            transition: color .2s linear, background .2s linear;
*/
    }

    .nav-container > ul > li:hover > a,
    .nav-container > ul > li.active > a {
        color: #333;
        background: #fff;
    }

    .nav-container > ul > li > a {
        border-bottom: solid 1px #f0f0f0;
    }

    .nav-container ul li a i {
        width: 34px;
        float: left;
        line-height: 20px;
        text-align: left;
    }

    .nav-container .nav-submenu-indicator {
        display: block;
        position: relative;
        float: right;
        right: 0;
        line-height: 19px;
        font-size: 20px;
        -o-transition: transform .3s linear;
        -moz-transition: transform .3s linear;
        -webkit-transition: transform .3s linear;
        -ms-transition: transform .3s linear;
    }

    .nav-menu .nav-dropmenu-wrap .nav-submenu-indicator {
        line-height: 16px;
    }

    .nav-submenu-indicator-minus > .nav-submenu-indicator {
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .nav-menu .nav-dropmenu-wrap {
        width: 100%;
        /* display: none; */
        position: static;
    }

    .nav-menu .nav-dropmenu-wrap li {
        /* clear: both; */
        width: 100%;
    }

    .nav-menu .nav-dropmenu-wrap li a {
        width: 100%;
        /* float: left; */
        font-size: 14px;
        background: #383838;
        border-top: none;
        position: relative;
        border-left: solid 5px transparent;
        -o-transition: border .2s linear;
        -webkit-transition: border .2s linear;
        transition: border .2s linear;
    }

    .nav-menu .nav-dropmenu-wrap li:hover > a {
        border-left-color: #414956;
    }

    .nav-menu .nav-dropmenu-wrap > li > a {
        padding-left: 30px;
    }

    .nav-container ul li .nav-label,
    .nav-menu .nav-dropmenu-wrap li .nav-label {
        min-width: 20px;
        padding: 1px 2px 1px 1px;
        position: absolute;
        right: 18px;
        top: 14px;
        font-size: 11px;
        font-weight: 800;
        color: #555;
        text-align: center;
        line-height: 18px;
        background: #f0f0f0;
        border-radius: 100%;
    }

    .nav-menu .nav-dropmenu-wrap li .nav-label {
        top: 12px;
    }

    .nav-ink {
        display: block;
        position: absolute;
        background: rgba(255, 255, 255, 0.3);
        border-radius: 100%;
        -webkit-transform: scale(0);
        -ms-transform: scale(0);
        transform: scale(0);
    }

    .nav-animate-ink {
        -webkit-animation: ripple 0.5s linear;
        animation: ripple 0.5s linear;
    }

    @-webkit-keyframes ripple {
        100% {
            opacity: 0;
            -webkit-transform: scale(2.5);
        }
    }
    @keyframes ripple {
        100% {
            opacity: 0;
            -webkit-transform: scale(2.5);
            transform: scale(2.5);
        }
    }

    .nav-container .nav-header,
    .nav-container .nav-footer,
    .nav-container ul li a {
        background: #fff;
        color: #333;
    }

    .nav-container > ul > li:hover > a,
    .nav-container > ul > li.active > a {
        background: #f0f0f0;
    }

    .nav-container > ul > li > a {
        border-bottom-color: #f0f0f0;
    }

    .nav-container ul ul.nav-dropmenu-wrap li:hover > a {
        border-left-color: #f0f0f0;
    }


    .nav-menu {
        text-align: left;
    }

    .nav-menu .nav-menu-list {
        display: block;
    }

    .nav-menu .nav-dropmenu-wrap {
        display: none;
        position: absolute;
        top: 0;
        width: 100%;
        height: auto;
        font-size: 0;
        text-align: left;
        background-color: #383838;
    }

    .nav-menu .nav-dropmenu-wrap > li {
        display: block;
        position: relative;
        vertical-align: middle;
        width: 100%;
        height: auto;
        padding: 0;
        -webkit-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
        background-color: #383838;
    }

    .nav-menu .nav-dropmenu-wrap > li:hover {
        background-color: #383838;
    }

    .nav-menu .nav-dropmenu-wrap > li.wide {
        display: none;
    }

    .nav-menu .nav-dropmenu-wrap > li:before,
    .nav-menu .nav-dropmenu-wrap > li:last-child:after {
        display: none;
    }

    /* .nav-menu .nav-dropmenu-wrap > li:last-child {
    padding-bottom: 20px;
  } */
    .nav-menu .nav-dropmenu {
        padding-left: 0;
    }

    .nav-menu .nav-dropmenu .nav-dropmenu-item {
        width: 100%;
        padding-left: 30px;
        line-height: 2;
        color: #fff;
    }

    /* .nav-menu .nav-dropmenu li:first-child {
    padding-top: 10px !important;
  } */
    .nav-menu .nav-dropmenu > li.depth-blank {
        margin: 0;
        padding: 0;
    }

    .nav-menu .nav-dropmenu .nav-dropmenu-item a {
        padding: 14px 22px;
    }

    .nav-menu .nav-dropmenu .nav-dropmenu-item strong span {
        font-weight: 300 !important;
    }

    .nav-menu .nav-dropmenu .nav-dropmenu-item .depth {
        position: relative;
        display: inline-block;
        opacity: 1;
        filter: alpha(opacity=100);
        color: #fff;
    }

    .nav-menu .nav-dropmenu .nav-dropmenu-item .no-link {
        font-size: 14px;
        font-weight: 700;
        line-height: 3;
        opacity: 0.6;
        filter: alpha(opacity=60);
        color: #fff;
    }

    .nav-menu .nav-dropmenu .nav-dropmenu-item span:not(.no-link):before {
        display: none;
    }

    .nav-menu .nav-dropmenu-wrap {
        position: relative;
        margin-top: 0;
        border: 0;
    }

    .nav-menu > li > ul.nav-dropmenu {
        padding-top: 15px;
        padding-bottom: 15px;
        padding-left: 0;
    }

    .nav-menu > li > ul.nav-dropmenu > span.arrow {
        display: none;
    }

    .nav-menu > li > a:not(.btn) {
        margin-bottom: 10px;
    }

    .nav-container .nav-dropmenu {
        background: #fff;
    }

    .nav-container .nav-menu-item {
        display: block;
        margin: 0;
        width: 100%;
        padding: 14px 22px;
        font-family: 'Montserrat', sans-serif;
        /* font-family: "Nanum Square", sans-serif; */
        font-weight: 700;
        font-size: 14px;
        color: #333;
    }

    [data-ka-direction="slide-left"] {
        display: block;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        -ms-transform: translate(-100%, 0);
        -webkit-transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1);
        -o-transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1);
        transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .nav-menu-opened {
        overflow-y: hidden;
    }

    .nav-menu-opened [data-ka-direction="slide-left"] {
        -webkit-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
        -ms-transform: translate(0%, 0);
    }

    /*4월6일수정*/
    .nav-menu-content > .mobile-logo {
        height: 110px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    [data-ka-direction="slide-right"] {
        display: block;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        -ms-transform: translate(100%, 0);
        -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
        -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
        transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .nav-menu-opened {
        overflow-y: hidden;
    }

    .nav-menu-opened [data-ka-direction="slide-right"] {
        -webkit-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
        -ms-transform: translate(0%, 0);
    }
}

@media (min-width: 992px) {

}

@media (min-width: 768px) {
    .result-empty-wrap > p {
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .nav-menu-content {
        width: 270px;
        overflow-y: auto;
    }

    .logo {
        display: inline-block;
    }

    .header.bg-header {
        height: 70px;
    }

    .header.bg-header .header-inner {

    }

    .header.bg-header .nav-menu-toggler {
        margin-top: 27.5px;
    }

    .header.md-header {
        height: 88px;
    }

    .header.md-header .header-inner {

    }

    .header.md-header .nav-menu-toggler {
        margin-top: 36.5px;
    }

    .header.sm-header {
        height: 44px;
    }

    .header.sm-header .header-inner {

    }

    .header.sm-header .nav-menu-toggler {
        margin-top: 14.5px;
    }


    .swiper-slide.fit h1 {
        font-size: 3vh;
        line-height: 5vh;
    }

    .swiper-slide.fit h2 {
        font-size: 2.5vh;
        line-height: 4vh;
    }

    .swiper-slide.fit h3 {
        font-size: 2vh;
        line-height: 3vh;
    }

    .swiper-slide.fit h4 {
        font-size: 1.5vh;
        line-height: 2vh;
    }

    .swiper-slide.fit h5 {
        font-size: 1vh;
        line-height: 1.5vh;
    }
}

.flex-row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.flex-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

/* Container */
.ka-container {
    width: 100%;
    height: 100%;
    padding-top: 80px;

}

.ka-container .ka-content-wrapper {
    min-height: 100%;
    position: relative;
}

.ka-container .ka-content-wrapper .content {
    z-index: 10;
    /* padding-top: 80px;
    padding-bottom: 69px;
    padding-bottom: 220px; */
    min-height: 100%;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.ka-container .ka-content-wrapper > .content{
   /* min-height: calc(100vh - 373px);*/
}

.ka-container .ka-content-wrapper .content.full-width {
    width: 100%;
}

.ka-container .ka-content-wrapper .content .content-inner {
    display: inline-block;
    vertical-align: top;
    height: 100%;
    padding-left: 0px;
    position: relative;
}

.ka-container .ka-content-wrapper .content:only-child {
    padding-bottom: 0px;
}

.ka-container .ka-content-wrapper .content.overlay-footer {
    padding-bottom: 0px;
}

.ka-container .ka-content-wrapper .bottom-menu ul li a.PrivacyClause {
    color: #c9c8c8 !important;
}

/* Footer */
footer .biz-info > a{
    display: none!important;
}

.ka-container .ka-content-wrapper .footer {
    padding-top: 43px;
    width: auto;
    min-height: 220px;
    background-color: #000000;
    font-family: "Nanum Square";
    font-size: 12px;
    font-weight: 800;
    letter-spacing: -0.06em;
    z-index: 89 !important;
    -webkit-transition: bottom 0.3s ease;
    -o-transition: bottom 0.3s ease;
    transition: bottom 0.3s ease;
    margin-top: 0;
}

.ka-container .ka-content-wrapper .footer.fixed {
    position: fixed;
}

.ka-container .ka-content-wrapper .address {
    color: #868686;
    font-family: Noto Sans KR;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 20px;
}

.ka-container .ka-content-wrapper .footer-announcement {
    color: #868686;
    font-family: Noto Sans KR;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    margin: 12px 0;
}

.ka-container .ka-content-wrapper .address .address-bar {
    display: inline-block;
    content: '';
    width: 1px;
    height: 11px;
    background: #4e4e4e;
    margin: -2px 4px 0;
    vertical-align: middle;
}

.ka-container .ka-content-wrapper .copyright {
    color: #868686;
    font-family: Inter;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
}

.ka-container .ka-content-wrapper .bottom-menu {
    position: relative;
    margin: 0 auto;
    max-width: 1200px;
    margin-bottom: 40px;
    display: flex;
    flex-direction: row;
    margin-bottom: 54px;
}

.ka-container .ka-content-wrapper .bottom-menu > div{
    text-align: left;
}

.ka-container .ka-content-wrapper .bottom-menu .text-area{
    width: 100%;
}

.ka-container .ka-content-wrapper .bottom-menu .text-area.mo{
    display: none;
}

.ka-container .ka-content-wrapper .bottom-menu .img-area{
    margin-right: 270px;
}

footer .bottom-menu .biz-info{
    display: flex;
    flex-direction: row;
    align-items: end;
    justify-content: space-between;
}

footer .bottom-menu .biz-info .sns a{
    width: 100%;
    height: 100%;
}

footer .bottom-menu .biz-info > div.text{
    width: 68%;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 0px;
    height: 28px;
    line-height: 28px;
    border: 1px solid #4e4e4e;
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom span a {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-text {
    font-size: 12px;
    color: #cccccc;
    padding: 0 4px;
    cursor: pointer;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-minus,
.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-plus,
.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-reload{
    width: 28px;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-minus a,
.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-plus a{
    width: 20px;
    height: 20px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-plus i,
.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-minus i {
    font-size: 12px;
    color: #cccccc !important;
    display: block;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-minus:hover a,
.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-plus:hover a{
    background: rgba(255, 255, 255, 0.15);
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-reload{
    height: 100%;
    border-left: 1px solid #4e4e4e;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-reload a{
    display: flex;
    align-items: center;
    justify-content: center;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-reload i {
    font-size: 10px;
    color: #cccccc;
}

.ka-container .ka-content-wrapper .bottom-menu .text-zoom .zoom-reload:hover{
    background: rgba(255, 255, 255, 0.15);
}

.ka-container .ka-content-wrapper .bottom-menu ul li {
    display: inline-block;
    position: relative;
    padding-left: 0;
}

.ka-container .ka-content-wrapper .bottom-menu a {
    position: relative;
    color: #4e4e4e;
}

.pcbtn {
    position: relative;
    /* display: none; */
    margin-left: 15px;
    color: #7e7e7e;
    font-size: 12px;
    font-family: "Nanum Square";
    font-weight: 800;
    -webkit-transform: skew(-0.1deg);
    -ms-transform: skew(-0.1deg);
    transform: skew(-0.1deg);
    letter-spacing: -0.06em;
}

.pcbtn:before {
    display: block;
    content: '';
    position: absolute;
    top: 50%;
    left: -9px;
    width: 1px;
    height: 8px;
    background: #262626;
    margin-top: -3px;
}


@media (max-width: 768px) {
    .ka-container .ka-content-wrapper .bottom-menu .text-zoom {
        display: none;
    }
}


.ka-container .ka-content-wrapper .bottom-menu ul li a {
    display: block;
    color: #EAEAEA;
    font-family: Noto Sans KR;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    margin-right: 34px;
}

.ka-container .ka-content-wrapper .bottom-menu ul li.foot-kakao a{
    margin-right: 0;
}

.ka-container .ka-content-wrapper .bottom-menu ul li a.PrivacyClause {
    font-weight: 700;
}

.ka-container .ka-content-wrapper .bottom-menu ul li a:hover {
    color: #c1c1c1!important;
}

.ka-container .ka-content-wrapper .bottom-menu ul li:first-child:before {
    display: none;
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li {
    width: 32px;
    height: 32px;
    padding-left: 0;
    border-radius: 100%;
    text-indent: -9999px;
    background-color: #333;
    background-position: 50% 48%;
    background-repeat: no-repeat;
    background-size: 16px;
    -webkit-transition: all .2s ease;
    -o-transition: all .2s ease;
    -kthtml-transition: all .2s ease;
    transition: all .2s ease;
    vertical-align: top;
    margin-right: 13px;
    cursor: pointer;
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li:hover{
    background-color: #4E4E4E;
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-facebook {
    background-image: url("../img/icons/f_sns01.png")
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-insta {
    background-image: url("../img/icons/f_sns02.png")
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-yotube {
    background-image: url("../img/icons/f_sns03.png")
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-blog {
    background-image: url("../img/icons/f_sns04.png");
    background-size: 9px;
    background-position: 50% 55%;
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-post {
    background-image: url("../img/icons/f_sns05.png")
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-kakao {
    background-image: url("../img/icons/f_sns06.png");
    margin-right: 0;
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-youtube {
    background-image: url("../img/icons/f_sns07.png");
    background-size: 36px;
}

.ka-container .ka-content-wrapper .bottom-menu ul.sns li.foot-youtube:hover {
    background-image: url("../img/icons/f_sns07_on.png");
}

.ka-container .ka-content-wrapper .copyright a {
    color: #7e7e7e !important;
}

.ka-container .ka-content-wrapper .copyright a:hover {
    color: #F47104 !important;
}

.ka-container .ka-content-wrapper .bottom-menu .foot-isms {
    height: auto;
    position: relative;
    left: -8px;
    background-color: transparent;
    text-indent: 0;
    opacity: 0.9;
}

.ka-container .ka-content-wrapper .bottom-menu .foot-isms a{
    margin-right: 0;
}


.ka-container .ka-content-wrapper .bottom-menu .foot-isms > a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.ka-container .ka-content-wrapper .bottom-menu .foot-isms > a > div.img {
    width: 32px;
    height: 32px;
    margin-right: 8px;
    background: url(../img/icons/ISMS_mark.png) no-repeat center left 0;
    background-size: cover;
}

.ka-container .ka-content-wrapper .bottom-menu .foot-isms > a > div.cnt {
    height: 33px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    line-height: initial;
    text-align: left;
    font-size: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ka-container .ka-content-wrapper .bottom-menu .foot-isms > a > div.cnt > span {
    display: block;
    color: #c1c1c1c1;
    font-family: Noto Sans KR;
    font-size: 11px;
    font-weight: 400;
    line-height: 15px;
    letter-spacing: 0.05px;
}

.ka-container .ka-content-wrapper .bottom-menu .foot-isms:hover{
    opacity: 1;
}

@media (max-width: 535px) {
    .ka-container .ka-content-wrapper .bottom-menu .foot-isms {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding-left: 0;
    }

    .ka-container .ka-content-wrapper .bottom-menu .foot-isms::after {
        display: none;
    }
}

@media all and (max-width:420px){
    .ka-container .ka-content-wrapper .bottom-menu ul{
        margin-top: 14px;
    }

    .ka-container .ka-content-wrapper .bottom-menu .foot-isms{
        display: none;
    }

    .ka-container .ka-content-wrapper .address{
        display: none;
        margin-top: 10px;
    }

    footer .biz-info > a{
        display: inline-block!important;
        font-family: 'Noto Sans KR';
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        letter-spacing: -0.03em;
        color: #7E7E7E!important;
        padding-right: 20px;
        position: relative;
        margin: 10px 0 3px;
    }

    footer .biz-info > a::after{
        content: '';
        position: absolute;
        top: 1px;
        right: 0;
        width: 18px;
        height: 18px;
        background: url(../img/icons/icon_footer_down.png)no-repeat center;
        background-size: cover;
        transition: all 0.5s;
    }

    footer .biz-info > a.on::after{
        transition: all 0.5s;
        transform: rotate(-180deg);
    }

    footer .bottom-text{
        display: flex;
        flex-direction: column-reverse;
    }

    .ka-container .ka-content-wrapper .footer-announcement{
        margin-top: 20px;
    }
    .ka-container .ka-content-wrapper .copyright{
        margin-top: 13px;
    }
}

.ka-title {
    margin-top: 0px;
}

.group-container {
    white-space: nowrap !important;
}

.group-container .single-group {
    vertical-align: top;
    display: inline-block;
    white-space: normal;
}

.jumbotron {
    position: relative;
    overflow: hidden;
    display: block;
    padding: 0;
    background-color: #fff;
}

.jumbotron .inner {
    position: relative;
    z-index: 2;
}

.jumbotron.lg {
    height: 600px;
}

.jumbotron .cover-photo {
    width: 100%;
    height: inherit;
    overflow: hidden;
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    background-size: cover;
    background-position: center top;
    background-color: #000;
}

.jumbotron .cover-photo img {
    display: none;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90);
    opacity: 0.9;
}

.jumbotron h1 {
    font-size: 44px;
}

/* Override */
.container-fluid {
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
}

.copyright-be {
    padding: 25px 0;
    border-top: 1px solid rgba(98, 98, 98, 0.07);
}

.inner-content {
    margin-top: 0px;
    padding: 0px;
    overflow: auto;
    min-height: 100%;
}


/* Breadcrumb */

.breadcrumb {
    position: absolute;
    /* font-family: "Nanum Square", sans-serif; */
    font-weight: 400;
    font-size: 12px !important;
    letter-spacing: 0.06em;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: transparent;
    padding: 15px 0;
    margin: 0;
    border: none;
    text-transform: uppercase;
}

.breadcrumb a {
    font-weight: 400;
    font-size: 10px;
    color: #fff;
}

.breadcrumb a:hover {
    color: #F47104;
}

.breadcrumb .breadcrumb-item {
    position: relative;
    float: left;
    padding: 0px 10px;
    margin: 0;
}

.breadcrumb > li:not(:last-child):after {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 1.2px;
    height: 6px;
    background-color: #fff;
}

.breadcrumb .breadcrumb-item.depth-1 {
    background-color: rgba(13, 13, 13, 0.4);
    color: #fff !important;
}

.breadcrumb .breadcrumb-item.depth-2 {
    background-color: rgba(13, 13, 13, 0.4);
    color: #fff !important;
}

.breadcrumb .breadcrumb-item.depth-3 {
    background-color: rgba(13, 13, 13, 0.4);
    color: #fff !important;
}

.breadcrumb .breadcrumb-item.depth-4 {
    background-color: rgba(13, 13, 13, 0.4);
    color: #fff !important;
}

.breadcrumb .breadcrumb-item.depth-5 {
    background-color: rgba(13, 13, 13, 0.4);
    color: #fff !important;
}

.breadcrumb .breadcrumb-item.depth-6 {
    background-color: none;
    color: #fff !important;
}

.breadcrumb > .breadcrumb-item + .breadcrumb-item:before {
    display: none;
}

.breadcrumb > .breadcrumb-item.active {
    margin: 0;
    padding: 0px 10px;
}

.breadcrumb > .breadcrumb-item.active:before {
    display: none;
}


/* Overlay */
.overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.95);
    z-index: 1010;
    padding-left: 64px;
    overflow: auto;
}

.overlay .inline-block {
    display: inline-block;
}

.overlay .overlay-brand {
    margin-left: 7px;
    position: relative;
    top: -1px;
}

.overlay > div {
    width: 100%;
    height: 260px;
    display: block;
    overflow: hidden;
}

.overlay .overlay-close {
    position: absolute;
    line-height: 0px;
    padding: 0;
    right: 20px;
}

.overlay .overlay-close i {
    font-size: 36px;
}


/* Scroll bar */
.scroll {
    position: relative;
    overflow: auto;
}

.scroll-wrapper > .scroll-element,
.scroll-wrapper > .scroll-element div {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10;
}

.scroll-wrapper > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

.scroll-wrapper > .scroll-element.scroll-x {
    bottom: 2px;
    height: 7px;
    left: 0;
    min-width: 100%;
    width: 100%;
}

.scroll-wrapper > .scroll-element.scroll-y {
    height: 100%;
    min-height: 100%;
    right: 2px;
    top: 0;
    width: 4px;
}

.scroll-wrapper > .scroll-element .scroll-element_outer {
    opacity: 0.3;
}

.scroll-wrapper > .scroll-element .scroll-element_size {
    background-color: rgba(0, 0, 0, 0.07);
    opacity: 0;
}

.scroll-wrapper > .scroll-element .scroll-bar {
    background-color: #697686;
}

.scroll-wrapper > .scroll-element.scroll-x .scroll-bar {
    bottom: 0;
    height: 4px;
    min-width: 24px;
    top: auto;
}

.scroll-wrapper > .scroll-element.scroll-x .scroll-element_outer {
    bottom: 0;
    top: auto;
    left: 2px;
    -webkit-transition: height 0.2s;
    -o-transition: height 0.2s;
    transition: height 0.2s;
}

.scroll-wrapper > .scroll-element.scroll-x .scroll-element_size {
    left: -4px;
}

.scroll-wrapper > .scroll-element.scroll-y .scroll-bar {
    left: auto;
    min-height: 24px;
    right: 0;
    width: 4px;
}

.scroll-wrapper > .scroll-element.scroll-y .scroll-element_outer {
    left: auto;
    right: 0;
    top: 2px;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

.scroll-wrapper > .scroll-element.scroll-y .scroll-element_size {
    top: -4px;
}

.scroll-wrapper > .scroll-content {
    -webkit-box-sizing: inherit !important;
    box-sizing: inherit !important;
}

.scroll-wrapper.auto-hide > .scroll-element .scroll-element_track {
    display: none;
}

.scroll-wrapper > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -11px;
}

.scroll-wrapper > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -11px;
}

.scroll-wrapper > .scroll-element:hover .scroll-element_outer,
.scroll-wrapper > .scroll-element.scroll-draggable .scroll-element_outer {
    overflow: hidden;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.scroll-wrapper > .scroll-element:hover .scroll-element_outer .scroll-element_size,
.scroll-wrapper > .scroll-element.scroll-draggable .scroll-element_outer .scroll-element_size {
    opacity: 1;
}

.scroll-wrapper > .scroll-element:hover .scroll-element_outer .scroll-bar,
.scroll-wrapper > .scroll-element.scroll-draggable .scroll-element_outer .scroll-bar {
    height: 100%;
    width: 100%;
}

.scroll-wrapper > .scroll-element.scroll-x:hover .scroll-element_outer,
.scroll-wrapper > .scroll-element.scroll-x.scroll-draggable .scroll-element_outer {
    height: 10px;
    min-height: 7px;
}

.scroll-wrapper > .scroll-element.scroll-y:hover .scroll-element_outer,
.scroll-wrapper > .scroll-element.scroll-y.scroll-draggable .scroll-element_outer {
    min-width: 7px;
    width: 7px;
}


/*------------------------------------------------------------------
[03. Form Element]
------------------------------------------------------------------*/
label,
input,
button,
select,
textarea {
    font-size: 14px;
    font-weight: normal;
    line-height: 20px;
}

select[multiple],
select[size] {
    height: auto !important;
}

input:focus,
select:focus,
textarea:focus,
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

input:-webkit-autofill, input.error:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
}

input:-webkit-autofill:focus, input.error:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
}

form legend {
    margin: 15px 0px 10px 0px;
}

.form-control {
    background-color: #fff;
    background-image: none;
    border: 1px solid rgba(33, 33, 33, 0.14);
    border-top-color: rgba(33, 33, 33, 0.21);
    -webkit-appearance: none;
    color: #212121;
    outline: 0;
    padding: 6px 8px;
    line-height: 16px;
    font-size: 14px;
    font-weight: normal;
    vertical-align: middle;
    min-height: 32px;
    -webkit-transition: all 0.12s ease;
    -o-transition: all 0.12s ease;
    transition: all 0.12s ease;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-transition: background 0.2s linear 0s;
    -o-transition: background 0.2s linear 0s;
    transition: background 0.2s linear 0s;
}

.form-control::-moz-placeholder {
    color: inherit;
    opacity: 0.47;
    font-weight: 400;
}

.form-control:-ms-input-placeholder {
    color: inherit;
    opacity: 0.47;
    font-weight: 400;
}

.form-control::-webkit-input-placeholder {
    color: inherit;
    opacity: 0.47;
    font-weight: 400;
}

.form-control::-ms-input-placeholder {
    color: inherit;
    opacity: 0.47;
    font-weight: 400;
}

.form-control::placeholder {
    color: inherit;
    opacity: 0.47;
    font-weight: 400;
}

.form-control:focus {
    border-color: unset;
    background-color: #fff;
    border: 1px solid #F47104;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0 !important;
}

.form-control:focus::-moz-placeholder {
    color: inherit;
    opacity: 0.57;
    font-weight: 400;
}

.form-control:focus:-ms-input-placeholder {
    color: inherit;
    opacity: 0.57;
    font-weight: 400;
}

.form-control:focus::-webkit-input-placeholder {
    color: inherit;
    opacity: 0.57;
    font-weight: 400;
}

.form-control:focus::-ms-input-placeholder {
    color: inherit;
    opacity: 0.57;
    font-weight: 400;
}

.form-control:focus::placeholder {
    color: inherit;
    opacity: 0.57;
    font-weight: 400;
}

.form-control[disabled], .form-control[readonly],
fieldset[disabled] .form-control {
    background: #fafafa;
    color: rgba(75, 75, 75, 0.33);
    cursor: not-allowed;
}

.form-control.transparent {
    background-color: transparent;
    border-color: transparent;
}

.form-control.transparent:focus {
    background-color: transparent;
    border-color: transparent;
}

.input-sm,
.form-horizontal .form-group-sm .form-control {
    font-size: 12px;
    min-height: 32px;
    padding: 7px 9px;
}

.input-lg,
.form-horizontal .form-group-lg .form-control {
    border-radius: 3px;
    font-size: 18px;
    min-height: 45px;
    padding: 11px 13px;
}

.input-xlg {
    min-height: 51px;
    font-size: 18px;
    line-height: 22px;
}

.input-group-lg > .form-control {
    padding: 6px 1rem;
}

.input-group-sm > .form-control {
    padding: 0 0.5rem;
    min-height: 32px;
}

.select2-lg .select2-container .select2-selection.select2-selection--single {
    height: 45px;
    padding: 11px 13px;
}

.select2-lg .select2-container .select2-selection.select2-selection--single .select2-selection__rendered {
    padding-top: 0px;
    line-height: 22px;
    font-size: 18px;
    color: #212121;
}

.select2-lg .select2-container .select2-selection.select2-selection--single .select2-selection__arrow {
    bottom: 9px;
}

.select2-sm .select2-container .select2-selection.select2-selection--single {
    height: 32px;
    padding: 8px 9px;
}

.select2-sm .select2-container .select2-selection.select2-selection--single .select2-selection__rendered {
    padding-top: 0px;
    line-height: 16px;
    font-size: 12px;
    color: #212121;
}

.select2-sm .select2-container .select2-selection.select2-selection--single .select2-selection__arrow {
    bottom: 4px;
}

.form-check {
    margin-bottom: 10px;
    padding-left: 0px;
}

.form-check label {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding-left: 25px;
    min-width: 18px;
    min-height: 18px;
    margin-bottom: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.form-check label:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    left: 0px;
    -webkit-box-sizing: inherit;
    box-sizing: border-box;
    background-color: #fff;
    border: 1px solid #c9c9c9;
}

.form-check label {
    -webkit-transition: border 140ms linear 0s,
    color 140ms linear 0s,
    background-color 140ms linear 0s;
    -o-transition: border 140ms linear 0s,
    color 140ms linear 0s,
    background-color 140ms linear 0s;
    transition: border 140ms linear 0s,
    color 140ms linear 0s,
    background-color 140ms linear 0s;
}

.form-check label:hover {
    color: #212121;
}

.form-check label:before {
    top: 2px;
    border-radius: 3px;
    -webkit-transition: border 140ms linear 0s,
    color 140ms linear 0s,
    background-color 140ms linear 0s;
    -o-transition: border 140ms linear 0s,
    color 140ms linear 0s,
    background-color 140ms linear 0s;
    transition: border 140ms linear 0s,
    color 140ms linear 0s,
    background-color 140ms linear 0s;
}

.form-check input[type="checkbox"] {
    position: absolute;
    margin: 0;
    top: 3px;
    z-index: -1;
    width: 16px;
    height: 16px;
    opacity: 0;
}

.form-check input[type="checkbox"] + label::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 0px;
    border-right: 0 solid transparent;
    border-bottom: 0 solid transparent;
    width: 16px;
    height: 16px;
    overflow: hidden;
}

.form-check.checkbox-circle label:after {
    border-radius: 99px;
}

.form-check.checkbox-circle label:before {
    border-radius: 99px;
}

.form-check input[type="checkbox"]:checked + label::after {
    content: "";
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAAAQAgMAAADsa5zLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTHBwcG9vb3BwcBFjhIYAAAAEdFJOUwBG9tQE3MceAAAAVUlEQVQoz2NgGLKA0QGIDwDxBSCeAMEYgAWI2YCK2CagYgwgDcRSDhgYbAkKzsSKGdgakCyY6ADES7BiiCkgJ4PYyybgxAhQAsRZDrgxCpDEg4cAAAAp2ibhZRGLHgAAAABJRU5ErkJggg==") left center;
    background-size: 160px 16px;
    background-repeat: no-repeat;
    -webkit-animation-name: checkbox-check;
    animation-name: checkbox-check;
    -webkit-animation-duration: 320ms;
    animation-duration: 320ms;
    -webkit-animation-timing-function: steps(9);
    animation-timing-function: steps(9);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}


.form-check.fs18 label:before {
    margin-top: 1px;
}

.form-check.fs16 label:before {
    margin-top: 2px;
}

.form-check.fs14 label:before {
    margin-top: 1px;
}

.form-check.fs18 input[type="checkbox"]:checked + label::after {
    margin-top: 1px;
}

.form-check.fs16 input[type="checkbox"]:checked + label::after {
    margin-top: 2px;
}

.form-check.fs14 input[type="checkbox"]:checked + label::after {
    margin-top: 1px;
}


.form-check input[type="checkbox"]:hover:active:not(:checked) + label:before {
    background-color: rgba(0, 0, 0, 0.08);
}

.form-check input[type="checkbox"]:focus + label {
    color: #212121;
}

.form-check input[type="checkbox"]:focus + label:before {
    outline: none !important;
    -webkit-box-shadow: 0 0 0 2px #78c8fe;
    box-shadow: 0 0 0 2px #78c8fe;
}

.form-check input[type="checkbox"][disabled] + label {
    cursor: not-allowed !important;
    color: #4b4b4b;
    opacity: 0.58;
}

.form-check input[type="checkbox"][disabled] + label:before {
    cursor: not-allowed !important;
    background: #ececec;
}

.form-check input[type="checkbox"]:indeterminate + label:after {
    background: none;
    background-color: #4b4b4b;
    width: 10px;
    height: 2px;
    top: 6px;
    margin: 3px;
    border-radius: 2px;
}

.form-check.right label {
    padding-left: 0px;
    padding-right: 26px;
}

.form-check.right label:before {
    right: 0px;
    left: auto;
}

.form-check.right input[type="checkbox"]:checked + label {
    position: relative;
}

.form-check.right input[type="checkbox"]:checked + label::after {
    position: absolute;
    right: 0px;
    left: auto;
}

.success input[type="checkbox"]:checked + label:before,
.success input[type="checkbox"]:indeterminate + label:before {
    border-color: #19AD79;
    background-color: #19AD79;
}

.primary input[type="checkbox"]:checked + label:before,
.primary input[type="checkbox"]:indeterminate + label:before {
    border-color: #F47104;
    background-color: #F47104;
}

.complete input[type="checkbox"]:checked + label:before,
.complete input[type="checkbox"]:indeterminate + label:before {
    border-color: #0072EC;
    background-color: #0072EC;
}

.warning input[type="checkbox"]:checked + label:before,
.warning input[type="checkbox"]:indeterminate + label:before {
    border-color: #FFd945;
    background-color: #FFd945;
}

.danger input[type="checkbox"]:checked + label:before,
.danger input[type="checkbox"]:indeterminate + label:before {
    border-color: #D83C31;
    background-color: #D83C31;
}

.info input[type="checkbox"]:checked + label:before,
.info input[type="checkbox"]:indeterminate + label:before {
    border-color: #3B4752;
    background-color: #3B4752;
}

.info input[type="checkbox"]:checked + label::after,
.danger input[type="checkbox"]:checked + label::after,
.complete input[type="checkbox"]:checked + label::after,
.primary input[type="checkbox"]:checked + label::after,
.success input[type="checkbox"]:checked + label::after {
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAAAQAgMAAADsa5zLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTP///////////waf0AoAAAAEdFJOUwBG9tQE3MceAAAAVUlEQVQoz2NgGLKA0QGIDwDxBSCeAMEYgAWI2YCK2CagYgwgDcRSDhgYbAkKzsSKGdgakCyY6ADES7BiiCkgJ4PYyybgxAhQAsRZDrgxCpDEg4cAAAAp2ibhZRGLHgAAAABJRU5ErkJggg==") left center;
}

.info input[type="checkbox"]:indeterminate + label::after,
.danger input[type="checkbox"]:indeterminate + label::after,
.complete input[type="checkbox"]:indeterminate + label::after,
.primary input[type="checkbox"]:indeterminate + label::after,
.success input[type="checkbox"]:indeterminate + label::after {
    background-color: #fff;
}

@-webkit-keyframes shrink-bounce {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    33% {
        -webkit-transform: scale(0.85);
        transform: scale(0.85);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes shrink-bounce {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    33% {
        -webkit-transform: scale(0.85);
        transform: scale(0.85);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes checkbox-check {
    0% {
        background-position: 0px;
    }
    100% {
        background-position: -144px;
    }
}

@keyframes checkbox-check {
    0% {
        background-position: 0px;
    }
    100% {
        background-position: -144px;
    }
}

.js-focus-visible .form-check input[type="checkbox"]:focus:not(.focus-visible) + label:before {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-check input[type="radio"] + label:before {
    bottom: 2.5px;
    border-radius: 99px;
    -webkit-transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    -o-transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
    transition: border 0.3s 0s cubic-bezier(0.455, 0.03, 0.215, 1.33);
}

.form-check input[type="radio"]:checked + label:before {
    border-color: #757575;
    border-width: 5px;
}

.form-check input[type="radio"]:hover:active:not(:checked) + label:before {
    background-color: rgba(0, 0, 0, 0.08);
}

.form-check input[type="radio"]:focus + label {
    color: #212121;
}

.form-check input[type="radio"]:focus + label:before {
    outline: none !important;
    -webkit-box-shadow: 0 0 0 2px #78c8fe;
    box-shadow: 0 0 0 2px #78c8fe;
}

.form-check input[type="radio"] {
    opacity: 0;
    position: absolute;
    top: 3px;
    width: 16px;
    height: 16px;
}

.form-check input[type="radio"][disabled] + label {
    cursor: not-allowed !important;
    color: #4b4b4b;
    opacity: 0.58;
}

.form-check input[type="radio"][disabled] + label:before {
    cursor: not-allowed !important;
    background: #ececec;
}

.success input[type="radio"]:checked + label:before {
    border-color: #19AD79;
}

.primary input[type="radio"]:checked + label:before {
    border-color: #F47104;
}

.info input[type="radio"]:checked + label:before {
    border-color: #3B4752;
}

.warning input[type="radio"]:checked + label:before {
    border-color: #FFd945;
}

.danger input[type="radio"]:checked + label:before {
    border-color: #D83C31;
}

.complete input[type="radio"]:checked + label:before {
    border-color: #0072EC;
}

.js-focus-visible .form-check input[type="radio"]:focus:not(.focus-visible) + label:before {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-check.switch input[type="checkbox"] + label {
    padding-left: 34px;
}

.form-check.switch input[type="checkbox"] + label:before {
    cursor: pointer;
    width: 26px;
    height: 18px;
    top: 2px;
    background-image: -webkit-gradient(linear, left top, right top, from(#F47104), color-stop(44%, #ff9447), color-stop(62%, rgba(0, 0, 0, 0.14)), color-stop(97%, rgba(0, 0, 0, 0.04)));
    background-image: -o-linear-gradient(left, #F47104 0%, #ff9447 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
    background-image: linear-gradient(to right, #F47104 0%, #ff9447 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
    background-size: 300%;
    background-position: right;
    border-radius: 50px;
    border: none;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12);
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12);
    -webkit-transition: background 310ms, -webkit-box-shadow 250ms;
    transition: background 310ms, -webkit-box-shadow 250ms;
    -o-transition: background 310ms, box-shadow 250ms;
    transition: background 310ms, box-shadow 250ms;
    transition: background 310ms, box-shadow 250ms, -webkit-box-shadow 250ms;
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.form-check.switch input[type="checkbox"] + label:after {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    background: #fff;
    top: 4px;
    left: 2px;
    width: 14px;
    height: 14px;
    border-radius: 9px;
    -webkit-box-shadow: 1px 0px 1px 0.5px rgba(0, 0, 0, 0.12), 2px 4px 6px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 0px 1px 0.5px rgba(0, 0, 0, 0.12), 2px 4px 6px rgba(0, 0, 0, 0.2);
    -webkit-transition: -webkit-transform, -webkit-box-shadow;
    transition: -webkit-transform, -webkit-box-shadow;
    -o-transition: transform, box-shadow;
    transition: transform, box-shadow;
    transition: transform, box-shadow, -webkit-transform, -webkit-box-shadow;
    -webkit-transition-duration: 250ms;
    -o-transition-duration: 250ms;
    transition-duration: 250ms;
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.form-check.switch input[type="checkbox"]:checked + label:before {
    background-position: left;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12);
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12);
}

.form-check.switch input[type="checkbox"]:checked + label:after {
    -webkit-transform: translateX(calc(100% - 6px));
    -ms-transform: translateX(calc(100% - 6px));
    transform: translateX(calc(100% - 6px));
    -webkit-box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.08), -3px 3px 6px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.08), -3px 3px 6px rgba(0, 0, 0, 0.3);
}

.form-check.switch input[type="checkbox"]:focus + label:before {
    outline: none !important;
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12), 0 0 0 2px #78c8fe;
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12), 0 0 0 2px #78c8fe;
}

.form-check.switch input[type="checkbox"][disabled]:active + label:after {
    -webkit-transform: scaleX(1.1);
    -ms-transform: scaleX(1.1);
    transform: scaleX(1.1);
    -webkit-transform-origin: center left;
    -ms-transform-origin: center left;
    transform-origin: center left;
    -webkit-transition: -webkit-transform step-start;
    transition: -webkit-transform step-start;
    -o-transition: transform step-start;
    transition: transform step-start;
    transition: transform step-start, -webkit-transform step-start;
}

.form-check.switch input[type="checkbox"]:checked[disabled]:active + label:after {
    -webkit-transform: translateX(calc(100% - 6px)) scaleX(1.1);
    -ms-transform: translateX(calc(100% - 6px)) scaleX(1.1);
    transform: translateX(calc(100% - 6px)) scaleX(1.1);
    -webkit-transform-origin: center right;
    -ms-transform-origin: center right;
    transform-origin: center right;
}

.form-check.switch input[type="checkbox"]:hover:active + label:before {
    background-color: transparent;
}

.form-check.switch.right input[type="checkbox"] + label {
    padding-left: 0px;
    padding-right: 36px;
}

.form-check.switch.right input[type="checkbox"] + label:before {
    right: 0px;
    left: auto;
}

.form-check.switch.right input[type="checkbox"] + label:after {
    right: 10px;
    left: auto;
}

.form-check.switch.switch-lg input[type="checkbox"] + label {
    padding-left: 42px;
}

.form-check.switch.switch-lg input[type="checkbox"] + label:before {
    width: 34px;
    height: 22px;
    top: 0px;
}

.form-check.switch.switch-lg input[type="checkbox"] + label:after {
    width: 18px;
    height: 18px;
    top: 2px;
}

.form-check.switch.switch-lg.right input[type="checkbox"] + label {
    padding-left: 0px;
    padding-right: 44px;
}

.form-check.switch.switch-lg.right input[type="checkbox"] + label:after {
    right: 14px;
}

.form-check.switch.success input[type="checkbox"] + label:before {
    background-image: -webkit-gradient(linear, left top, right top, from(#19AD79), color-stop(44%, #26bf93), color-stop(62%, rgba(0, 0, 0, 0.14)), color-stop(97%, rgba(0, 0, 0, 0.04)));
    background-image: -o-linear-gradient(left, #19AD79 0%, #26bf93 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
    background-image: linear-gradient(to right, #19AD79 0%, #26bf93 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
}

.form-check.switch.complete input[type="checkbox"] + label:before {
    background-image: -webkit-gradient(linear, left top, right top, from(#0072EC), color-stop(44%, #0f8ff9), color-stop(62%, rgba(0, 0, 0, 0.14)), color-stop(97%, rgba(0, 0, 0, 0.04)));
    background-image: -o-linear-gradient(left, #0072EC 0%, #0f8ff9 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
    background-image: linear-gradient(to right, #0072EC 0%, #0f8ff9 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
}

.form-check.switch.warning input[type="checkbox"] + label:before {
    background-image: -webkit-gradient(linear, left top, right top, from(#FFd945), color-stop(44%, #ffe858), color-stop(62%, rgba(0, 0, 0, 0.14)), color-stop(97%, rgba(0, 0, 0, 0.04)));
    background-image: -o-linear-gradient(left, #FFd945 0%, #ffe858 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
    background-image: linear-gradient(to right, #FFd945 0%, #ffe858 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
}

.form-check.switch.danger input[type="checkbox"] + label:before {
    background-image: -webkit-gradient(linear, left top, right top, from(#D83C31), color-stop(44%, #e6533c), color-stop(62%, rgba(0, 0, 0, 0.14)), color-stop(97%, rgba(0, 0, 0, 0.04)));
    background-image: -o-linear-gradient(left, #D83C31 0%, #e6533c 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
    background-image: linear-gradient(to right, #D83C31 0%, #e6533c 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
}

.form-check.switch.info input[type="checkbox"] + label:before {
    background-image: -webkit-gradient(linear, left top, right top, from(#3B4752), color-stop(44%, #475b6b), color-stop(62%, rgba(0, 0, 0, 0.14)), color-stop(97%, rgba(0, 0, 0, 0.04)));
    background-image: -o-linear-gradient(left, #3B4752 0%, #475b6b 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
    background-image: linear-gradient(to right, #3B4752 0%, #475b6b 44%, rgba(0, 0, 0, 0.14) 62%, rgba(0, 0, 0, 0.04) 97%);
}

.js-focus-visible .form-check.switch input[type="checkbox"]:focus:not(.focus-visible) + label:before {
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12);
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.12);
}

.form-check.switch input[type="checkbox"] {
    top: 1px;
    width: 28px;
    height: 18px;
}

.form-check.switch.switch-lg input[type="checkbox"] {
    top: 0px;
    width: 34px;
    height: 22px;
}

.input-group-text {
    background-color: #fff;
    color: rgba(75, 75, 75, 0.67);
    font-size: 14px;
    line-height: 14px;
    border: 1px solid rgba(33, 33, 33, 0.14);
    border-top-color: rgba(33, 33, 33, 0.21);
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 2px;
}

.input-group-text.primary {
    background-color: #F47104;
    color: #fff;
}

.input-group-text.success {
    background-color: #19AD79;
    color: #fff;
}

.input-group-text.complete {
    background-color: #0072EC;
    color: #fff;
}

.input-group-text.info {
    background-color: #3B4752;
    color: #fff;
}

.input-group-text.warning {
    background-color: #FFd945;
    color: #4b4b4b;
}

.input-group-text.danger {
    background-color: #D83C31;
    color: #fff;
}

.input-group-text.black {
    background-color: #000;
    color: #fff;
}

.input-group-text.transparent {
    background-color: transparent;
}

.input-group-append .input-group-text {
    border-left: 0;
}

.input-group-prepend .input-group-text {
    border-right: 0;
}

@media only screen and (min-width: 540px) {
    form .row {
        margin-left: 0;
        margin-right: 0;
    }

    form .row [class*="col-sm-"]:not(:first-child),
    form .row [class*="col-sm-"]:not(:last-child) {
        padding-right: 7px;
        padding-left: 7px;
    }

    form .row [class*="col-sm-"]:first-child {
        padding-left: 0;
    }

    form .row [class*="col-sm-"]:last-child {
        padding-right: 0;
    }
}

@media only screen and (min-width: 720px) {
    form .row {
        margin-left: 0;
        margin-right: 0;
    }

    form .row [class*="col-"]:not(:first-child),
    form .row [class*="col-"]:not(:last-child) {
        padding-right: 0;
        padding-left: 0;
    }

    form .row [class*="col-"]:first-child {
        padding-left: 0;
    }

    form .row [class*="col-"]:last-child {
        padding-right: 0;
    }

    form .row {
        margin-left: 0;
        margin-right: 0;
    }

    form .row [class*="col-md-"]:not(:first-child),
    form .row [class*="col-md-"]:not(:last-child) {
        padding-right: 7px;
        padding-left: 7px;
    }

    form .row [class*="col-md-"]:first-child {
        padding-left: 0;
    }

    form .row [class*="col-md-"]:last-child {
        padding-right: 0;
    }
}

@media only screen and (min-width: 960px) {
    form .row {
        margin-left: 0;
        margin-right: 0;
    }

    form .row [class*="col-lg-"]:not(:first-child),
    form .row [class*="col-lg-"]:not(:last-child) {
        padding-right: 7px;
        padding-left: 7px;
    }

    form .row [class*="col-lg-"]:first-child {
        padding-left: 0;
    }

    form .row [class*="col-lg-"]:last-child {
        padding-right: 0;
    }
}

@media only screen and (min-width: 1200px) {
    form .row {
        margin-left: 0;
        margin-right: 0;
    }

    form .row [class*="col-xl-"]:not(:first-child),
    form .row [class*="col-xl-"]:not(:last-child) {
        padding-right: 7px;
        padding-left: 7px;
    }

    form .row [class*="col-xl-"]:first-child {
        padding-left: 0;
    }

    form .row [class*="col-xl-"]:last-child {
        padding-right: 0;
    }
}

.form-horizontal .form-group {
    border-bottom: 1px solid #e0e0e0;
    padding-top: 12px;
    padding-bottom: 12px;
    margin-bottom: 0;
}

.form-horizontal .form-group:last-child {
    border-bottom: none;
}

.form-horizontal .form-group:hover .control-label {
    opacity: 1;
    color: #212121;
}

.form-horizontal .form-group.focused .control-label {
    opacity: 1;
    color: #4b4b4b;
}

.form-horizontal .form-group .control-label {
    text-align: left;
    color: #4b4b4b;
    -webkit-transition: opacity ease 0.3s;
    -o-transition: opacity ease 0.3s;
    transition: opacity ease 0.3s;
}

.form-horizontal .form-group .control-label.required:after {
    content: "Required";
    position: absolute;
    right: 0px;
    font-size: 12px;
    margin-right: 4px;
    color: rgba(117, 117, 117, 0.87);
}

.form-horizontal .radio {
    padding-top: 7px;
    margin-top: 0;
    margin-bottom: 0;
}

.form-horizontal .control-label {
    padding-top: 7px;
    margin-bottom: 0;
}

.form-group-attached .form-group.form-group-default {
    border-radius: 0;
    margin-bottom: 0;
}

.form-group-attached > div {
    margin: 0;
}

.form-group-attached > div:first-child.row > [class*="col-"]:first-child .form-group-default {
    border-top-left-radius: 2px;
}

.form-group-attached > div:first-child.row > [class*="col-"]:last-child .form-group-default {
    border-top-right-radius: 2px;
}

.form-group-attached > div:first-child.form-group-default {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}

.form-group-attached > div:last-child.row > [class*="col-"]:first-child .form-group-default {
    border-bottom-left-radius: 2px;
}

.form-group-attached > div:last-child.row > [class*="col-"]:last-child .form-group-default {
    border-bottom-right-radius: 2px;
}

.form-group-attached > div:last-child.form-group-default {
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
}

.form-group-attached > div.row > [class*="col-"] {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.form-group-attached > div.row > [class*="col-"]:not(:only-child):not(:last-child)
> .form-group-default {
    border-right-color: transparent;
}

.form-group-attached > div:not(:last-child) .form-group-default,
.form-group-attached > div:not(:last-child).form-group-default {
    border-bottom-color: transparent;
}

/* Responsive Handler : Form layout */
@media (max-width: 767px) {
    .form-group-attached .form-group-default {
        border-right-color: rgba(33, 33, 33, 0.14) !important;
    }
}

@media only screen and (min-width: 768px) {
    .form-group-attached > div.row > [class*="col-"] .form-group {
        height: 100%;
        width: 100%;
    }
}

.form-group {
    margin-bottom: 10px;
}

.form-group label:not(.error) {
    -webkit-transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1),
    150ms cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1),
    150ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1),
    150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.form-group label .help {
    margin-left: 8px;
}

.form-group .help {
    font-size: 12px;
    color: rgba(33, 33, 33, 0.67);
    letter-spacing: normal;
    line-height: 18px;
    display: block;
    margin-top: 6px;
    margin-left: 3px;
}

@keyframes shake {
    8%,
    41% {
        -webkit-transform: translateX(-4px);
    }
    25%,
    58% {
        -webkit-transform: translateX(4px);
    }
    75% {
        -webkit-transform: translateX(-2px);
    }
    92% {
        -webkit-transform: translateX(2px);
    }
    0%,
    100% {
        -webkit-transform: translateX(0);
    }
}

.form-group-default {
    background-color: #fff;
    position: relative;
    border: 1px solid rgba(33, 33, 33, 0.14);
    border-top-color: rgba(8, 7, 7, 0.14);
    border-radius: 2px;
    padding-top: 5px;
    padding-left: 9px;
    padding-right: 9px;
    padding-bottom: 4px;
    overflow: hidden;
    width: 100%;
    -webkit-transition: background-color 0.2s ease;
    -o-transition: background-color 0.2s ease;
    transition: background-color 0.2s ease;
    cursor: text;
    /* z-index: 2; */
}

.form-group-default.form-check-group {
    cursor: default;
}

.form-group-default.form-check-group label {
    cursor: pointer;
}

.col-lg-6.required:after {
    color: #D83C31;
    content: "*";
    font-size: 20px;
    position: absolute;
    right: 13px;
    top: 4px;
    z-index: 1;
}

.form-group-default.disabled {
    background: #fafafa;
    opacity: 0.95;
    cursor: not-allowed;
}

.form-group-default.disabled.focused {
    border: 1px solid #F47104;
}

.form-group-default.disabled.focused label {
    opacity: 1;
}

.form-group-default.disabled label {
    opacity: 0.57;
    cursor: not-allowed;
}

.form-group-default.focused {
    border: 1px solid #F47104 !important;
}

.form-group-default.focused label {
    opacity: 0.67;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    font-size: 13px;
    letter-spacing: normal;
}

.form-group-default.has-error label {
    color: #b91e1e;
    -webkit-animation-name: shake;
    animation-name: shake;
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

.form-group-default.has-success .form-control-feedback,
.form-group-default.has-error .form-control-feedback {
    display: none !important;
}

.form-group-default.has-success .form-control,
.form-group-default.has-success .form-control:focus,
.form-group-default.has-error .form-control,
.form-group-default.has-error .form-control:focus {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-group-default + .error {
    margin-top: -10px;
    padding: 3px 7px 2px 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    letter-spacing: normal;
    -webkit-animation-name: show-msg;
    animation-name: show-msg;
    -webkit-animation-duration: 450ms;
    animation-duration: 450ms;
    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.form-group-default + .error:after {
    content: "";
    width: 0%;
    position: absolute;
    height: 1px;
    background-color: #D83C31;
    top: -1px;
    right: 0px;
    -webkit-animation-name: show-line;
    animation-name: show-line;
    -webkit-animation-delay: 300ms;
    animation-delay: 300ms;
    -webkit-animation-duration: 350ms;
    animation-duration: 350ms;
    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

@-webkit-keyframes show-msg {
    0% {
        height: 0px;
        opacity: 0;
    }
    100% {
        height: 25px;
        opacity: 1;
    }
}

@keyframes show-msg {
    0% {
        height: 0px;
        opacity: 0;
    }
    100% {
        height: 25px;
        opacity: 1;
    }
}

@-webkit-keyframes show-line {
    0% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

@keyframes show-line {
    0% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

.form-group-default.input-group {
    padding: 0;
}

.form-group-default.input-group > label {
    margin-top: 6px;
    padding-left: 12px;
}

.form-group-default.input-group > label.inline {
    margin-top: 6px;
    float: left;
}

.form-group-default.input-group > .form-control {
    margin-top: -2px;
    margin-bottom: 3px;
    padding-left: 12px;
}

.form-group-default.input-group label {
    margin-top: 6px;
    padding-left: 12px;
}

.form-group-default.input-group .form-input-group {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}

.inputgroup-w {
    width: 98px;
    background-color: #F47104;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.form-group-default.input-group .form-input-group.required:after {
    color: #D83C31;
    content: "*";
    font-size: 20px;
    position: absolute;
    right: 10px;
    top: 4px;
    z-index: 1;
}

.form-group-default.input-group .form-control {
    margin-top: -2px;
    margin-bottom: 3px;
    padding-left: 12px;
    width: 100%;
}

.form-group-default.input-group .input-group-text {
    border: 0;
    border-radius: 0;
    min-width: 50px;
}

.form-group-default.input-group .input-group-text i {
    width: 100%;
}

.form-group-default.input-group .btn {
    border-top: 0;
    border-bottom: 0;
}

.form-group-default .form-control {
    border: none;
    height: 25px;
    min-height: 25px;
    padding: 0;
    margin-top: -4px;
    background: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-group-default .form-control.error {
    color: #212121;
}

.form-group-default .form-control:focus {
    background: none;
}

.form-group-default .form-control:focus::-moz-placeholder {
    color: inherit;
    opacity: 0.77;
    font-weight: 400;
}

.form-group-default .form-control:focus:-ms-input-placeholder {
    color: inherit;
    opacity: 0.77;
    font-weight: 400;
}

.form-group-default .form-control:focus::-webkit-input-placeholder {
    color: inherit;
    opacity: 0.77;
    font-weight: 400;
}

.form-group-default .form-control:focus::-ms-input-placeholder {
    color: inherit;
    opacity: 0.77;
    font-weight: 400;
}

.form-group-default .form-control:focus::placeholder {
    color: inherit;
    opacity: 0.77;
    font-weight: 400;
}

.form-group-default .form-control:-webkit-autofill,
.form-group-default .form-control.error:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
}

.form-group-default .form-control:-webkit-autofill:focus,
.form-group-default .form-control.error:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
}

.form-group-default textarea.form-control {
    padding-top: 5px;
}

.form-group-default label {
    margin: 0;
    display: block;
    opacity: 1;
    cursor: text;
    -webkit-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}

.form-group-default label.label-lg {
    font-size: 13px;
    left: 13px;
    top: 9px;
}

.form-group-default label.label-sm {
    font-size: 11px;
    left: 11px;
    top: 6px;
}

.form-group-default label.highlight {
    opacity: 1;
}

.form-group-default label.fade {
    opacity: 0.5;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    font-size: 12px;
    letter-spacing: normal;
}

.form-group-default > .input-lg {
    height: 29px;
    min-height: 29px;
    padding-left: 1px;
}

.form-group-default > .input-sm {
    min-height: 18px;
    height: 18px;
}

.form-group-default.form-group-default-select {
    overflow: visible;
}

.form-group-default.form-group-default-select .ui-select-container.ui-select-bootstrap.dropdown .ui-select-match {
    padding-top: 6px;
    height: 23px;
}

.form-group-default.form-group-default-select .ui-select-container .select2-choices {
    border: 0;
}

.form-group-default.form-group-default-select2 {
    padding: 0;
}

.form-group-default.form-group-default-select2 > label {
    position: absolute;
    z-index: 10;
    padding: 5px 12px 0 9px;
}

.form-group-default.form-group-default-select2 > label.label-lg {
    left: 0;
    top: 0;
}

.form-group-default.form-group-default-select2 > label.label-sm {
    left: 0;
    top: 0;
}

.form-group-default.form-group-default-select2 .select2-container .select2-selection--single {
    padding-top: 20px;
    height: 50px;
}

.form-group-default.form-group-default-select2 .select2-container .select2-selection--single .select2-arrow b:before {
    top: 20px;
}

.form-group-default.form-group-default-select2 .select2-container .select2-selection--single .select2-chosen {
    padding-left: 3px;
    padding-top: 1px;
}

.form-group-default.form-group-default-select2 .select2-container .select2-selection--multiple {
    padding-top: 19px;
    padding-bottom: 0;
    min-height: 52px;
    border: 0px !important;
}

.form-group-default.form-group-default-select2 .select2-container .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    margin-top: 5px;
}

.form-group-default.form-group-default-select2.input-lg {
    height: auto;
    padding: 0;
}

.form-group-default.form-group-default-select2.input-lg .select2-container .select2-selection--single {
    padding-top: 26px;
    height: 58px;
}

.form-group-default.form-group-default-select2.input-lg .select2-container .select2-selection--single .select2-selection__rendered {
    font-size: 18px;
}

.form-group-default.form-group-default-select2.input-sm {
    height: auto;
    padding: 0;
}

.form-group-default.form-group-default-select2.input-sm .select2-container .select2-selection--single {
    padding-top: 21px;
    height: 49px;
}

.form-group-default.form-group-default-select2.input-sm .select2-container .select2-selection--single .select2-selection__rendered {
    font-size: 12px;
}

.form-group-default.form-group-default-selectFx {
    padding: 0;
}

.form-group-default.form-group-default-selectFx > label {
    position: absolute;
    z-index: 10;
    padding: 7px 12px 0 12px;
}

.form-group-default.form-group-default-selectFx > label.label-lg {
    left: 0;
    top: 0;
}

.form-group-default.form-group-default-selectFx > label.label-sm {
    left: 0;
    top: 0;
}

.form-group-default.form-group-default-selectFx .cs-wrapper .cs-placeholder {
    padding-top: 28px;
    height: 52px;
    padding-left: 12px;
}

.form-group-default.form-group-default-selectFx .cs-wrapper .cs-select {
    height: auto;
}

.form-group-default.form-group-default-selectFx .cs-wrapper .cs-select > span:after,
.form-group-default.form-group-default-selectFx .cs-wrapper .cs-select .cs-selected span:after {
    top: 39px;
}

.form-group-default.form-group-default-selectFx .cs-wrapper .cs-select.input-lg .cs-placeholder {
    height: 60px;
}

.form-group-default.form-group-default-selectFx .cs-wrapper .cs-select.input-sm .cs-placeholder {
    height: 50px;
}

.form-group-default.form-group-default-selectFx .cs-wrapper .dropdown-placeholder {
    vertical-align: top;
}

.form-group-default .input-group-append .input-group-text:before {
    content: "";
    width: 1px;
    height: 80%;
    top: 0px;
    left: -10px;
    position: relative;
    background-color: rgba(0, 0, 0, 0.16);
}

.form-group-default .input-group-prepend .input-group-text:before {
    content: "";
    width: 1px;
    height: 80%;
    top: 0px;
    right: -10px;
    position: relative;
    background-color: rgba(0, 0, 0, 0.16);
}

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline {
    color: #0d935b;
}

.has-success .form-control {
    border-color: #0d935b;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.has-success .form-control:focus {
    border-color: #09643e;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.has-success .form-control:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset, 0 0 0 1px rgba(0, 0, 0, 0.1), 0 -1px 0 0 rgba(0, 0, 0, 0.05) !important;
}

.has-success .input-group-addon {
    background: #f4f4f4;
    border: 1px solid rgba(33, 33, 33, 0.14);
    color: rgba(75, 75, 75, 0.47);
}

.has-success .form-control-feedback {
    color: #0d935b;
}

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline {
    color: #daab2d;
}

.has-warning .form-control {
    border-color: #daab2d;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.has-warning .form-control:focus {
    border-color: #b48c20;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.has-warning .form-control:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset, 0 0 0 1px rgba(0, 0, 0, 0.1), 0 -1px 0 0 rgba(0, 0, 0, 0.05) !important;
}

.has-warning .input-group-addon {
    background: #f4f4f4;
    border: 1px solid rgba(33, 33, 33, 0.14);
    color: rgba(75, 75, 75, 0.47);
}

.has-warning .form-control-feedback {
    color: #daab2d;
}

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline {
    color: #D83C31;
}

.has-error .form-control {
    border-color: #D83C31;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.has-error .form-control:focus {
    border-color: #b42c22;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.has-error .form-control:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset, 0 0 0 1px rgba(0, 0, 0, 0.1), 0 -1px 0 0 rgba(0, 0, 0, 0.05) !important;
}

.has-error .input-group-addon {
    background: #f4f4f4;
    border: 1px solid rgba(33, 33, 33, 0.14);
    color: rgba(75, 75, 75, 0.47);
}

.has-error .form-control-feedback {
    color: #D83C31;
}

label.error {
    font-size: 12px;
    color: #b91e1e;
    display: block;
}

.validation-popover {
    background: #000;
    -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px;
}

.validation-popover .popover-body {
    padding: 4px 8px;
    font-size: 12px;
    line-height: 1.4;
    color: #fff;
}

.validation-popover > .arrow::after {
    border-top-color: #000;
}

/* Datepicker: https://github.com/eternicode/bootstrap-datepicker */
.datepicker {
    padding: 9px;
    border-radius: 2px;
    font-size: 12px;
}

.datepicker.dropdown-menu {
    -webkit-box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px,
    rgba(15, 15, 15, 0.1) 0px 3px 6px,
    rgba(15, 15, 15, 0.2) 0px 9px 24px;
    box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px,
    rgba(15, 15, 15, 0.1) 0px 3px 6px,
    rgba(15, 15, 15, 0.2) 0px 9px 24px;
}

.datepicker:after {
    border-bottom-color: #fff;
}

.datepicker thead tr .datepicker-switch {
    color: #757575;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.006em;
}

.datepicker thead tr .next,
.datepicker thead tr .prev {
    color: #F47104;
    content: "";
    font-size: 0px;
}

.datepicker thead tr .next:before,
.datepicker thead tr .prev:before {
    color: #F47104;
    font-family: "Font Awesome 5 Pro";
    font-size: 18px;
}

.datepicker thead tr .prev:before {
    content: "\f053";
}

.datepicker thead tr .next:before {
    content: "\f054";
}

.datepicker thead tr .dow {
    color: #212121;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0em;
    border-bottom: 1px solid #d0d0d0;
}

.datepicker thead tr th {
    width: 34px;
    height: 29px;
}

.datepicker table {
    height: 250px;
}

.datepicker table tr td {
    padding-bottom: 14px;
    width: 31px;
    height: 29px;
}

.datepicker table tr td.day {
    border-top: 1px solid rgba(33, 33, 33, 0.14);
    position: relative;
    color: #212121;
    font-size: 12px;
}

.datepicker table tr td.day:hover:not(.active) {
    background-color: transparent;
    z-index: 1;
}

.datepicker table tr td.day:hover:not(.active):before {
    content: "";
    width: 24px;
    height: 24px;
    background-color: transparent;
    border-radius: 50%;
    -webkit-box-shadow: 0px 0px 0px 1px #757575;
    box-shadow: 0px 0px 0px 1px #757575;
    display: block;
    position: absolute;
    top: 2px;
    left: 5px;
    z-index: -1;
}

.datepicker table tr td.active {
    background-color: transparent !important;
    z-index: 1;
    cursor: default !important;
    border-color: rgba(33, 33, 33, 0.14) !important;
}

.datepicker table tr td.active:before {
    content: "";
    width: 24px;
    height: 24px;
    background-color: #F47104;
    border-radius: 50%;
    display: block;
    position: absolute;
    top: 2px;
    left: 5px;
    z-index: -1;
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover {
    background-image: none;
    text-shadow: none;
    font-weight: 600;
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover {
    background-color: #f4f4f4;
    background-image: none;
    color: #fff;
}

.datepicker table tr td.disabled {
    color: rgba(33, 33, 33, 0.62);
    font-weight: 500;
    position: relative;
    opacity: 0.78;
}

.datepicker table tr td.disabled:before {
    display: none !important;
}

.datepicker table tr td.disabled:after {
    content: "";
    display: block;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border: 2px solid #fff;
    position: absolute;
    top: 1px;
    left: 1px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARBAMAAADJQ1rJAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAYUExURQAAAEdwTAAAAAAAAAAAAAAAAAAAAAAAAKkycPQAAAAIdFJOU0AACuuWFpQXdpvuhwAAAFRJREFUCNc1zLEJgEAAQ9GIC9y3sVUQa0ewsdcVBFdwfsNd7D4PEnXwzlA2wXgDvfRTUahzNaIo5Aq5QkwKDbtCy6nQ4ZdGl6vS422l9XKFXCFXCH14sRAYdHQ86wAAAABJRU5ErkJggg==);
    background-repeat: repeat;
    background-size: 17px 15px;
    opacity: 0.47;
}

.datepicker table tr td.disabled:hover {
    background-color: transparent;
    cursor: default;
    color: #616161;
}

.datepicker table tr td.old,
.datepicker table tr td.new {
    color: #757575;
    opacity: 0.67;
    font-weight: 400;
    border-top: 1px solid transparent;
    pointer-events: none;
}

.datepicker table tr td.old:after,
.datepicker table tr td.new:after {
    opacity: 0;
}

.datepicker table tr td.old:before,
.datepicker table tr td.new:before {
    display: none;
}

.datepicker table tr td span {
    border-radius: 1px;
    width: 48px;
    height: 42px;
    line-height: 40px;
    font-weight: 500;
    font-size: 12px;
    border-top: 1px solid rgba(33, 33, 33, 0.14);
    margin: 0;
}

.datepicker table tr td span.active {
    background-color: #F47104 !important;
}

.datepicker table tr td span.active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover {
    background-image: none;
    border: none;
    text-shadow: none;
}

.datepicker table tbody tr td {
    padding-bottom: 6px;
}

.datepicker table tbody tr .odd {
    color: #d0d3d8;
}

.datepicker table tbody tr:first-child td.day {
    padding-top: 14px;
    padding-bottom: 6px;
}

.datepicker table tbody tr:first-child td.day:hover:before {
    top: 12px;
    left: 4px;
}

.datepicker.dropdown-menu {
    border-color: #e0e0e0;
    color: #4b4b4b;
}

.datepicker.datepicker-dropdown.datepicker-orient-bottom:before {
    border-color: #e0e0e0;
}

.datepicker-inline {
    width: auto;
}

.input-daterange .input-group-addon {
    text-shadow: none;
    border: 0;
    margin: 0;
}

/* Timepicker: https://github.com/m3wolf/bootstrap3-timepicker */
.bootstrap-timepicker-widget table td a i {
    font-size: 12px;
}

.bootstrap-timepicker-widget a.btn,
.bootstrap-timepicker-widget .bootstrap-timepicker-widget input {
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

.bootstrap-timepicker-widget.dropdown-menu {
    background: #fff;
}

/* Daterangepicker: http://www.dangrossman.info */
.daterangepicker {
    background: #fff;
}

.daterangepicker .calendar .calendar-date {
    border: 1px solid rgba(33, 33, 33, 0.14);
}

.daterangepicker .calendar .prev,
.daterangepicker .calendar .next,
.daterangepicker .calendar th {
    color: #F47104;
    text-transform: uppercase;
    font-size: 11px;
}

.daterangepicker .calendar .month {
    color: #6f7b8a;
    font-size: 12px;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: #F47104;
    border-color: #F47104;
}

/* Select2: http://ivaynberg.github.io/select2 */
.form-group-default .select2-container .select2-selection,
.select2-container-multi .select2-choices {
    border-color: transparent;
}

select.full-width + .select2-container {
    width: 100% !important;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    background: #fafafa;
    cursor: not-allowed;
}

.select2-container *:focus {
    outline: none;
}

.select2-container .select2-selection {
    background-image: none;
    border-radius: 2px;
    border: 1px solid rgba(33, 33, 33, 0.14);
    padding: 2px 9px;
    -webkit-transition: border 0.2s linear 0s;
    -o-transition: border 0.2s linear 0s;
    transition: border 0.2s linear 0s;
    min-height: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.select2-container .select2-selection .select2-selection__rendered {
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    color: #212121;
}

.select2-container .select2-selection .select2-selection__rendered .select2-selection__clear {
    font-weight: normal;
    right: 16px;
    width: 20px;
    text-align: center;
    color: #888;
}

.select2-container .select2-selection .select2-selection__arrow {
    top: auto;
    bottom: 5px;
    right: 5px !important;
    left: auto;
    background: transparent;
    border-left: 0px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.select2-container .select2-selection.select2-selection--single {
    height: 35px;
}

.select2-container .select2-selection > .select2-chosen {
    margin-right: 26px;
    margin-left: 0;
}

.select2-container.select2-drop-above .select2-choice {
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
}

.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: transparent;
}

.select2-container--default .select2-results__group {
    color: #212121;
}

.select2-search input,
.select2-search-choice-close,
.select2-container .select2-choice abbr,
.select2-container .select2-choice .select2-arrow b {
    background-image: none !important;
}

.select2-dropdown-open.select2-drop-above .select2-choice,
.select2-dropdown-open.select2-drop-above .select2-choices {
    background-image: none !important;
    border: 1px solid rgba(33, 33, 33, 0.14);
    background: #f4f4f4;
}

.select2-dropdown-open .select2-choice .select2-arrow {
    -webkit-transform: scale(scale(1, -1));
    -ms-transform: scale(scale(1, -1));
    transform: scale(scale(1, -1));
}

.select2-dropdown {
    border: 1px solid rgba(33, 33, 33, 0.14);
    border-bottom: none;
    border-radius: 2px;
    padding-top: 0px;
}

.select2-dropdown.select2-drop-above {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.select2-container--open .select2-selection {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid #F47104 !important;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}

.select2-container--open .select2-dropdown {
    top: 1px;
}

.select2-search--dropdown {
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 4px;
}

.select2-search--dropdown input {
    background: #fff !important;
    vertical-align: baseline;
    line-height: 28px;
    border-radius: 2px;
    border: none;
    font-size: 12px;
    border: 1px solid rgba(33, 33, 33, 0.14) !important;
}

.select2-results {
    margin: 3px 8px 10px 8px;
}

.select2-results li {
    color: #4b4b4b;
}

.select2-results li.select2-result-with-children > .select2-result-label {
    color: #212121;
}

.select2-results li.select2-result-with-children > .select2-result-label:first-child {
    padding-top: 8px;
}

.select2-results .select2-results__option--highlighted {
    background-color: #f6f9fc !important;
    border-radius: 3px;
    color: #4b4b4b !important;
}

.select2-results .select2-no-results,
.select2-results .select2-searching,
.select2-results .select2-selection-limit {
    background: none;
    color: #4b4b4b;
    font-size: 12px;
    padding-left: 8px;
    padding-top: 0px;
    position: relative;
    top: -5px;
}

.select2-dropdown {
    border: 1px solid rgba(33, 33, 33, 0.14);
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    padding-top: 5px;
    z-index: 890;
    -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
}

.select2-container--open
.select2-selection--multiple
.select2-selection__choice {
    background-color: #fff !important;
}

.select2-selection--multiple .select2-selection__rendered {
    background-image: none;
}

.select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    background-color: #e0e0e0;
    background-image: none;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: inherit;
    border-radius: 99px;
    margin: 0px 6px 0px 0;
    padding: 0 8px 0 7px;
    line-height: 21px;
}

.select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
    color: #626262;
    font-weight: 900;
    margin-right: 4px;
    position: relative;
    top: -1px;
}

.select2-selection--multiple.select2-container-active .select2-choices {
    border: 1px solid rgba(33, 33, 33, 0.14);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.select2-selection--multiple .select2-search-choice-close {
    left: 6px;
}

.select2-search-choice-close {
    background: none;
    top: 4px;
    right: 0;
}

.select2-search-choice-close:hover {
    text-decoration: none;
}

.select2-drop-multi .select2-results .select2-no-results,
.select2-drop-multi .select2-results .select2-searching,
.select2-drop-multi .select2-results .select2-selection-limit {
    top: 0px;
}

.select2.form-control {
    padding: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
}

.select2-drop-mask {
    z-index: 700;
}

.ui-select-bootstrap .ui-select-choices-row.active > span {
    background: #f4f4f4;
    border-radius: 3px;
    color: #4b4b4b;
}

.ui-select-bootstrap > .ui-select-choices {
    background-color: #fff;
}

.ui-select-choices-group-label {
    color: #212121;
    font-weight: bold;
}

/*.modal-open .select2-drop-active {
  z-index: 1051;
}
.modal-open .select2-container {
  z-index: 1051;
}
.modal-open .datepicker.dropdown-menu {
  z-index: 1051 !important;
}
.modal-open .select2-drop-mask {
  z-index: 1050;
}
.modal-open .cs-skin-slide.cs-active {
  z-index: 1050;
}*/
.dropdown-placeholder {
    display: inline-block;
    vertical-align: middle;
}

.dropdown-mask {
    bottom: 0;
    display: none;
    left: 0;
    outline: 0 none;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 600;
}

.ui-select-bootstrap *:focus {
    outline: none;
}

.ui-select-bootstrap .ui-select-choices-row > span {
    padding-top: 6px;
    padding-bottom: 6px;
    line-height: 24px;
    font-size: 14px;
}

.ui-select-bootstrap .ui-select-match {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.ui-select-bootstrap .ui-select-choices-group-label {
    padding-left: 15px;
    line-height: 24px;
    font-size: 14px;
    font-weight: 700;
    color: #626262;
}

.ui-select-bootstrap .ui-select-match.btn-default-focus {
    background-color: transparent;
}

.form-group-default-select {
    padding-bottom: 2px;
}

.form-group-default-select .ui-select-bootstrap .ui-select-dropdown {
    width: calc(100% + 24px) !important;
    margin-left: -12px;
    padding: 10px;
}

.form-group-default-select .ui-select-bootstrap .ui-select-match-text {
    width: calc(100% + 24px);
    margin-top: -17px;
    margin-left: -16px;
    padding: 16px 16px 0;
}

.form-group-default-select .ui-select-bootstrap .ui-select-match {
    padding-top: 2px !important;
}

.form-group-default-select .ui-select-bootstrap .ui-select-match i.caret {
    margin-top: 10px;
}

.form-group-default-select .ui-select-bootstrap .ui-select-match.btn-default-focus {
    outline: none;
}

.form-group-default-select .ui-select-bootstrap .ui-select-match > .ui-select-toggle {
    width: calc(100% + 27px);
    height: 50px;
    margin-top: -34px;
    margin-left: -16px;
    padding: 32px 16px 16px;
}

.form-group-default-select .ui-select-bootstrap .dropdown-menu .divider {
    display: none;
}

.form-group-default-select .ui-select-bootstrap.ui-select-container {
    margin-top: -3px;
    padding-bottom: 2px;
}

.form-group-default-select .ui-select-multiple {
    margin-top: -7px;
}

.form-group-default-select .ui-select-multiple .select2-search-field input {
    height: 23px !important;
}

.form-group-default-select .ui-select-multiple .select2-search-choice {
    margin-top: 2px;
    margin-bottom: 0;
}

.form-group-default-select .ui-select-multiple .select2-search-choice:first-child {
    margin-left: 0;
}

.form-group-default-select .select2-container-multi .select2-choices {
    background-color: transparent;
}

/* Bootstrap Tags input: https://github.com/timschlechter/bootstrap-tagsinput */
.form-group-default .bootstrap-tagsinput {
    border: 0px;
    padding-left: 0;
    margin-bottom: 0;
    padding-top: 0;
    vertical-align: top;
    padding-bottom: 0px;
    padding-left: 0;
    margin-top: -3px;
}

.form-group-default .bootstrap-tagsinput .tag {
    padding: 2px 9px;
    line-height: 18px;
    margin-bottom: 2px;
    margin-left: 0;
    margin-right: 2px;
}

.form-group-default .bootstrap-tagsinput input {
    min-height: 20px;
}

.form-group-default .bootstrap-tagsinput input:first-child {
    margin-left: 0;
}

.bootstrap-tagsinput {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    background-color: transparent;
    border: 1px solid rgba(33, 33, 33, 0.14);
    border-radius: 4px;
    padding: 0;
    padding-top: 5px;
    padding-right: 5px;
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 100%;
    -webkit-transition: background 0.2s linear 0s;
    -o-transition: background 0.2s linear 0s;
    transition: background 0.2s linear 0s;
}

.bootstrap-tagsinput.active-element {
    background-color: #e0e0e0;
}

.bootstrap-tagsinput input {
    border: none;
    margin: 5px;
    margin-top: 0;
    margin-right: 0;
    min-height: 25px;
    min-width: 10em !important;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    -webkit-flex-shrink: 0;
    -webkit-flex-grow: 1;
    -webkit-flex-basis: auto;
}

.bootstrap-tagsinput .tag {
    padding: 3px 9px;
    padding-right: 6px;
    border-radius: 3px;
    line-height: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 5px;
    margin-top: 0;
    margin-right: 0;
}

.bootstrap-tagsinput .tag [data-role="remove"] {
    margin-left: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.bootstrap-tagsinput .tag[data-role="remove"]:hover:active,
.bootstrap-tagsinput .tag [data-role="remove"]:hover {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.bootstrap-tagsinput .tag [data-role="remove"]:after {
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    content: "\f00d";
    padding: 0;
    font-size: 12px;
}

/* Quill Editor: https://github.com/quilljs/quill */
.ql-container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    height: 100%;
    margin: 0px;
    position: relative;
}

.ql-container.ql-disabled .ql-tooltip {
    visibility: hidden;
}

.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
    pointer-events: none;
}

.ql-clipboard {
    left: -100000px;
    height: 1px;
    overflow-y: hidden;
    position: absolute;
    top: 50%;
}

.ql-clipboard p {
    margin: 0;
    padding: 0;
}

.ql-editor {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1.42;
    height: 100%;
    outline: none;
    overflow-y: auto;
    padding: 12px 15px;
    -o-tab-size: 4;
    tab-size: 4;
    -moz-tab-size: 4;
    text-align: left;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.ql-editor > * {
    cursor: text;
}

.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
    margin: 0;
    padding: 0;
    counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}

.ql-editor ol,
.ql-editor ul {
    padding-left: 1.5em;
}

.ql-editor ol > li {
    list-style-type: none;
}

.ql-editor ul > li {
    list-style-type: none;
}

.ql-editor ul > li::before {
    content: "\2022";
}

.ql-editor ul[data-checked="true"],
.ql-editor ul[data-checked="false"] {
    pointer-events: none;
}

.ql-editor ul[data-checked="true"] > li *,
.ql-editor ul[data-checked="false"] > li * {
    pointer-events: all;
}

.ql-editor ul[data-checked="true"] > li::before,
.ql-editor ul[data-checked="false"] > li::before {
    color: #777;
    cursor: pointer;
    pointer-events: all;
}

.ql-editor ul[data-checked="true"] > li::before {
    content: "\2611";
}

.ql-editor ul[data-checked="false"] > li::before {
    content: "\2610";
}

.ql-editor li::before {
    display: inline-block;
    white-space: nowrap;
    width: 1.2em;
}

.ql-editor li:not(.ql-direction-rtl)::before {
    margin-left: -1.5em;
    margin-right: 0.3em;
    text-align: right;
}

.ql-editor li.ql-direction-rtl::before {
    margin-left: 0.3em;
    margin-right: -1.5em;
}

.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
    padding-left: 1.5em;
}

.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
    padding-right: 1.5em;
}

.ql-editor ol li {
    counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
    counter-increment: list-0;
}

.ql-editor ol li:before {
    content: counter(list-0, decimal) ". ";
}

.ql-editor ol li.ql-indent-1 {
    counter-increment: list-1;
    counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}

.ql-editor ol li.ql-indent-1:before {
    content: counter(list-1, lower-alpha) ". ";
}

.ql-editor ol li.ql-indent-2 {
    counter-increment: list-2;
    counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}

.ql-editor ol li.ql-indent-2:before {
    content: counter(list-2, lower-roman) ". ";
}

.ql-editor ol li.ql-indent-3 {
    counter-increment: list-3;
    counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}

.ql-editor ol li.ql-indent-3:before {
    content: counter(list-3, decimal) ". ";
}

.ql-editor ol li.ql-indent-4 {
    counter-increment: list-4;
    counter-reset: list-5 list-6 list-7 list-8 list-9;
}

.ql-editor ol li.ql-indent-4:before {
    content: counter(list-4, lower-alpha) ". ";
}

.ql-editor ol li.ql-indent-5 {
    counter-increment: list-5;
    counter-reset: list-6 list-7 list-8 list-9;
}

.ql-editor ol li.ql-indent-5:before {
    content: counter(list-5, lower-roman) ". ";
}

.ql-editor ol li.ql-indent-6 {
    counter-increment: list-6;
    counter-reset: list-7 list-8 list-9;
}

.ql-editor ol li.ql-indent-6:before {
    content: counter(list-6, decimal) ". ";
}

.ql-editor ol li.ql-indent-7 {
    counter-increment: list-7;
    counter-reset: list-8 list-9;
}

.ql-editor ol li.ql-indent-7:before {
    content: counter(list-7, lower-alpha) ". ";
}

.ql-editor ol li.ql-indent-8 {
    counter-increment: list-8;
    counter-reset: list-9;
}

.ql-editor ol li.ql-indent-8:before {
    content: counter(list-8, lower-roman) ". ";
}

.ql-editor ol li.ql-indent-9 {
    counter-increment: list-9;
}

.ql-editor ol li.ql-indent-9:before {
    content: counter(list-9, decimal) ". ";
}

.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 3em;
}

.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 4.5em;
}

.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 3em;
}

.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
    padding-right: 4.5em;
}

.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 6em;
}

.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 7.5em;
}

.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 6em;
}

.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
    padding-right: 7.5em;
}

.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 9em;
}

.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 10.5em;
}

.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 9em;
}

.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
    padding-right: 10.5em;
}

.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 12em;
}

.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 13.5em;
}

.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 12em;
}

.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
    padding-right: 13.5em;
}

.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 15em;
}

.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 16.5em;
}

.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 15em;
}

.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
    padding-right: 16.5em;
}

.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 18em;
}

.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 19.5em;
}

.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 18em;
}

.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
    padding-right: 19.5em;
}

.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 21em;
}

.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 22.5em;
}

.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 21em;
}

.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
    padding-right: 22.5em;
}

.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 24em;
}

.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 25.5em;
}

.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 24em;
}

.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
    padding-right: 25.5em;
}

.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 27em;
}

.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
    padding-left: 28.5em;
}

.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 27em;
}

.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
    padding-right: 28.5em;
}

.ql-editor .ql-video {
    display: block;
    max-width: 100%;
}

.ql-editor .ql-video.ql-align-center {
    margin: 0 auto;
}

.ql-editor .ql-video.ql-align-right {
    margin: 0 0 0 auto;
}

.ql-editor .ql-bg-black {
    background-color: #000;
}

.ql-editor .ql-bg-red {
    background-color: #e60000;
}

.ql-editor .ql-bg-orange {
    background-color: #f90;
}

.ql-editor .ql-bg-yellow {
    background-color: #ff0;
}

.ql-editor .ql-bg-green {
    background-color: #008a00;
}

.ql-editor .ql-bg-blue {
    background-color: #06c;
}

.ql-editor .ql-bg-purple {
    background-color: #93f;
}

.ql-editor .ql-color-white {
    color: #fff;
}

.ql-editor .ql-color-red {
    color: #e60000;
}

.ql-editor .ql-color-orange {
    color: #f90;
}

.ql-editor .ql-color-yellow {
    color: #ff0;
}

.ql-editor .ql-color-green {
    color: #008a00;
}

.ql-editor .ql-color-blue {
    color: #06c;
}

.ql-editor .ql-color-purple {
    color: #93f;
}

.ql-editor .ql-font-serif {
    font-family: Georgia, Times New Roman, serif;
}

.ql-editor .ql-font-monospace {
    font-family: Monaco, Courier New, monospace;
}

.ql-editor .ql-size-small {
    font-size: 0.75em;
}

.ql-editor .ql-size-large {
    font-size: 1.5em;
}

.ql-editor .ql-size-huge {
    font-size: 2.5em;
}

.ql-editor .ql-direction-rtl {
    direction: rtl;
    text-align: inherit;
}

.ql-editor .ql-align-center {
    text-align: center;
}

.ql-editor .ql-align-justify {
    text-align: justify;
}

.ql-editor .ql-align-right {
    text-align: right;
}

.ql-editor.ql-blank::before {
    color: rgba(0, 0, 0, 0.6);
    content: attr(data-placeholder);
    font-style: italic;
    left: 15px;
    pointer-events: none;
    position: absolute;
    right: 15px;
}

.ql-snow {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
    clear: both;
    content: "";
    display: table;
}

.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
    background: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    float: left;
    height: 24px;
    padding: 3px 5px;
    width: 28px;
}

.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
    float: left;
    height: 100%;
}

.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
    outline: none;
}

.ql-snow.ql-toolbar input.ql-image[type="file"],
.ql-snow .ql-toolbar input.ql-image[type="file"] {
    display: none;
}

.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
    color: #06c;
}

.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
    fill: #06c;
}

.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
    stroke: #06c;
}

.ql-snow * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.ql-snow .ql-hidden {
    display: none;
}

.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
    visibility: hidden;
}

.ql-snow .ql-tooltip {
    position: absolute;
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
}

.ql-snow .ql-tooltip a {
    cursor: pointer;
    text-decoration: none;
}

.ql-snow .ql-tooltip.ql-flip {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
}

.ql-snow .ql-formats {
    display: inline-block;
    vertical-align: middle;
}

.ql-snow .ql-formats:after {
    clear: both;
    content: "";
    display: table;
}

.ql-snow .ql-stroke {
    fill: none;
    stroke: #444;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.ql-snow .ql-stroke-miter {
    fill: none;
    stroke: #444;
    stroke-miterlimit: 10;
    stroke-width: 2;
}

.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
    fill: #444;
}

.ql-snow .ql-empty {
    fill: none;
}

.ql-snow .ql-even {
    fill-rule: evenodd;
}

.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
    stroke-width: 1;
}

.ql-snow .ql-transparent {
    opacity: 0.4;
}

.ql-snow .ql-direction svg:last-child {
    display: none;
}

.ql-snow .ql-direction.ql-active svg:last-child {
    display: inline;
}

.ql-snow .ql-direction.ql-active svg:first-child {
    display: none;
}

.ql-snow .ql-editor h1 {
    font-size: 2em;
}

.ql-snow .ql-editor h2 {
    font-size: 1.5em;
}

.ql-snow .ql-editor h3 {
    font-size: 1.17em;
}

.ql-snow .ql-editor h4 {
    font-size: 1em;
}

.ql-snow .ql-editor h5 {
    font-size: 0.83em;
}

.ql-snow .ql-editor h6 {
    font-size: 0.67em;
}

.ql-snow .ql-editor a {
    text-decoration: underline;
}

.ql-snow .ql-editor blockquote {
    border-left: 4px solid #ccc;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 16px;
}

.ql-snow .ql-editor code {
    background-color: #f0f0f0;
    border-radius: 3px;
}

.ql-snow .ql-editor pre {
    background-color: #f0f0f0;
    border-radius: 3px;
    white-space: pre-wrap;
    margin-bottom: 5px;
    margin-top: 5px;
    padding: 5px 10px;
}

.ql-snow .ql-editor code {
    font-size: 85%;
    padding: 2px 4px;
}

.ql-snow .ql-editor pre.ql-syntax {
    background-color: #23241f;
    color: #f8f8f2;
    overflow: visible;
}

.ql-snow .ql-editor img {
    max-width: 100%;
}

.ql-snow .ql-picker {
    color: #444;
    display: inline-block;
    float: left;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    position: relative;
    vertical-align: middle;
}

.ql-snow .ql-picker-label {
    cursor: pointer;
    display: inline-block;
    height: 100%;
    padding-left: 8px;
    padding-right: 2px;
    position: relative;
    width: 100%;
}

.ql-snow .ql-picker-label::before {
    display: inline-block;
    line-height: 22px;
}

.ql-snow .ql-picker-options {
    background-color: #fff;
    display: none;
    min-width: 100%;
    padding: 4px 8px;
    position: absolute;
    white-space: nowrap;
}

.ql-snow .ql-picker-options .ql-picker-item {
    cursor: pointer;
    display: block;
    padding-bottom: 5px;
    padding-top: 5px;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label {
    color: #ccc;
    z-index: 2;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
    fill: #ccc;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
    stroke: #ccc;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    display: block;
    margin-top: -1px;
    top: 100%;
    z-index: 1;
}

.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
    width: 28px;
}

.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
    padding: 2px 4px;
}

.ql-snow .ql-color-picker .ql-picker-label svg {
    right: 4px;
}

.ql-snow .ql-icon-picker .ql-picker-label svg {
    right: 4px;
}

.ql-snow .ql-icon-picker .ql-picker-options {
    padding: 4px 0px;
}

.ql-snow .ql-icon-picker .ql-picker-item {
    height: 24px;
    width: 24px;
    padding: 2px 4px;
}

.ql-snow .ql-color-picker .ql-picker-options {
    padding: 3px 5px;
    width: 152px;
}

.ql-snow .ql-color-picker .ql-picker-item {
    border: 1px solid transparent;
    float: left;
    height: 16px;
    margin: 2px;
    padding: 0px;
    width: 16px;
}

.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
    position: absolute;
    margin-top: -9px;
    right: 0;
    top: 50%;
    width: 18px;
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""])::before {
    content: attr(data-label);
}

.ql-snow .ql-picker.ql-header {
    width: 98px;
}

.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
    content: "Normal";
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
    content: "Heading 1";
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
    content: "Heading 2";
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
    content: "Heading 3";
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
    content: "Heading 4";
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
    content: "Heading 5";
}

.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before {
    content: "Heading 6";
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
    content: "Heading 6";
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
    font-size: 2em;
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
    font-size: 1.5em;
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
    font-size: 1.17em;
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
    font-size: 1em;
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
    font-size: 0.83em;
}

.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
    font-size: 0.67em;
}

.ql-snow .ql-picker.ql-font {
    width: 108px;
}

.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
    content: "Sans Serif";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
    content: "Serif";
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before {
    content: "Monospace";
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
    content: "Monospace";
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
    font-family: Georgia, Times New Roman, serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
    font-family: Monaco, Courier New, monospace;
}

.ql-snow .ql-picker.ql-size {
    width: 98px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
    content: "Normal";
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
    content: "Small";
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
    content: "Large";
}

.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before {
    content: "Huge";
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
    content: "Huge";
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
    font-size: 10px;
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
    font-size: 18px;
}

.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
    font-size: 32px;
}

.ql-snow .ql-color-picker.ql-background .ql-picker-item {
    background-color: #fff;
}

.ql-snow .ql-color-picker.ql-color .ql-picker-item {
    background-color: #000;
}

@media (pointer: coarse) {
    .ql-snow.ql-toolbar button:hover:not(.ql-active),
    .ql-snow .ql-toolbar button:hover:not(.ql-active) {
        color: #444;
    }

    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
        fill: #444;
    }

    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
        stroke: #444;
    }
}

.ql-toolbar.ql-snow {
    border: 1px solid #ccc;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    padding: 8px;
}

.ql-toolbar.ql-snow .ql-formats {
    margin-right: 15px;
}

.ql-toolbar.ql-snow .ql-picker-label {
    border: 1px solid transparent;
}

.ql-toolbar.ql-snow .ql-picker-options {
    border: 1px solid transparent;
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 8px;
    box-shadow: rgba(0, 0, 0, 0.2) 0 2px 8px;
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    border-color: #ccc;
}

.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
    border-color: #000;
}

.ql-toolbar.ql-snow + .ql-container.ql-snow {
    border-top: 0px;
}

.ql-snow .ql-tooltip {
    background-color: #fff;
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 5px #ddd;
    box-shadow: 0px 0px 5px #ddd;
    color: #444;
    padding: 5px 12px;
    white-space: nowrap;
}

.ql-snow .ql-tooltip::before {
    content: "Visit URL:";
    line-height: 26px;
    margin-right: 8px;
}

.ql-snow .ql-tooltip input[type="text"] {
    display: none;
    border: 1px solid #ccc;
    font-size: 12px;
    height: 26px;
    margin: 0px;
    padding: 3px 5px;
    width: 170px;
}

.ql-snow .ql-tooltip a {
    line-height: 26px;
}

.ql-snow .ql-tooltip a.ql-preview {
    display: inline-block;
    max-width: 200px;
    overflow-x: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    vertical-align: top;
}

.ql-snow .ql-tooltip a.ql-action::after {
    border-right: 1px solid #ccc;
    content: "Edit";
    margin-left: 16px;
    padding-right: 8px;
}

.ql-snow .ql-tooltip a.ql-remove::before {
    content: "Remove";
    margin-left: 8px;
}

.ql-snow .ql-tooltip.ql-editing a.ql-preview, .ql-snow .ql-tooltip.ql-editing a.ql-remove {
    display: none;
}

.ql-snow .ql-tooltip.ql-editing input[type="text"] {
    display: inline-block;
}

.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
    border-right: 0px;
    content: "Save";
    padding-right: 0px;
}

.ql-snow .ql-tooltip[data-mode="link"]::before {
    content: "Enter link:";
}

.ql-snow .ql-tooltip[data-mode="formula"]::before {
    content: "Enter formula:";
}

.ql-snow .ql-tooltip[data-mode="video"]::before {
    content: "Enter video:";
}

.ql-snow a {
    color: #06c;
}

.ql-container.ql-snow {
    border: 1px solid #ccc;
}

#quill {
    height: 200px;
}

/* SelectFx */
div.cs-select {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    text-align: left;
    background: #fff;
    width: 100%;
    max-width: 500px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

div.cs-select:focus {
    outline: none;
}

.cs-select select {
    display: none;
}

.cs-select span {
    display: block;
    position: relative;
    cursor: pointer;
    padding: 1em;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.cs-select > span {
    padding-right: 3em;
}

.cs-select > span::after,
.cs-select .cs-selected span::after {
    speak: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cs-select > span::after {
    content: "\25BE";
    right: 1em;
}

.cs-select .cs-selected span::after {
    content: "\2713";
    margin-left: 1em;
}

.cs-select.cs-active > span::after {
    -webkit-transform: translateY(-50%) rotate(180deg);
    -ms-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg);
}

.cs-select .cs-options {
    position: absolute;
    overflow: hidden;
    width: 100%;
    background: #fff;
    visibility: hidden;
}

.cs-select.cs-active .cs-options {
    visibility: visible;
}

.cs-select ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.cs-select ul span {
    padding: 1em;
}

.cs-select ul li.cs-focus span {
    background-color: #ddd;
}

.cs-select li.cs-optgroup ul {
    padding-left: 1em;
}

.cs-select li.cs-optgroup > span {
    cursor: default;
}

div.cs-skin-slide {
    color: #fff;
    width: 300px;
}

@media screen and (max-width: 30em) {
    div.cs-skin-slide {
        font-size: 1em;
        width: 250px;
    }
}

div.cs-skin-slide::before {
    content: "";
    background: #282b30;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    -o-transition: transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
}

.cs-skin-slide.cs-active::before {
    -webkit-transform: scale3d(1.1, 3.5, 1);
    transform: scale3d(1.1, 3.5, 1);
}

.cs-skin-slide > span {
    height: 80px;
    line-height: 32px;
    -webkit-transition: text-indent 0.3s, opacity 0.3s;
    -o-transition: text-indent 0.3s, opacity 0.3s;
    transition: text-indent 0.3s, opacity 0.3s;
}

@media screen and (max-width: 30em) {
    .cs-skin-slide > span {
        height: 60px;
        line-height: 28px;
    }
}

.cs-skin-slide.cs-active > span {
    text-indent: -290px;
    opacity: 0;
}

.cs-skin-slide.cs-active > span::after {
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
}

.cs-skin-slide .cs-options {
    background: transparent;
    width: 70%;
    height: 400%;
    padding: 1.9em 0;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate(-50%, -50%);
}

@media screen and (max-width: 30em) {
    .cs-skin-slide .cs-options {
        padding-top: 3em;
    }
}

.cs-skin-slide .cs-options li {
    opacity: 0;
    -webkit-transform: translate3d(30%, 0, 0);
    transform: translate3d(30%, 0, 0);
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s;
}

.cs-skin-slide.cs-active .cs-options li {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
}

.cs-skin-slide.cs-active .cs-options li:first-child {
    -webkit-transition-delay: 0.05s;
    -o-transition-delay: 0.05s;
    transition-delay: 0.05s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(2) {
    -webkit-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(3) {
    -webkit-transition-delay: 0.15s;
    -o-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(4) {
    -webkit-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(5) {
    -webkit-transition-delay: 0.25s;
    -o-transition-delay: 0.25s;
    transition-delay: 0.25s;
}

.cs-skin-slide .cs-options li span {
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 2px;
    font-size: 65%;
    padding: 0.8em 1em 0.8em 2.5em;
}

.cs-skin-slide .cs-options li span:hover,
.cs-skin-slide .cs-options li.cs-focus span,
.cs-skin-slide .cs-options li.cs-selected span {
    color: #eb7e7f;
    background: transparent;
}

.cs-skin-slide .cs-selected span::after {
    content: "";
}

.form-group-default .cs-skin-slide > span {
    padding: 0 30px 0 0;
    height: 22px;
    line-height: 21px;
}

.form-group-default .cs-wrapper {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.cs-wrapper {
    display: inline-block;
}

.form-control.cs-select:not(.cs-active) {
    width: 100% !important;
}

.cs-select {
    background-color: transparent;
}

.cs-select span {
    -o-text-overflow: initial;
    text-overflow: initial;
}

.cs-select .cs-placeholder {
    width: 100%;
}

div.cs-skin-slide {
    width: auto;
    color: #5e5e5e;
}

div.cs-skin-slide:before {
    background-color: transparent;
}

div.cs-skin-slide.cs-transparent {
    background: none;
}

div.cs-skin-slide.cs-transparent .cs-backdrop {
    border-color: transparent;
    background: none;
}

div.cs-skin-slide.cs-transparent.cs-active .cs-backdrop {
    background: #fff;
}

div.cs-skin-slide > span {
    height: 35px;
    padding: 6px 33px 6px 17px;
    line-height: 23px;
    z-index: 1;
}

div.cs-skin-slide.cs-active {
    z-index: 790;
}

div.cs-skin-slide.cs-active:before {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}

div.cs-skin-slide.cs-active .cs-backdrop {
    border: transparent;
    background: #fff;
    -webkit-box-shadow: -1px 0 1px #ccc, 1px 0 1px #ccc;
    box-shadow: -1px 0 1px #ccc, 1px 0 1px #ccc;
}

div.cs-skin-slide > span:after,
div.cs-skin-slide.cs-active > span:after {
    content: "\f067";
    font-family: "Font Awesome 5 Pro";
    color: #5e5e5e;
    font-size: 14px;
    position: absolute;
    right: 12px;
}

div.cs-skin-slide .cs-options {
    height: auto;
    padding: 9px 0;
    width: auto;
    padding: 10px;
    max-height: 350px;
    -webkit-transform: translate3d(1, 1, 1);
    transform: translate3d(1, 1, 1);
    overflow: hidden;
    z-index: 1;
}

div.cs-skin-slide .cs-options ul {
    width: 100%;
    display: table;
}

div.cs-skin-slide .cs-options ul li {
    display: table-row;
}

div.cs-skin-slide .cs-options ul li span {
    display: table-cell;
    font-size: 14px;
    font-weight: normal;
    letter-spacing: normal;
    padding: 5px 0;
    text-transform: none;
    max-height: 350px;
    overflow-y: auto;
}

div.cs-skin-slide .cs-options ul li span:hover,
div.cs-skin-slide .cs-options ul li.cs-focus span,
div.cs-skin-slide .cs-options ul li.cs-selected span {
    color: #212121;
}

.cs-backdrop {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid rgba(33, 33, 33, 0.14);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(6) {
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(7) {
    -webkit-transition-delay: 0.35s;
    -o-transition-delay: 0.35s;
    transition-delay: 0.35s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(8) {
    -webkit-transition-delay: 0.4s;
    -o-transition-delay: 0.4s;
    transition-delay: 0.4s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(9) {
    -webkit-transition-delay: 0.45s;
    -o-transition-delay: 0.45s;
    transition-delay: 0.45s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(10) {
    -webkit-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.cs-skin-slide.cs-active .cs-options li:nth-child(11) {
    -webkit-transition-delay: 0.55s;
    -o-transition-delay: 0.55s;
    transition-delay: 0.55s;
}

.cs-input-group-addon {
    background: #f4f4f4;
    border: 1px solid rgba(33, 33, 33, 0.14);
    padding: 6px 10px;
}

.twitter-typeahead {
    width: 100%;
}

.tt-menu {
    width: 100%;
    padding: 3px 10px 3px 3px;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.07);
    border-top: 0;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
    box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
}

.tt-suggestion {
    color: #4b4b4b;
    padding: 3px 7px 4px;
    padding-left: 26px;
    line-height: 24px;
}

.tt-suggestion:hover {
    cursor: pointer;
    background: #f4f4f4;
}

.tt-suggestion.tt-cursor {
    background: #f4f4f4;
}

.tt-suggestion p {
    margin: 0;
}

.form-group-default.typehead {
    overflow: inherit;
}

.form-group-default .tt-menu {
    width: calc(100% + 24px);
    margin: 4px -12px;
}

.dropzone {
    overflow: hidden;
}

.dropzone .dz-default.dz-message {
    width: 100%;
}

.dropzone[dropzone="dropzone"] input[type="file"] {
    visibility: hidden;
}

.error-form .form-group-default {
    padding: 0;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.error-form .form-group-default label {
    margin-top: 6px;
    padding-left: 12px;
}

.error-form .form-group-default .form-control {
    margin-top: -2px;
    margin-bottom: 3px;
    padding-left: 12px;
}

.error-container.bottom-container {
    margin-top: 0;
}

.h-c-50 {
    height: calc(50px);
}

.card-toolbar .note-editor .btn-toolbar {
    display: block;
}


/*------------------------------------------------------------------
[04. Button]
------------------------------------------------------------------*/
.btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 14px;
    margin-bottom: 0;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    border-radius: 0;
    background-image: none !important;
    color: #4b4b4b;
    background-color: #fff;
    text-shadow: none;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    min-height: 34px;
    min-width: 34px;
    position: relative;
    transition: background 120ms ease-in 0s,
    box-shadow 120ms ease-in 0s,
    opacity 0.12s cubic-bezier(0.4, 0, 0.6, 1) 0ms,
    transform 0.12s cubic-bezier(0.4, 0, 0.6, 1) 0ms,
    -webkit-transform 0.12s cubic-bezier(0.4, 0, 0.6, 1) !important;
    border: 1px solid rgba(33, 33, 33, 0.17) !important;
}

.btn.focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn:hover:not(.active) {
    background: #f4f4f4;
    color: #4b4b4b;
}

.btn.active {
    background: #e9ebeb;
    border: 1px solid rgba(33, 33, 33, 0.2);
    color: #4b4b4b;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus {
    outline: none !important;
}

.btn .caret {
    margin-left: 3px;
}

.btn .caret.single {
    margin-left: 0px;
}

.btn i {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    left: 0px;
    top: 0px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: 500 !important;
}

.btn .ka-icon {
    font-size: 20px;
}

.btn .material-icons {
    font-size: 24px;
}

.btn span {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.btn span.authenticate {
    white-space: normal;
}

button:focus {
    outline: none !important;
}

/* Bootstrap Override: button */

.btn-black,
.btn-black:focus {
    color: #525f7f;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0;
    line-height: 14px;
    min-height: 28px;
    min-width: 28px;
    padding: 10px 30px;
}

.btn-black.outline,
.btn-black.outline:focus {
    background-color: rgba(255, 255, 255, 0.3);
    border: 1px solid rgba(0, 0, 0, 1);
}

.btn-black.active,
.btn-black:not(:disabled):not(.disabled):active,
.btn-black.active:focus,
.btn-black:not(:disabled):not(.disabled):active:focus,
.btn-black:not(:disabled):not(.disabled):active:hover,
.btn-black .show .dropdown-toggle.btn-black,
.btn-black.mixitup-control-active,
.btn-black.mixitup-control-active:hover {
    color: #fff;
    background-color: rgba(0, 0, 0, 1);
    border: 1px solid rgba(0, 0, 0, 1) !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-black.hover:not(.active),
.btn-black:hover:not(.active),
.btn-black .show .dropdown-toggle.btn-black,
.btn-black:hover:not(.mixitup-control-active) {
    background-color: transparent;
    color: rgba(0, 0, 0, 1);
    border: 1px solid rgba(0, 0, 0, 1);
}

.btn-black.outline.hover:not(.active),
.btn-black.outline:hover:not(.active),
.btn-black.outline .show .dropdown-toggle.btn-black,
.btn-black.outline:hover:not(.mixitup-control-active) {
    background-color: rgba(0, 0, 0, 1);
    color: rgba(255, 255, 255, 1) !important;
    border: 1px solid rgba(0, 0, 0, 1);
}

.btn-black.disabled,
.btn-black.disabled:hover,
.btn-black.disabled:focus,
.btn-black.disabled:active,
.btn-black.disabled.active,
.btn-black[disabled],
.btn-black[disabled]:hover,
.btn-black[disabled]:focus,
.btn-black[disabled]:active,
.btn-black[disabled].active,
fieldset[disabled] .btn-black,
fieldset[disabled] .btn-black:hover,
fieldset[disabled] .btn-black:focus,
fieldset[disabled] .btn-black:active,
fieldset[disabled] .btn-black.active {
    background-color: transparent;
    color: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(0, 0, 0, 0.5);
}

.btn-black .badge {
    color: #fff;
    background-color: #000;
}


.btn-white,
.btn-white:focus {
    color: #fff !important;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0;
    line-height: 14px;
    min-height: 28px;
    min-width: 28px;
    padding: 10px 30px;
}

.btn-white.outline,
.btn-white.outline:focus {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 1);
}

.btn-white.active,
.btn-white:not(:disabled):not(.disabled):active,
.btn-white.active:focus,
.btn-white:not(:disabled):not(.disabled):active:focus,
.btn-white:not(:disabled):not(.disabled):active:hover,
.btn-white .show .dropdown-toggle.btn-white,
.btn-white.mixitup-control-active,
.btn-white.mixitup-control-active:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(255, 255, 255, 1) !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-white.hover:not(.active),
.btn-white:hover:not(.active),
.btn-white .show .dropdown-toggle.btn-white,
.btn-white:hover:not(.mixitup-control-active) {
    background-color: transparent;
    color: rgba(255, 255, 255, 1);
    border: 1px solid rgba(255, 255, 255, 1);
}

.btn-white.outline.hover:not(.active),
.btn-white.outline:hover:not(.active),
.btn-white.outline .show .dropdown-toggle.btn-white,
.btn-white.outline:hover:not(.mixitup-control-active) {
    background-color: rgba(255, 255, 255, 1);
    color: rgba(0, 0, 0, 1) !important;
    border: 1px solid rgba(255, 255, 255, 1);
}

.btn-white.disabled,
.btn-white.disabled:hover,
.btn-white.disabled:focus,
.btn-white.disabled:active,
.btn-white.disabled.active,
.btn-white[disabled],
.btn-white[disabled]:hover,
.btn-white[disabled]:focus,
.btn-white[disabled]:active,
.btn-white[disabled].active,
fieldset[disabled] .btn-white,
fieldset[disabled] .btn-white:hover,
fieldset[disabled] .btn-white:focus,
fieldset[disabled] .btn-white:active,
fieldset[disabled] .btn-white.active {
    background-color: transparent;
    color: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(0, 0, 0, 0.5);
}

.btn-white .badge {
    color: #fff;
    background-color: #000;
}


.btn-ka,
.btn-ka:focus {
    color: #F47104;
    border: 1px solid transparent;
    line-height: 14px;
    min-height: 28px;
    min-width: 28px;
    padding: 6px 10px;
}

.btn-ka.active,
.btn-ka:not(:disabled):not(.disabled):active,
.btn-ka.active:focus,
.btn-ka:not(:disabled):not(.disabled):active:focus,
.btn-ka:not(:disabled):not(.disabled):active:hover,
.btn-ka .show .dropdown-toggle.btn-ka {
    color: #fff;
    background-color: rgba(255, 126, 46, 1);
    border: 1px solid rgba(255, 126, 46, 1);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-ka.hover:not(.active),
.btn-ka:hover:not(.active),
.btn-ka .show .dropdown-toggle.btn-ka {
    background-color: transparent;
    color: rgba(244, 113, 4, 1);
    border: 1px solid rgba(244, 113, 4, 1);
}

.btn-ka.disabled,
.btn-ka.disabled:hover,
.btn-ka.disabled:focus,
.btn-ka.disabled:active,
.btn-ka.disabled.active,
.btn-ka[disabled],
.btn-ka[disabled]:hover,
.btn-ka[disabled]:focus,
.btn-ka[disabled]:active,
.btn-ka[disabled].active,
fieldset[disabled] .btn-ka,
fieldset[disabled] .btn-ka:hover,
fieldset[disabled] .btn-ka:focus,
fieldset[disabled] .btn-ka:active,
fieldset[disabled] .btn-ka.active {
    background-color: transparent;
    color: rgba(255, 152, 0, 0.5);
    border: 1px solid rgba(255, 152, 0, 0.5);
}

.btn-ka .badge {
    color: #fff;
    background-color: #F47104;
}


.btn-primary {
    color: #fff !important;
    background-color: var(--color-orange_600);
    border: none;
}

.btn-primary:focus,
.btn-primary.active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary.active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled):active:hover,
.btn-primary .show .dropdown-toggle.btn-primary {
    background-color: var(--color-orange_700);
    color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-primary.hover:not(.active),
.btn-primary:hover:not(.active),
.btn-primary .show .dropdown-toggle.btn-primary {
    background-color: var(--color-orange_700);
    color: #fff;
    border: none;
}

.btn-primary.active:not(.active),
.btn-primary:active:not(.active) {
    background-color: var(--color-orange_800);
}

.btn-primary.disabled,
.btn-primary.disabled:hover,
.btn-primary.disabled:focus,
.btn-primary.disabled:active,
.btn-primary.disabled.active,
.btn-primary[disabled],
.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:active,
fieldset[disabled] .btn-primary.active {
    background-color: #f44e05;
    border: none;
}

.btn-primary .badge {
    color: #F47104;
    background-color: #fff;
}

.btn-success,
.btn-success:focus {
    color: #fff;
    background-color: #19AD79;
    border: 1px solid rgba(13, 147, 91, 0.5);
}

.btn-success.active,
.btn-success:not(:disabled):not(.disabled):active,
.btn-success.active:focus,
.btn-success:not(:disabled):not(.disabled):active:focus,
.btn-success:not(:disabled):not(.disabled):active:hover,
.btn-success .show .dropdown-toggle.btn-success {
    background-color: #0fa465;
    color: #fff;
    border: 1px solid rgba(13, 147, 91, 0.5);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-success.hover:not(.active),
.btn-success:hover:not(.active),
.btn-success .show .dropdown-toggle.btn-success {
    background-color: #26bf93;
    color: #fff;
    border: 1px solid rgba(13, 147, 91, 0.5);
}

.btn-success.disabled,
.btn-success.disabled:hover,
.btn-success.disabled:focus,
.btn-success.disabled:active,
.btn-success.disabled.active,
.btn-success[disabled],
.btn-success[disabled]:hover,
.btn-success[disabled]:focus,
.btn-success[disabled]:active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-success:hover,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success:active,
fieldset[disabled] .btn-success.active {
    background-color: #19AD79;
    border: 1px solid rgba(13, 147, 91, 0.5);
}

.btn-success .badge {
    color: #19AD79;
    background-color: #fff;
}

.btn-complete,
.btn-complete:focus {
    color: #fff;
    background-color: #0072EC;
    border: 1px solid rgba(0, 79, 191, 0.5);
}

.btn-complete.active,
.btn-complete:not(:disabled):not(.disabled):active,
.btn-complete.active:focus,
.btn-complete:not(:disabled):not(.disabled):active:focus,
.btn-complete:not(:disabled):not(.disabled):active:hover,
.btn-complete .show .dropdown-toggle.btn-complete {
    background-color: #0059d4;
    color: #fff;
    border: 1px solid rgba(0, 79, 191, 0.5);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-complete.hover:not(.active),
.btn-complete:hover:not(.active),
.btn-complete .show .dropdown-toggle.btn-complete {
    background-color: #0f8ff9;
    color: #fff;
    border: 1px solid rgba(0, 79, 191, 0.5);
}

.btn-complete.disabled,
.btn-complete.disabled:hover,
.btn-complete.disabled:focus,
.btn-complete.disabled:active,
.btn-complete.disabled.active,
.btn-complete[disabled],
.btn-complete[disabled]:hover,
.btn-complete[disabled]:focus,
.btn-complete[disabled]:active,
.btn-complete[disabled].active,
fieldset[disabled] .btn-complete,
fieldset[disabled] .btn-complete:hover,
fieldset[disabled] .btn-complete:focus,
fieldset[disabled] .btn-complete:active,
fieldset[disabled] .btn-complete.active {
    background-color: #0072EC;
    border: 1px solid rgba(0, 79, 191, 0.5);
}

.btn-complete .badge {
    color: #0072EC;
    background-color: #fff;
}

.btn-info,
.btn-info:focus {
    color: #fff;
    background-color: #3B4752;
    border: 1px solid rgba(43, 57, 71, 0.5);
}

.btn-info.active,
.btn-info:not(:disabled):not(.disabled):active,
.btn-info.active:focus,
.btn-info:not(:disabled):not(.disabled):active:focus,
.btn-info:not(:disabled):not(.disabled):active:hover,
.btn-info .show .dropdown-toggle.btn-info {
    background-color: #2f3e50;
    color: #fff;
    border: 1px solid rgba(43, 57, 71, 0.5);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-info.hover:not(.active),
.btn-info:hover:not(.active),
.btn-info .show .dropdown-toggle.btn-info {
    background-color: #475b6b;
    color: #fff;
    border: 1px solid rgba(43, 57, 71, 0.5);
}

.btn-info.disabled,
.btn-info.disabled:hover,
.btn-info.disabled:focus,
.btn-info.disabled:active,
.btn-info.disabled.active,
.btn-info[disabled],
.btn-info[disabled]:hover,
.btn-info[disabled]:focus,
.btn-info[disabled]:active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info,
fieldset[disabled] .btn-info:hover,
fieldset[disabled] .btn-info:focus,
fieldset[disabled] .btn-info:active,
fieldset[disabled] .btn-info.active {
    background-color: #3B4752;
    border: 1px solid rgba(43, 57, 71, 0.5);
}

.btn-info .badge {
    color: #3B4752;
    background-color: #fff;
}

.btn-warning,
.btn-warning:focus {
    color: #4b4b4b;
    background-color: #FFd945;
    border: 1px solid rgba(218, 171, 45, 0.5);
}

.btn-warning.active,
.btn-warning:not(:disabled):not(.disabled):active,
.btn-warning.active:focus,
.btn-warning:not(:disabled):not(.disabled):active:focus,
.btn-warning:not(:disabled):not(.disabled):active:hover,
.btn-warning .show .dropdown-toggle.btn-warning {
    background-color: #f0bc34;
    color: #4b4b4b;
    border: 1px solid rgba(218, 171, 45, 0.5);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-warning.hover:not(.active),
.btn-warning:hover:not(.active),
.btn-warning .show .dropdown-toggle.btn-warning {
    background-color: #ffe858;
    color: #4b4b4b;
    border: 1px solid rgba(218, 171, 45, 0.5);
}

.btn-warning.disabled,
.btn-warning.disabled:hover,
.btn-warning.disabled:focus,
.btn-warning.disabled:active,
.btn-warning.disabled.active,
.btn-warning[disabled],
.btn-warning[disabled]:hover,
.btn-warning[disabled]:focus,
.btn-warning[disabled]:active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning,
fieldset[disabled] .btn-warning:hover,
fieldset[disabled] .btn-warning:focus,
fieldset[disabled] .btn-warning:active,
fieldset[disabled] .btn-warning.active {
    background-color: #FFd945;
    border: 1px solid rgba(218, 171, 45, 0.5);
}

.btn-warning .badge {
    color: #FFd945;
    background-color: #4b4b4b;
}

.btn-danger,
.btn-danger:focus {
    color: #fff;
    background-color: #D83C31;
    border: 1px solid rgba(185, 30, 30, 0.5);
}

.btn-danger.active,
.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger.active:focus,
.btn-danger:not(:disabled):not(.disabled):active:focus,
.btn-danger:not(:disabled):not(.disabled):active:hover,
.btn-danger .show .dropdown-toggle.btn-danger {
    background-color: #cd2121;
    color: #fff;
    border: 1px solid rgba(185, 30, 30, 0.5);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-danger.hover:not(.active),
.btn-danger:hover:not(.active),
.btn-danger .show .dropdown-toggle.btn-danger {
    background-color: #e6533c;
    color: #fff;
    border: 1px solid rgba(185, 30, 30, 0.5);
}

.btn-danger.disabled,
.btn-danger.disabled:hover,
.btn-danger.disabled:focus,
.btn-danger.disabled:active,
.btn-danger.disabled.active,
.btn-danger[disabled],
.btn-danger[disabled]:hover,
.btn-danger[disabled]:focus,
.btn-danger[disabled]:active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger,
fieldset[disabled] .btn-danger:hover,
fieldset[disabled] .btn-danger:focus,
fieldset[disabled] .btn-danger:active,
fieldset[disabled] .btn-danger.active {
    background-color: #D83C31;
    border: 1px solid rgba(185, 30, 30, 0.5);
}

.btn-danger .badge {
    color: #D83C31;
    background-color: #fff;
}

.btn-default {
    background: #fff;
    color: #4b4b4b;
}

.btn-default:not(:disabled):not(.disabled):active:hover,
.btn-default.active,
.btn-default:active,
.btn-default.active:focus,
.btn-default:active:focus {
    /*
  background: #e0e0e0;
  border: 1px solid rgba(33, 33, 33, 0.2);
  color: #4b4b4b;
  */
    background: #F47104;
    color: #fff;
    border: 1px solid #F47104;
}

.btn-default.active {
    /*
  background: #e0e0e0;
  color: #212121;
  
  background: #F47104;
  color: #fff;
  animation-name: toggle;
  animation-duration: 300ms;
  animation-iteration-count: 1;
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
*/
}


.btn-default.hover:not(.active),
.btn-default:hover:not(.active) {
    background: #000;
    border: 1px solid rgba(0, 0, 0, 1);
    color: #fff;
}

.btn-icon-link {
    position: relative;
    min-width: 24px;
    min-height: 24px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    background: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;
    line-height: 0;
}

.btn-icon-link:before {
    content: "";
    display: block;
    opacity: 0;
    position: absolute;
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 240ms;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 240ms;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 240ms;
    bottom: -2px;
    left: -2px;
    right: -2px;
    top: -2px;
    background: none;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transform: scale(0.89);
    -ms-transform: scale(0.89);
    transform: scale(0.89);
}

.btn-icon-link:hover:not(.active) {
    background: transparent;
}

.btn-icon-link:hover:not(.active):before {
    background-color: rgba(33, 33, 33, 0.1);
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.btn-icon-link:hover:not(.active):active:before,
.btn-icon-link:hover:not(.active).active:before {
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 44ms;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 44ms;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 44ms;
    background-color: rgba(117, 117, 117, 0.26);
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.btn-icon-link.active {
    background: none;
}

.btn-icon-link.active:before {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    background-color: rgba(117, 117, 117, 0.26);
}

.btn-icon-link.invert:hover:not(.active) {
    color: rgba(255, 255, 255, 0.72);
}

.btn-icon-link.invert:hover:not(.active):before {
    background-color: rgba(255, 255, 255, 0.12);
}

.btn-icon-link.invert:hover:not(.active):active {
    color: #fff;
}

.btn-icon-link.invert:hover:not(.active):active:before {
    background-color: rgba(255, 255, 255, 0.18);
}


.btn-solid-black,
.btn-solid-black:focus {
    color: #fff !important;
    border: 1px solid #000;
    background: #000;
}

.btn-solid-black.active,
.btn-solid-black:not(:disabled):not(.disabled):active,
.btn-solid-black.active:focus,
.btn-solid-black:not(:disabled):not(.disabled):active:focus,
.btn-solid-black:not(:disabled):not(.disabled):active:hover,
.btn-solid-black .show .dropdown-toggle.btn-solid-black {
    background-color: #000;
    border: 1px solid #000;
    color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-solid-black.hover:not(.active),
.btn-solid-black:hover:not(.active),
.btn-solid-black .show .dropdown-toggle.btn-solid-black {
    background-color: #F47104;
    border: 1px solid #F47104;
    color: #fff;
}

.btn-solid-black.disabled,
.btn-solid-black.disabled:hover,
.btn-solid-black.disabled:focus,
.btn-solid-black.disabled:active,
.btn-solid-black.disabled.active,
.btn-solid-black[disabled],
.btn-solid-black[disabled]:hover,
.btn-solid-black[disabled]:focus,
.btn-solid-black[disabled]:active,
.btn-solid-black[disabled].active,
fieldset[disabled] .btn-solid-black,
fieldset[disabled] .btn-solid-black:hover,
fieldset[disabled] .btn-solid-black:focus,
fieldset[disabled] .btn-solid-black:active,
fieldset[disabled] .btn-solid-black.active {
    border: 1px solid rgba(0, 0, 0, 0.8);
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    cursor: not-allowed;
}


/* Outline Button */
.btn-outline-black,
.btn-outline-black:focus {
    color: #000;
    border: 1px solid #000;
    background: transparent;
}

.btn-outline-black.active,
.btn-outline-black:not(:disabled):not(.disabled):active,
.btn-outline-black.active:focus,
.btn-outline-black:not(:disabled):not(.disabled):active:focus,
.btn-outline-black:not(:disabled):not(.disabled):active:hover,
.btn-outline-black .show .dropdown-toggle.btn-outline-black {
    background-color: rgba(0, 0, 0, 1);
    border: 1px solid #000;
    color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline-black.hover:not(.active),
.btn-outline-black:hover:not(.active),
.btn-outline-black .show .dropdown-toggle.btn-outline-black {
    background-color: rgba(0, 0, 0, 1);
    border: 1px solid #000;
    color: #fff;
}

.btn-outline-black.disabled,
.btn-outline-black.disabled:hover,
.btn-outline-black.disabled:focus,
.btn-outline-black.disabled:active,
.btn-outline-black.disabled.active,
.btn-outline-black[disabled],
.btn-outline-black[disabled]:hover,
.btn-outline-black[disabled]:focus,
.btn-outline-black[disabled]:active,
.btn-outline-black[disabled].active,
fieldset[disabled] .btn-outline-black,
fieldset[disabled] .btn-outline-black:hover,
fieldset[disabled] .btn-outline-black:focus,
fieldset[disabled] .btn-outline-black:active,
fieldset[disabled] .btn-outline-black.active {
    border: 1px solid rgba(0, 0, 0, 0.8);
    background: transparent;
    color: rgba(0, 0, 0, 0.8);
    cursor: not-allowed;
}


.btn-outline-primary,
.btn-outline-primary:focus {
    color: #F47104;
    border: 1px solid #F47104;
    background: transparent;
}

.btn-outline-primary.active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary.active:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active:hover,
.btn-outline-primary .show .dropdown-toggle.btn-outline-primary {
    background-color: rgba(244, 113, 4, 0.4);
    border: 1px solid #F47104;
    color: #F47104;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline-primary.hover:not(.active),
.btn-outline-primary:hover:not(.active),
.btn-outline-primary .show .dropdown-toggle.btn-outline-primary {
    background-color: rgba(244, 113, 4, 0.1);
    border: 1px solid #F47104;
    color: #F47104;
}

.btn-outline-primary.disabled,
.btn-outline-primary.disabled:hover,
.btn-outline-primary.disabled:focus,
.btn-outline-primary.disabled:active,
.btn-outline-primary.disabled.active,
.btn-outline-primary[disabled],
.btn-outline-primary[disabled]:hover,
.btn-outline-primary[disabled]:focus,
.btn-outline-primary[disabled]:active,
.btn-outline-primary[disabled].active,
fieldset[disabled] .btn-outline-primary,
fieldset[disabled] .btn-outline-primary:hover,
fieldset[disabled] .btn-outline-primary:focus,
fieldset[disabled] .btn-outline-primary:active,
fieldset[disabled] .btn-outline-primary.active {
    border: 1px solid #F47104;
    background: transparent;
    color: rgba(244, 113, 4, 0.8);
    cursor: not-allowed;
}

.btn-outline-success,
.btn-outline-success:focus {
    color: #19AD79;
    border: 1px solid #19AD79;
    background: transparent;
}

.btn-outline-success.active,
.btn-outline-success:not(:disabled):not(.disabled):active,
.btn-outline-success.active:focus,
.btn-outline-success:not(:disabled):not(.disabled):active:focus,
.btn-outline-success:not(:disabled):not(.disabled):active:hover,
.btn-outline-success .show .dropdown-toggle.btn-outline-success {
    background-color: rgba(25, 173, 121, 0.4);
    border: 1px solid #19AD79;
    color: #19AD79;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline-success.hover:not(.active),
.btn-outline-success:hover:not(.active),
.btn-outline-success .show .dropdown-toggle.btn-outline-success {
    background-color: rgba(25, 173, 121, 0.1);
    border: 1px solid #19AD79;
    color: #19AD79;
}

.btn-outline-success.disabled,
.btn-outline-success.disabled:hover,
.btn-outline-success.disabled:focus,
.btn-outline-success.disabled:active,
.btn-outline-success.disabled.active,
.btn-outline-success[disabled],
.btn-outline-success[disabled]:hover,
.btn-outline-success[disabled]:focus,
.btn-outline-success[disabled]:active,
.btn-outline-success[disabled].active,
fieldset[disabled] .btn-outline-success,
fieldset[disabled] .btn-outline-success:hover,
fieldset[disabled] .btn-outline-success:focus,
fieldset[disabled] .btn-outline-success:active,
fieldset[disabled] .btn-outline-success.active {
    border: 1px solid #19AD79;
    background: transparent;
    color: rgba(25, 173, 121, 0.8);
    cursor: not-allowed;
}

.btn-outline-complete,
.btn-outline-complete:focus {
    color: #0072EC;
    border: 1px solid #0072EC;
    background: transparent;
}

.btn-outline-complete.active,
.btn-outline-complete:not(:disabled):not(.disabled):active,
.btn-outline-complete.active:focus,
.btn-outline-complete:not(:disabled):not(.disabled):active:focus,
.btn-outline-complete:not(:disabled):not(.disabled):active:hover,
.btn-outline-complete .show .dropdown-toggle.btn-outline-complete {
    background-color: rgba(0, 114, 236, 0.4);
    border: 1px solid #0072EC;
    color: #0072EC;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline-complete.hover:not(.active),
.btn-outline-complete:hover:not(.active),
.btn-outline-complete .show .dropdown-toggle.btn-outline-complete {
    background-color: rgba(0, 114, 236, 0.1);
    border: 1px solid #0072EC;
    color: #0072EC;
}

.btn-outline-complete.disabled,
.btn-outline-complete.disabled:hover,
.btn-outline-complete.disabled:focus,
.btn-outline-complete.disabled:active,
.btn-outline-complete.disabled.active,
.btn-outline-complete[disabled],
.btn-outline-complete[disabled]:hover,
.btn-outline-complete[disabled]:focus,
.btn-outline-complete[disabled]:active,
.btn-outline-complete[disabled].active,
fieldset[disabled] .btn-outline-complete,
fieldset[disabled] .btn-outline-complete:hover,
fieldset[disabled] .btn-outline-complete:focus,
fieldset[disabled] .btn-outline-complete:active,
fieldset[disabled] .btn-outline-complete.active {
    border: 1px solid #0072EC;
    background: transparent;
    color: rgba(0, 114, 236, 0.8);
    cursor: not-allowed;
}

.btn-outline-info,
.btn-outline-info:focus {
    color: #3B4752;
    border: 1px solid #3B4752;
    background: transparent;
}

.btn-outline-info.active,
.btn-outline-info:not(:disabled):not(.disabled):active,
.btn-outline-info.active:focus,
.btn-outline-info:not(:disabled):not(.disabled):active:focus,
.btn-outline-info:not(:disabled):not(.disabled):active:hover,
.btn-outline-info .show .dropdown-toggle.btn-outline-info {
    background-color: rgba(59, 71, 82, 0.4);
    border: 1px solid #3B4752;
    color: #3B4752;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline-info.hover:not(.active),
.btn-outline-info:hover:not(.active),
.btn-outline-info .show .dropdown-toggle.btn-outline-info {
    background-color: rgba(59, 71, 82, 0.1);
    border: 1px solid #3B4752;
    color: #3B4752;
}

.btn-outline-info.disabled,
.btn-outline-info.disabled:hover,
.btn-outline-info.disabled:focus,
.btn-outline-info.disabled:active,
.btn-outline-info.disabled.active,
.btn-outline-info[disabled],
.btn-outline-info[disabled]:hover,
.btn-outline-info[disabled]:focus,
.btn-outline-info[disabled]:active,
.btn-outline-info[disabled].active,
fieldset[disabled] .btn-outline-info,
fieldset[disabled] .btn-outline-info:hover,
fieldset[disabled] .btn-outline-info:focus,
fieldset[disabled] .btn-outline-info:active,
fieldset[disabled] .btn-outline-info.active {
    border: 1px solid #3B4752;
    background: transparent;
    color: rgba(59, 71, 82, 0.8);
    cursor: not-allowed;
}

.btn-outline-warning,
.btn-outline-warning:focus {
    color: #FFd945;
    border: 1px solid #FFd945;
    background: transparent;
}

.btn-outline-warning.active,
.btn-outline-warning:not(:disabled):not(.disabled):active,
.btn-outline-warning.active:focus,
.btn-outline-warning:not(:disabled):not(.disabled):active:focus,
.btn-outline-warning:not(:disabled):not(.disabled):active:hover,
.btn-outline-warning .show .dropdown-toggle.btn-outline-warning {
    background-color: rgba(255, 217, 69, 0.4);
    border: 1px solid #FFd945;
    color: #FFd945;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline-warning.hover:not(.active),
.btn-outline-warning:hover:not(.active),
.btn-outline-warning .show .dropdown-toggle.btn-outline-warning {
    background-color: rgba(255, 217, 69, 0.1);
    border: 1px solid #FFd945;
    color: #FFd945;
}

.btn-outline-warning.disabled,
.btn-outline-warning.disabled:hover,
.btn-outline-warning.disabled:focus,
.btn-outline-warning.disabled:active,
.btn-outline-warning.disabled.active,
.btn-outline-warning[disabled],
.btn-outline-warning[disabled]:hover,
.btn-outline-warning[disabled]:focus,
.btn-outline-warning[disabled]:active,
.btn-outline-warning[disabled].active,
fieldset[disabled] .btn-outline-warning,
fieldset[disabled] .btn-outline-warning:hover,
fieldset[disabled] .btn-outline-warning:focus,
fieldset[disabled] .btn-outline-warning:active,
fieldset[disabled] .btn-outline-warning.active {
    border: 1px solid #FFd945;
    background: transparent;
    color: rgba(255, 217, 69, 0.8);
    cursor: not-allowed;
}

.btn-outline-danger,
.btn-outline-danger:focus {
    color: #D83C31;
    border: 1px solid #D83C31;
    background: transparent;
}

.btn-outline-danger.active,
.btn-outline-danger:not(:disabled):not(.disabled):active,
.btn-outline-danger.active:focus,
.btn-outline-danger:not(:disabled):not(.disabled):active:focus,
.btn-outline-danger:not(:disabled):not(.disabled):active:hover,
.btn-outline-danger .show .dropdown-toggle.btn-outline-danger {
    background-color: rgba(216, 60, 49, 0.4);
    border: 1px solid #D83C31;
    color: #D83C31;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-outline-danger.hover:not(.active),
.btn-outline-danger:hover:not(.active),
.btn-outline-danger .show .dropdown-toggle.btn-outline-danger {
    background-color: rgba(216, 60, 49, 0.1);
    border: 1px solid #D83C31;
    color: #D83C31;
}

.btn-outline-danger.disabled,
.btn-outline-danger.disabled:hover,
.btn-outline-danger.disabled:focus,
.btn-outline-danger.disabled:active,
.btn-outline-danger.disabled.active,
.btn-outline-danger[disabled],
.btn-outline-danger[disabled]:hover,
.btn-outline-danger[disabled]:focus,
.btn-outline-danger[disabled]:active,
.btn-outline-danger[disabled].active,
fieldset[disabled] .btn-outline-danger,
fieldset[disabled] .btn-outline-danger:hover,
fieldset[disabled] .btn-outline-danger:focus,
fieldset[disabled] .btn-outline-danger:active,
fieldset[disabled] .btn-outline-danger.active {
    border: 1px solid #D83C31;
    background: transparent;
    color: rgba(216, 60, 49, 0.8);
    cursor: not-allowed;
}

@-webkit-keyframes toggle {
    0% {
        background: #e0e0e0;
    }
    50% {
        background: #adadad;
    }
    100% {
        background: #e0e0e0;
    }
}

@keyframes toggle {
    0% {
        background: #e0e0e0;
    }
    50% {
        background: #adadad;
    }
    100% {
        background: #e0e0e0;
    }
}

.btn-link {
    padding: 3px 8px 3px 6px;
}

.btn-link,
.btn-link:focus {
    color: #4b4b4b;
    background: transparent;
    border: 0;
    text-decoration: none;
}

.btn-link.active,
.btn-link:not(:disabled):not(.disabled):active,
.btn-link.active:focus,
.btn-link:not(:disabled):not(.disabled):active:focus,
.btn-link:not(:disabled):not(.disabled):active:hover {
    /*
  color: #4b4b4b;
  background: rgba(128, 128, 128, 0.33);
  #F47104
*/
    color: #fff;
    background: rgba(234, 96, 0, 0.33);
    border: 0;
}

.btn-link.hover:not(.active),
.btn-link:hover:not(.active) {
    /*
  color: #4b4b4b;
  background: rgba(128, 128, 128, 0.2);
  #F47104
*/
    color: #4b4b4b;
    background: rgba(234, 96, 0, 0.2);
    border: 0;
    text-decoration: none;
}

.btn-link.disabled,
.btn-link.disabled:hover,
.btn-link.disabled:focus,
.btn-link.disabled:active,
.btn-link.disabled.active,
.btn-link[disabled],
.btn-link[disabled]:hover,
.btn-link[disabled]:focus,
.btn-link[disabled]:active,
.btn-link[disabled].active,
fieldset[disabled] .btn-link,
fieldset[disabled] .btn-link:hover,
fieldset[disabled] .btn-link:focus,
fieldset[disabled] .btn-link:active,
fieldset[disabled] .btn-link.active {
    color: #757575;
    background: transparent;
    border: 0;
    pointer-events: none;
    cursor: not-allowed;
}

.btn-file {
    position: relative;
    overflow: hidden;
}

.btn-file input[type="file"] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    background: red;
    cursor: inherit;
    display: block;
}

.js-focus-visible .btn:focus:not(.focus-visible) {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-icon-left {
    padding-left: 0px !important;
}

.btn-icon-left i {
    margin: 0 3px;
}

.btn-icon-right {
    padding-right: 0px !important;
}

.btn-icon-right i {
    margin: 3px 0;
}

.btn-group
.btn-group .btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

.btn-group
.btn-group .btn i {
    font-size: 20px;
}

.btn-group
.btn-group:not(.btn-group-vertical) .btn:not(.dropdown-toggle):not(:last-child):not(.active):after {
    content: "";
    position: absolute;
    width: 1px;
    top: 20%;
    height: calc(100% - 40%);
    bottom: 10px;
    background: rgba(0, 0, 0, 0.2);
    right: -1px;
    z-index: 2;
}

.btn-group
.btn-group:not(.btn-group-vertical) .btn:not(.active):not(:first-child) {
    border-left: 1px solid transparent;
}

.btn-group
.btn-group:not(.btn-group-vertical) .btn.active {
    z-index: 2;
}

.btn-group
.btn-group.btn-group-vertical > .btn:not(:first-child) {
    margin-left: 0;
}

.btn-flex-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.btn-lg,
.btn-group-lg > .btn {
    /* padding: 14px 14px; */
    height: 40px;
    font-size: 14px;
    line-height: 40px;
    min-height: initial;
    min-width: initial;
    font-weight: 500;
    letter-spacing: -0.011em;
}

.btn-lg.btn-link,
.btn-group-lg > .btn.btn-link {
    padding: 0px 5px;
}

.btn-lg.btn-icon-left i {
    margin-left: 5px;
    margin-right: 4px;
}

.btn-lg.btn-icon-right i {
    margin-right: 5px;
    margin-left: 4px;
}

.btn-sm,
.btn-group-sm > .btn {
    padding: 0 8px;
    min-height: 24px;
    min-width: 24px;
    border-radius: 3px;
    font-size: 12px;
    line-height: 12px;
    letter-spacing: 0em;
}

.btn-xs,
.btn-group-xs > .btn {
    padding: 0 5px;
    font-size: 12px;
    line-height: 12px;
    min-width: 22px;
    min-height: 22px;
    letter-spacing: 0em;
}

.btn-cons {
    margin-right: 5px;
    min-width: 120px;
}

.btn-rounded {
    border-radius: 100px !important;
    padding-left: 11px;
    padding-right: 11px;
    font-size: 11px;
}

.btn-rounded.btn-lg {
    padding-left: 14px;
    padding-right: 14px;
    font-size: 12px;
}

.btn-rounded.btn-sm {
    padding-left: 9px;
    padding-right: 9px;
    font-size: 10px;
}

.btn-rounded.btn-xs {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 9px;
}


/*위탁신청페이지수정*/
#data-grid {
    width: 100% !important;
    overflow-x: scroll !important;
    margin: 30px 15px;
    padding: 0 !important;
}

.jsgrid-grid-header {
    overflow-y: hidden !important;
}

.jsgrid-grid-body {
    overflow-y: auto !important;
}


@media (max-width: 768px) {
    .jsgrid-grid-header {
        width: 763px !important;
    }

    .jsgrid-grid-body {
        width: 763px !important;
    }
}

/*Bigger CTA Style Button*/
.btn-cta {
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 15px 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.btn-cstm-light {
    color: #212841;
    background-color: #fff;
    border-color: #fff;
}

.btn-cstm-light:hover {
    color: #212841;
    background-color: #ececec;
    border-color: #e6e6e6;
}

.btn-cstm-light:focus,
.btn-cstm-light.focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5);
}

.btn-cstm-light.disabled,
.btn-cstm-light:disabled {
    color: #212841;
    background-color: #fff;
    border-color: #fff;
}

.btn-cstm-light:not(:disabled):not(.disabled):active,
.btn-cstm-light:not(:disabled):not(.disabled).active,
.show > .btn-cstm-light.dropdown-toggle {
    color: #212841;
    background-color: #e6e6e6;
    border-color: #dfdfdf;
}

.btn-cstm-light:not(:disabled):not(.disabled):active:focus,
.btn-cstm-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-cstm-light.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5);
}

.btn-cstm-dark {
    color: #FFFFFF;
    background-color: #28304e;
    border-color: #28304e;
}

.btn-cstm-dark:hover {
    color: #FFFFFF;
    background-color: #1b2035;
    border-color: #171b2c;
}

.btn-cstm-dark:focus,
.btn-cstm-dark.focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 48, 78, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(40, 48, 78, 0.5);
}

.btn-cstm-dark.disabled,
.btn-cstm-dark:disabled {
    color: #FFFFFF;
    background-color: #28304e;
    border-color: #28304e;
}

.btn-cstm-dark:not(:disabled):not(.disabled):active,
.btn-cstm-dark:not(:disabled):not(.disabled).active,
.show > .btn-cstm-dark.dropdown-toggle {
    color: #FFFFFF;
    background-color: #171b2c;
    border-color: #121624;
}

.btn-cstm-danger {
    color: #FFFFFF;
    background-color: #f2545b;
    border-color: #f2545b;
}

.btn-cstm-danger:hover {
    color: #FFFFFF;
    background-color: #ef3039;
    border-color: #ee252e;
}

.btn-cstm-danger:focus,
.btn-cstm-danger.focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(242, 84, 91, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(242, 84, 91, 0.5);
}

.btn-cstm-danger.disabled,
.btn-cstm-danger:disabled {
    color: #FFFFFF;
    background-color: #f2545b;
    border-color: #f2545b;
}

.btn-cstm-danger:not(:disabled):not(.disabled):active,
.btn-cstm-danger:not(:disabled):not(.disabled).active,
.show > .btn-cstm-danger.dropdown-toggle {
    color: #FFFFFF;
    background-color: #ee252e;
    border-color: #ed1922;
}

.btn-cstm-danger:not(:disabled):not(.disabled):active:focus,
.btn-cstm-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-cstm-danger.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(242, 84, 91, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(242, 84, 91, 0.5);
}

.btn-cstm-success {
    color: #FFFFFF;
    background-color: #00CC99;
    border-color: #00CC99;
}

.btn-cstm-success:hover {
    color: #FFFFFF;
    background-color: #00a67c;
    border-color: #009973;
}

.btn-cstm-success:focus,
.btn-cstm-success.focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 204, 153, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(0, 204, 153, 0.5);
}

.btn-cstm-success.disabled,
.btn-cstm-success:disabled {
    color: #FFFFFF;
    background-color: #00CC99;
    border-color: #00CC99;
}

.btn-cstm-success:not(:disabled):not(.disabled):active,
.btn-cstm-success:not(:disabled):not(.disabled).active,
.show > .btn-cstm-success.dropdown-toggle {
    color: #FFFFFF;
    background-color: #009973;
    border-color: #008c69;
}

.btn-cstm-success:not(:disabled):not(.disabled):active:focus,
.btn-cstm-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-cstm-success.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 204, 153, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(0, 204, 153, 0.5);
}

.btn-cstm-secondary {
    height: 32px;
    color: #FFFFFF;
    background-color: #95AAC9;
    border-color: #95AAC9;
}

.btn-cstm-secondary:hover {
    color: #FFFFFF;
    background-color: #7c96bc;
    border-color: #738fb8;
}

.btn-cstm-secondary:focus,
.btn-cstm-secondary.focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 170, 201, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(149, 170, 201, 0.5);
}

.btn-cstm-secondary.disabled,
.btn-cstm-secondary:disabled {
    color: #FFFFFF;
    background-color: #95AAC9;
    border-color: #95AAC9;
}

.btn-cstm-secondary:not(:disabled):not(.disabled):active,
.btn-cstm-secondary:not(:disabled):not(.disabled).active,
.show > .btn-cstm-secondary.dropdown-toggle {
    color: #FFFFFF;
    background-color: #738fb8;
    border-color: #6b88b3;
}

.btn-cstm-secondary:not(:disabled):not(.disabled):active:focus,
.btn-cstm-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-cstm-secondary.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 170, 201, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(149, 170, 201, 0.5);
}


/* Dropdown menu */
.show .btn-group.show .dropdown-toggle,
.show .dropdown-toggle,
.show.dropdown-default .dropdown-toggle {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.dropdown-default {
    display: inline-block;
}

.dropdown-default.toggle-only {
    padding-left: 9px;
    padding-right: 9px;
}

.dropdown-default.toggle-only:after {
    position: initial;
}

.dropdown-default.show > .btn.dropdown-toggle {
    border-color: transparent !important;
    background: transparent !important;
    z-index: 791 !important;
    color: #4b4b4b;
}

.dropdown-default.show .dropdown-menu {
    opacity: 1;
    -webkit-transform: scale(1, 1) !important;
    -ms-transform: scale(1, 1) !important;
    transform: scale(1, 1) !important;
    z-index: 700;
    pointer-events: all;
}

.dropdown-default.show .dropdown-menu .dropdown-item {
    visibility: visible;
}

.dropdown-default.show.dropup > .btn-primary + .dropdown-menu:after,
.dropdown-default.show.dropup > .btn-success + .dropdown-menu:after,
.dropdown-default.show.dropup > .btn-complete + .dropdown-menu:after,
.dropdown-default.show.dropup > .btn-warning + .dropdown-menu:after,
.dropdown-default.show.dropup > .btn-danger + .dropdown-menu:after,
.dropdown-default.show.dropup > .btn-info + .dropdown-menu:after {
    top: auto;
    bottom: 0;
}

.dropdown-default.show > .btn-primary + .dropdown-menu:after,
.dropdown-default.show > .btn-success + .dropdown-menu:after,
.dropdown-default.show > .btn-complete + .dropdown-menu:after,
.dropdown-default.show > .btn-warning + .dropdown-menu:after,
.dropdown-default.show > .btn-danger + .dropdown-menu:after,
.dropdown-default.show > .btn-info + .dropdown-menu:after {
    top: 0;
    height: 42px;
}

.dropdown-default.show > .btn-primary + .dropdown-menu:after {
    background-color: #F47104;
}

.dropdown-default.show > .btn-success + .dropdown-menu:after {
    background-color: #19AD79;
}

.dropdown-default.show > .btn-complete + .dropdown-menu:after {
    background-color: #0072EC;
}

.dropdown-default.show > .btn-warning + .dropdown-menu:after {
    background-color: #FFd945;
}

.dropdown-default.show > .btn-danger + .dropdown-menu:after {
    background-color: #D83C31;
}

.dropdown-default.show > .btn-info + .dropdown-menu:after {
    background-color: #3B4752;
}

.dropdown-default.dropup .btn.dropdown-toggle.btn-lg + .dropdown-menu {
    margin-bottom: -47px;
    padding-bottom: 49px;
}

.dropdown-default.dropup .btn.dropdown-toggle.btn-lg + .dropdown-menu:after {
    bottom: 49px;
}

.dropdown-default.dropup .btn.dropdown-toggle.btn-sm + .dropdown-menu {
    margin-bottom: -34px;
    padding-bottom: 36px;
}

.dropdown-default.dropup .btn.dropdown-toggle.btn-sm + .dropdown-menu:after {
    bottom: 36px;
}

.dropdown-default.dropup .btn.dropdown-toggle.btn-xs + .dropdown-menu {
    margin-bottom: -29px;
    padding-bottom: 31px;
}

.dropdown-default.dropup .btn.dropdown-toggle.btn-xs + .dropdown-menu:after {
    bottom: 31px;
}

.dropdown-default.dropup .dropdown-menu {
    margin-bottom: -35px;
    padding: 0 3px 44px 0 !important;
    -webkit-transform-origin: center bottom 0;
    -ms-transform-origin: center bottom 0;
    transform-origin: center bottom 0;
    top: auto !important;
    bottom: 100% !important;
}

.dropdown-default.dropup .dropdown-menu:after {
    bottom: 40px;
    top: auto !important;
}

.dropdown-default .btn.dropdown-toggle {
    height: 100%;
    text-align: left;
    padding-right: 27px;
}

.dropdown-default .btn.dropdown-toggle.btn-lg {
    padding-right: 26px;
}

.dropdown-default .btn.dropdown-toggle.btn-lg:after {
    right: 13px;
}

.dropdown-default .btn.dropdown-toggle.btn-lg + .dropdown-menu {
    padding-top: 39px;
    width: 100% !important;
}

.dropdown-default .btn.dropdown-toggle.btn-lg + .dropdown-menu:after {
    top: 39px;
}

.dropdown-default .btn.dropdown-toggle.btn-sm {
    padding-right: 18px;
}

.dropdown-default .btn.dropdown-toggle.btn-sm:after {
    right: 16px;
}

.dropdown-default .btn.dropdown-toggle.btn-sm + .dropdown-menu {
    padding-top: 36px;
}

.dropdown-default .btn.dropdown-toggle.btn-sm + .dropdown-menu:after {
    top: 36px;
}

.dropdown-default .btn.dropdown-toggle.btn-xs {
    padding-right: 17px;
}

.dropdown-default .btn.dropdown-toggle.btn-xs:after {
    right: 8px;
}

.dropdown-default .btn.dropdown-toggle.btn-xs + .dropdown-menu {
    padding-top: 31px;
}

.dropdown-default .btn.dropdown-toggle.btn-xs + .dropdown-menu:after {
    top: 31px;
}

.dropdown-default .btn.dropdown-toggle:after {
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -2px;
}

.dropdown-default .btn-rounded {
    padding-left: 17px;
    padding-right: 17px;
}

.dropdown-default .btn-rounded + .dropdown-menu {
    border-radius: 17px;
}

.dropdown-default .dropdown-menu {
    margin-top: -4px;
    width: 100%;
    padding-top: 35px;
    padding-bottom: 4px;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: block;
    opacity: 0;
    -webkit-transform: scale(1, 0) !important;
    -ms-transform: scale(1, 0) !important;
    transform: scale(1, 0) !important;
    -webkit-transform-origin: center top 0;
    -ms-transform-origin: center top 0;
    transform-origin: center top 0;
    -webkit-transition: all 170ms cubic-bezier(0.05, 0.74, 0.27, 0.99) 0s;
    -o-transition: all 170ms cubic-bezier(0.05, 0.74, 0.27, 0.99) 0s;
    transition: all 170ms cubic-bezier(0.05, 0.74, 0.27, 0.99) 0s;
    z-index: -1;
}

.dropdown-default .dropdown-menu:after {
    content: "";
    position: absolute;
    height: 1px;
    left: 0;
    top: 35px;
    background: #e0e0e0;
    width: 100%;
}

.dropdown-default .dropdown-menu li,
.dropdown-default .dropdown-menu .dropdown-item {
    visibility: hidden;
}

.navbar-nav .dropdown-menu {
    position: absolute;
}

.dropdown-menu {
    position: absolute;
    display: none;
    float: left;
    list-style: none;
    text-shadow: none;
    max-width: calc(100vw - 24px);
    -webkit-box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px,
    rgba(15, 15, 15, 0.1) 0px 3px 6px,
    rgba(15, 15, 15, 0.2) 0px 9px 24px;
    box-shadow: rgba(15, 15, 15, 0.05) 0px 0px 0px 1px,
    rgba(15, 15, 15, 0.1) 0px 3px 6px,
    rgba(15, 15, 15, 0.2) 0px 9px 24px;
    border: none;
    padding-top: 4px;
    padding-bottom: 4px;
    border-radius: 3px;
    font-size: 12px;
    margin-top: 5px;
    background: #fff;
    min-width: initial;
    z-index: 700 !important;
}

.dropdown-menu .divider {
    background-color: #e0e0e0;
    height: 1px;
    margin: 3px 0;
    border-bottom: 0px;
}

.dropdown-menu > li,
.dropdown-menu > .dropdown-item {
    line-height: 20px;
    color: #4b4b4b;
    padding: 4px 8px 4px 6px;
    border-radius: 3px;
    display: block;
    clear: both;
    white-space: nowrap;
    text-align: left;
}

.dropdown-menu > li:hover,
.dropdown-menu > li:focus,
.dropdown-menu > li:active,
.dropdown-menu > .dropdown-item:hover,
.dropdown-menu > .dropdown-item:focus,
.dropdown-menu > .dropdown-item:active {
    background-color: transparent;
}

.dropdown-menu > li.dropdown-header,
.dropdown-menu > .dropdown-item.dropdown-header {
    padding: 3px 20px;
}

.dropdown-menu > li.active > a,
.dropdown-menu > li.active > a:hover,
.dropdown-menu > li.active > a:focus,
.dropdown-menu > li.active,
.dropdown-menu > li.active:hover,
.dropdown-menu > li.active:focus,
.dropdown-menu > .dropdown-item.active > a,
.dropdown-menu > .dropdown-item.active > a:hover,
.dropdown-menu > .dropdown-item.active > a:focus,
.dropdown-menu > .dropdown-item.active,
.dropdown-menu > .dropdown-item.active:hover,
.dropdown-menu > .dropdown-item.active:focus {
    color: #212121;
    text-decoration: none;
    background-color: #f4f4f4;
    border-radius: 0;
}

.dropdown-menu > li.disabled > a,
.dropdown-menu > li.disabled > a:hover,
.dropdown-menu > li.disabled > a:focus,
.dropdown-menu > li.disabled,
.dropdown-menu > li.disabled:hover,
.dropdown-menu > li.disabled:focus,
.dropdown-menu > .dropdown-item.disabled > a,
.dropdown-menu > .dropdown-item.disabled > a:hover,
.dropdown-menu > .dropdown-item.disabled > a:focus,
.dropdown-menu > .dropdown-item.disabled,
.dropdown-menu > .dropdown-item.disabled:hover,
.dropdown-menu > .dropdown-item.disabled:focus {
    color: #7e7e7e;
}

.dropdown-menu > li.disabled > a:hover,
.dropdown-menu > li.disabled > a:focus,
.dropdown-menu > li.disabled:hover,
.dropdown-menu > li.disabled:focus,
.dropdown-menu > .dropdown-item.disabled > a:hover,
.dropdown-menu > .dropdown-item.disabled > a:focus,
.dropdown-menu > .dropdown-item.disabled:hover,
.dropdown-menu > .dropdown-item.disabled:focus {
    text-decoration: none;
    cursor: default;
}

.dropdown-menu > li > a,
.dropdown-menu > .dropdown-item > a {
    line-height: 35px;
    color: #4b4b4b;
    padding: 0 20px;
    border-radius: 3px;
    display: block;
    clear: both;
    white-space: nowrap;
    text-align: left;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > .dropdown-item > a:hover,
.dropdown-menu > .dropdown-item > a:focus {
    color: #212121;
    text-decoration: none;
    background-color: transparent;
    background-image: none;
}

.dropdown-menu > a.dropdown-item:hover,
.dropdown-menu > a.dropdown-item:focus,
.dropdown-menu > a.dropdown-item:active {
    color: #212121;
    text-decoration: none;
    background-color: #d3eeff;
}

.dropdown-menu > li {
    padding: 0;
}

.dropdown-menu > a {
    line-height: 35px;
    color: #4b4b4b;
    padding: 0 20px;
    border-radius: 3px;
    display: block;
    clear: both;
    white-space: nowrap;
    text-align: left;
}

.dropdown-menu > a:hover,
.dropdown-menu > a:focus {
    color: #212121;
    text-decoration: none;
    background-color: transparent;
    background-image: none;
}

.dropdown-menu > li {
    padding: 0;
}

.dropdown-backdrop {
    z-index: 600;
}

.btn-animated {
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.btn-animated > span:first-child {
    display: inline-block;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.btn-animated > .hidden-block {
    position: absolute;
    height: 100%;
    width: 100%;
    font-size: 100%;
    line-height: 1.9;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all 220ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
    -o-transition: all 220ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
    transition: all 220ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
}

.btn-animated:after {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-transition: all 380ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
    -o-transition: all 380ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
    transition: all 380ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
}

.btn-animated.from-top > .hidden-block {
    left: 0;
    top: -100%;
}

.btn-animated.from-top:hover > .hidden-block,
.btn-animated.from-top.show-icon > .hidden-block {
    top: 0;
}

.btn-animated.from-top:hover > span:first-child,
.btn-animated.from-top.show-icon > span:first-child {
    -webkit-transform: translateY(300%);
    -ms-transform: translateY(300%);
    transform: translateY(300%);
}

.btn-animated.from-left > .hidden-block {
    left: -100%;
    top: 0;
}

.btn-animated.from-left:hover > .hidden-block,
.btn-animated.from-left.show-icon > .hidden-block {
    left: 0;
}

.btn-animated.from-left:hover > span:first-child,
.btn-animated.from-left.show-icon > span:first-child {
    -webkit-transform: translateX(200%);
    -ms-transform: translateX(200%);
    transform: translateX(200%);
}

.btn-tag {
    background: transparent;
    color: #EB2D00;
    border-radius: 99px;
    border: 1px solid rgba(33, 33, 33, 0.14);
}

.btn-tag:hover {
    border: 1px solid rgba(33, 33, 33, 0.14);
}

.btn-tag:active {
    background: rgba(33, 33, 33, 0.14);
}

.btn-tag:before {
    content: "#";
    font-size: 12px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    margin-right: 3px;
    color: inherit;
}

.btn-chip {
    border-radius: 99px;
    background: #e0e0e0;
    border-color: transparent;
    -webkit-transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-chip.active {
    background: #e0e0e0;
    border-color: transparent;
    padding-left: 4px;
}

.btn-chip.active i {
    width: 20px;
}

.btn-chip:hover:not(.active) {
    background: #c7c6c6;
}

.btn-chip i {
    width: 0px;
    overflow: hidden;
    -webkit-transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    transition: width 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-icon {
    padding: 0;
}

.btn-toolbar .btn-group {
    margin-right: 14px;
}

.btn-toolbar .btn {
    padding-left: 5px;
    padding-right: 5px;
}

.pager .disabled > button,
.pager .disabled > button:hover,
.pager .disabled > button:focus,
.pager .disabled > span {
    cursor: not-allowed;
    opacity: 0.5;
}

.modal-content a.btn-primary:not([href]):not([tabindex]) {
    color: #fff;
}

.modal-content a.btn-primary:not([href]):not([tabindex]):hover,
.modal-content a.btn-primary:not([href]):not([tabindex]):focus {
    color: #fff;
}


/*------------------------------------------------------------------
[05. Table]
------------------------------------------------------------------*/
.table {
    margin-bottom: 0;
    margin-top: 5px;
    color: #525f7f;
}

.table thead tr th {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.06em;
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 20px;
    vertical-align: middle;
    border-bottom: 1px solid rgba(224, 224, 224, 0.7);
    border-top: none;
}

.table thead tr th[class*="sorting_"]:not([class="sorting_disabled"]) {
    color: #4b4b4b;
}

.table thead tr th:first-child {
    padding-left: 18px !important;
}

.table thead tr th .btn {
    margin-top: -20px;
    margin-bottom: -20px;
}

.table tbody tr td {
    background: #fff;
    border-bottom: 1px solid rgba(224, 224, 224, 0.7);
    border-top: 0px;
    padding: 20px;
    font-size: 14px;
}

.table tbody tr td .btn-tag {
    margin: 5px;
}

.table tbody tr td .btn-tag:hover {
    background: rgba(33, 33, 33, 0.15);
}

.table tbody tr td[class*="sorting_"] {
    color: #4b4b4b;
}

.table tbody tr td .checkbox label::after {
    left: 0.5px;
}

.table tbody tr.selected td {
    background: #fffde1;
    color: #4b4b4b;
}

.table.table-hover tbody tr:hover td {
    background: #f9f9f9 !important;
}

.table.table-hover tbody tr.selected:hover td {
    background: #fffde1 !important;
    color: #4b4b4b;
}

.table.table-striped tbody tr td {
    background: #fffde1 !important;
}

.table.table-striped tbody tr:nth-child(2n + 1) td {
    background: #fff !important;
}

.table.table-borderless tbody tr td {
    border-top: 0;
}

.table.table-condensed {
    table-layout: fixed;
}

.table.table-condensed thead tr th {
    padding-left: 20px;
    padding-right: 20px;
}

.table.table-condensed tbody tr td {
    padding-top: 12px;
    padding-bottom: 12px;
}

.table.table-condensed thead tr th,
.table.table-condensed tbody tr td,
.table.table-condensed tbody tr td *:not(.dropdown-default) {
    white-space: nowrap;
    vertical-align: middle;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.table.table-condensed thead tr th.reset-overflow *,
.table.table-condensed tbody tr td.reset-overflow *,
.table.table-condensed tbody tr td *:not(.dropdown-default).reset-overflow * {
    overflow: initial !important;
}

.table.table-condensed.table-detailed > tbody > tr.shown > td {
    background: #fffde1;
}

.table.table-condensed.table-detailed > tbody > tr.shown > td:first-child:before {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.table.table-condensed.table-detailed > tbody > tr.shown + tr > td {
    background: rgba(244, 244, 244, 0.4);
    padding: 0px 40px;
}

.table.table-condensed.table-detailed > tbody > tr.shown + tr > td .table-inline {
    margin-top: 13px;
    margin-bottom: 13px;
    background: transparent;
}

.table.table-condensed.table-detailed > tbody > tr.shown + tr > td .table-inline tr,
.table.table-condensed.table-detailed > tbody > tr.shown + tr > td .table-inline td {
    background: transparent;
    font-weight: 600;
}

.table.table-condensed.table-detailed > tbody > tr.row-details > td:first-child:before {
    content: "";
    display: none;
}

.table.table-condensed.table-detailed > tbody > tr > td:hover {
    cursor: pointer;
}

.table.table-condensed.table-detailed > tbody > tr > td:first-child:before {
    content: "\e988";
    display: inline-block;
    font-size: 16px;
    top: -1px;
    position: relative;
    margin-right: 8px;
    font-family: "Font Awesome 5 Pro";
    -webkit-transition: all 0.12s linear;
    -o-transition: all 0.12s linear;
    transition: all 0.12s linear;
}

.table.table-condensed.table-detailed .table-inline td {
    border: none;
    text-align: left;
}

.table.table-borderless > tbody > tr > td {
    border-bottom: 0px;
}

.fht-table {
    margin-bottom: 0 !important;
}

/* Data-tables */
.table.dataTable.no-footer {
    border: none;
}

.dataTables_scroll:hover .dataTables_scrollBody:before {
    content: "";
    top: 0;
    height: 0;
}

.dataTables_scrollBody {
    overflow-y: auto;
    border: none !important;
}

.dataTables_scrollBody:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 60px;
    bottom: 0;
    background: transparent;
}

.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_filter label .form-group {
    margin: 0;
}

.dataTables_wrapper .dataTables_info {
    clear: none;
    padding-left: 20px !important;
    padding-top: 3px !important;
}

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_paginate {
    margin-top: 25px !important;
}

.dataTables_paginate.paging_bootstrap.pagination {
    padding-top: 0;
    padding-right: 20px;
}

.dataTables_wrapper .dataTables_paginate {

}

.dataTables_wrapper .dataTables_paginate .pagination {
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    padding: 0;
}

.dataTables_wrapper .dataTables_paginate ul > li {
    display: inline-block;
    padding-left: 5px;
    font-size: 11px;
}

.dataTables_wrapper .dataTables_paginate ul > li > a {
    padding: 6px 10px;
    color: #4b4b4b;
    opacity: 1;
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.dataTables_wrapper .dataTables_paginate ul > li:not(.active) > a:hover {
    border: 1px solid #000;
    background: transparent !important;
    opacity: 1;
}

.dataTables_wrapper .dataTables_paginate ul > li.next > a,
.dataTables_wrapper .dataTables_paginate ul > li.previous > a,
.dataTables_wrapper .dataTables_paginate ul > li.last > a,
.dataTables_wrapper .dataTables_paginate ul > li.first > a {
    opacity: 1;
}

.dataTables_wrapper .dataTables_paginate ul > li.disabled a {
    opacity: 0.5;
}

.dataTables_wrapper .dataTables_paginate ul > li.disabled a:hover {
    opacity: 0.5;
}

.dataTables_wrapper .dataTables_paginate ul > li.active > a {
    color: #fff !important;
    background-color: var(--color-blue_900);
    border: 1px solid var(--color-blue_900);
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    opacity: 1;
}

.dataTables_wrapper .dataTables_paginate .page-item .page-link,
.dataTables_wrapper .dataTables_paginate .pagination-lg .page-item .page-link,
.dataTables_wrapper .dataTables_paginate .pagination-sm .page-item .page-link {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.dataTables_wrapper .dataTables_paginate .page-item:first-child .page-link,
.dataTables_wrapper .dataTables_paginate .pagination-lg .page-item:first-child .page-link,
.dataTables_wrapper .dataTables_paginate .pagination-sm .page-item:first-child .page-link {
    border-radius: 0 !important;
}

.dataTables_wrapper .dataTables_paginate .page-item:last-child .page-link,
.dataTables_wrapper .dataTables_paginate .pagination-lg .page-item:last-child .page-link,
.dataTables_wrapper .dataTables_paginate .pagination-sm .page-item:last-child .page-link {
    border-radius: 0 !important;
}

.dataTables_scrollHeadInner {
    padding-right: 0 !important;
}

.export-options-container {
    position: relative;
}

.export-options-container a {
    color: inherit;
    opacity: 1;
}

.exportOptions .DTTT.btn-group a {
    display: block !important;
}

table.dataTable thead .sorting_asc:after {
    background-image: url("../img/icons/sort_asc.png");
}

table.dataTable thead .sorting_desc:after {
    background-image: url("../img/icons/sort_desc.png");
}

table.dataTable thead .sorting:after {
    background-image: url("../img/icons/sort_both.png");
}

table.dataTable thead .sorting_asc_disabled:after {
    background-image: url("../img/icons/sort_asc_disabled.png");
}

table.dataTable thead .sorting_desc_disabled:after {
    background-image: url(".../img/icons/sort_desc_disabled.png");
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
    bottom: 12px;
    content: "";
    width: 19px;
    height: 19px;
    background-position: center center;
    opacity: 1;
}

table.dataTable.table-condensed .sorting:after,
table.dataTable.table-condensed .sorting_asc:after,
table.dataTable.table-condensed .sorting_desc:after {
    top: 12px;
}


/* Responsive Handlers : Tables */
@media (max-width: 991px) {
    .dataTables_wrapper .dataTables_info {

    }

    .dataTables_paginate.paging_bootstrap.pagination {

    }
}

@media (max-width: 767px) {
    .table-responsive {
        /*border: 1px solid #ddd;*/
    }

    .dataTables_wrapper .row {
        margin: 0;
    }

    .dataTables_wrapper .row > div {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        /* margin-top: 0 !important; */
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 10px;
    }

    .dataTables_wrapper .dataTables_info ul,
    .dataTables_wrapper .dataTables_paginate ul {
        padding: 0;
    }
}

@media (max-width: 480px) {
    .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
        float: none;
        text-align: left;
        clear: both;
        display: block;
    }
}


/*------------------------------------------------------------------
[06. Card]]
------------------------------------------------------------------*/
.card {
    -webkit-box-shadow: 0 1px 2px 0 rgba(33, 33, 33, 0.14), 0 0 1px 0 rgba(0, 0, 0, 0.14);
    box-shadow: 0 1px 2px 0 rgba(33, 33, 33, 0.14), 0 0 1px 0 rgba(0, 0, 0, 0.14);
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border: 0px solid transparent;
    position: relative;
    margin-bottom: 20px;
    width: 100%;
    word-wrap: none;
    background: #fff;
}

.card .card-header {
    background: transparent;
    border-radius: 0;
    border-bottom: 0;
    padding: 16px 20px 16px 20px;
    position: relative;
    /* z-index: 3; */
    min-height: 42px;
}

.card .card-header.separator:after {
    content: "";
    height: 1px;
    background: rgba(0, 0, 0, 0.08);
    left: 0;
    width: 100%;
    position: absolute;
    bottom: 0;
}

.card .card-header + .card-body {
    padding-top: 10px;
}

.card .card-header .card-title {
    /* text-transform: uppercase; */
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    margin: 0;
    padding: 0;
    line-height: normal;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-text-stroke: 0px;
    /*  
  filter: alpha(opacity=40);
  -webkit-transition: opacity 0.3s ease;
          transition: opacity 0.3s ease;
*/
}

.card .card-header .card-controls {
    float: right;
    margin-top: 2px;
}

.card .card-header .card-controls ul {
    margin: 0;
    padding: 0;
}

.card .card-header .card-controls ul li {
    padding-left: 0px;
    display: inline-block;
    list-style: none;
    line-height: 0;
}

.card .card-header .card-controls:after {
    content: "";
    display: table;
    clear: both;
}

.card .card-header.card-header-hover .card-title {
    opacity: 0.4;
}

.card .card-header.card-header-hover:hover .card-title {
    opacity: 1;
}

.card.card-collapsed .card-header .card-controls .card-icon-collapse:before {
    content: "\f078";
}

.card.card-maximized .card-header .card-controls .card-icon-maximize:before {
    content: "\f422";
}

.card.card-default {
    border: 0px solid transparent;
    -webkit-box-shadow: 0 1px 2px 0 transparent, 0 0 1px 0 rgba(0, 0, 0, 0);
    box-shadow: 0 1px 2px 0 transparent, 0 0 1px 0 rgba(0, 0, 0, 0);
    border-radius: 4px;
}

.card.card-default > .card-header {
    color: inherit;
}

.card.card-default > .card-header.work-wishlist-name{
    padding: 17px 0!important;
}

.card.card-default > .card-header.work-wishlist-name .card-title{
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}

.card.card-default > .card-header.work-wishlist-name .card-title button{
    background: #F76E33 url("../img/icons/icon_wishlist_arrow.png")no-repeat calc(100% - 10px) center!important;
    background-size: 7px!important;
    border-radius: 4px;
    padding: 0;
    padding-left: 8px;
    width: 139px;
    justify-content: left;
    border: none!important;
}

.card.card-bordered {
    border: 1px solid rgba(224, 224, 224, 0.7);
}

.card.card-borderless {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.card.card-condensed .card-header {
    padding: 9px 13px 0 13px;
    min-height: 32px;
}

.card.card-condensed .card-header .card-title {
    opacity: 0.4;
}

.card.card-condensed .card-body {
    padding: 13px;
}

.card.card-hover .card-header .card-title {
    opacity: 0.4;
}

.card.card-hover:hover .card-header .card-title {
    opacity: 1;
}

.card.card-transparent {
    background: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.card.card-transparent .card-body {
    background: transparent;
}

.card.full-height {
    height: 100%;
}

.card.full-height .card-body {
    height: auto;
    width: 100%;
    height: 100%;
}

.card.card-featured {
    -webkit-box-shadow: -1px 1px 3px 0px rgba(121, 129, 135, 0.14);
    box-shadow: -1px 1px 3px 0px rgba(121, 129, 135, 0.14);
    width: calc(100% - 50px);
    float: right;
}

.card.card-featured .card-title h4 {
    font-size: 16px;
    text-transform: uppercase;
    color: inherit;
}

.card.card-featured .card-body h3 {
    line-height: 34px;
    font-size: 26px;
}

.card.card-featured .footer .username {
    line-height: 8px;
    padding-top: 10px;
    font-size: 16px;
}

.card.card-featured .footer .buttons li {
    display: inline;
    list-style: none;
    font-weight: bold;
    margin-left: 20px;
}

.card.card-featured .footer .buttons li:first-child {
    margin-left: 0;
}

.card.card-featured .footer .buttons .heart {
    color: #D83C31;
}

.card.card-featured .footer .buttons .comment {
    color: #4b4b4b;
}

.card.card-featured .ribbon {
    width: 38px;
    height: 38px;
    margin-left: -39px;
    float: left;
    -webkit-box-shadow: inset -3px 0px 3px 0px rgba(0, 0, 0, 0.14);
    box-shadow: inset -3px 0px 3px 0px rgba(0, 0, 0, 0.14);
}

.card.card-featured .ribbon.green {
    background: #0072EC;
}

.card.card-featured .ribbon.blue {
    background: #19AD79;
}

.card.hover-fill:hover {
    background: #f4f4f4;
}

.card.hover-stroke:hover {
    border: 1px solid #e0e0e0;
}

.card .card-body {
    padding: 20px;
}

.card .card-body.mypage-work-wishlist{
    padding-left: 0;
    padding-right: 0;
}

.card .card-body.no-padding .row {
    margin-left: 0;
    margin-right: 0;
}

.card .card-body.no-bottom-padding {
    padding-bottom: 0;
}

.card .card-body.no-top-padding {
    padding-top: 0;
}

.card .card-body .title {
    margin-top: 0px;
}

.card .card-body.scrollable {
    margin-bottom: 20px;
}

.card .card-body .separator:after {
    content: "";
    height: 1px;
    background: rgba(0, 0, 0, 0.08);
    /*    left: 20px;
    right: 20px;*/
    position: absolute;
    bottom: 0;
}

.card-progress {
    background: rgba(255, 255, 255, 0.8);
    bottom: 0;
    left: 0;
    position: absolute !important;
    right: 0;
    top: 0;
    display: none;
    z-index: 2;
}

.card-progress > .progress,
.card-progress > .progress.progress-small {
    height: 3px;
}

.card-progress > .progress-circle-indeterminate,
.card-progress > .card-bar-indeterminate {
    display: block;
    left: 50%;
    margin-left: -17px;
    margin-top: -17px;
    position: absolute;
    top: 50%;
}

.card-progress > .progress-circle-indeterminate {
    width: 35px;
    height: 35px;
}

.card-maximized {
    position: fixed !important;
    left: 280px;
    top: 59px;
    bottom: 0;
    right: 0;
    z-index: 600;
    margin: 0;
    width: auto;
}

.card-header a:not(.btn) {
    color: inherit;
    opacity: 0.4;
    padding-top: 10px;
    padding-bottom: 10px;
}

.card-header a:not(.btn).card-refresh {
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.card-header a:not(.btn).card-refresh.refreshing {
    opacity: 1;
}

.card-header .dropdown-menu .dropdown-item {
    padding: 0 20px !important;
}

.card-header .dropdown-menu .dropdown-item:hover {
    opacity: 1;
    background-color: transparent;
}

.card-header a[data-toggle]:hover {
    opacity: 1;
}

.card-icon {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    font-family: "Font Awesome 5 Pro";
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    text-transform: none;
    speak: none;
    color: inherit;
}

.card-icon-close:before {
    content: "\f00d";
    font-weight: 300;
}

.card-icon-maximize:before {
    content: "\f424";
    font-weight: 300;
}

.card-icon-refresh:before {
    content: "\f111";
    font-weight: 400;
}

.card-icon-collapse:before {
    content: "\f077";
    font-weight: 400;
}

.card-icon-settings:before {
    content: "\f141";
    font-weight: 400;
}

.card-icon-refresh-lg-master,
.card-icon-refresh-lg-white {
    width: 15px;
    height: 15px;
    display: block;
    background-size: cover;
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.card-icon-refresh-lg-master.fade,
.card-icon-refresh-lg-white.fade {
    opacity: 0.1;
}

.card-icon-refresh-lg-master {
    background-image: url("../img/progress/progress-circle-lg-master-static.svg");
}

.card-icon-refresh-lg-white {
    background-image: url("../img/progress/progress-circle-lg-white-static.svg");
}

.card-icon-refresh-lg-master-animated,
.card-icon-refresh-lg-white-animated {
    width: 15px;
    height: 15px;
    display: block;
    background-size: cover;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.card-icon-refresh-lg-master-animated.active,
.card-icon-refresh-lg-white-animated.active {
    opacity: 1;
}

.card-icon-refresh-lg-master-animated {
    background-image: url("../img/progress/progress-circle-lg-master.svg");
}

.card-icon-refresh-lg-white-animated {
    background-image: url("../img/progress/progress-circle-lg-white.svg");
}

/* Panel Group */
.card-group {
    margin-bottom: 18px;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.card-group.horizontal {
    display: block;
}

.card-group .card-header {
    padding: 13px 18px 13px 22px;
}

.card-group .card-header.collapsed {
    background-color: #fff;
}

.card-group .card-header + .card-collapse .card-body {
    border: 0;
}

.card-group .card-header .card-title {
    width: 100%;
}

.card-group .card-header .card-title > a {
    color: #525f7f;
    font-size: inherit;
    padding: inherit;
    margin: inherit;
    display: block;
    opacity: 1;
}

.card-group .card-header .card-title > a:hover {
    color: #212121 !important;
}

.card-group .card-header .card-title > a:hover:after {
    color: #212121 !important;
}

.card-group .card-header .card-title > a:after {
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    content: "\f077";
    font-size: 16px;
    position: absolute;
    right: 20px;
    top: 36%;
    color: inherit;
    opacity: 0.4;
}

.card-group .card-header .card-title > a.collapsed {
    color: #525f7f;
    opacity: 1;
}

.card-group .card-header .card-title > a.collapsed:after {
    content: "\f078";
    opacity: 0.4;
}

.card-group .card {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid rgba(33, 33, 33, 0.14);
    -webkit-box-flex: 1;
    -ms-flex: 1 0 0;
    flex: 1 0 0;
}

.card-group .card + .card {
    margin-top: 2px;
}

.card-group .card .card-body {
    height: auto;
}

.card-group .card.card-default {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid rgba(33, 33, 33, 0.1);
}

/*4월1일수정*/
.card-default.show {
    border: 1px solid #F47104 !important;
}

.card.selected {
    border: 2px solid #F47104 !important;
    -webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}


/*------------------------------------------------------------------
[07. Alert]
------------------------------------------------------------------*/
.alert {
    background-image: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    text-shadow: none;
    padding: 9px 19px 9px 15px;
    border-radius: 3px;
    font-size: 12px;
    border-width: 0;
    -webkit-transition: all 0.2s linear 0s;
    -o-transition: all 0.2s linear 0s;
    transition: all 0.2s linear 0s;
}

.alert.bordered {
    border-width: 1px;
}

.alert .link {
    color: #ce8f22;
    font-weight: bold;
}

.alert .alert-heading {
    color: #ce8f22 !important;
    margin-bottom: 5px;
    font-weight: 600;
}

.alert .btn-small {
    position: relative;
    top: -3.5px;
}

.alert .button-set .btn {
    position: relative;
    top: 8px;
}

.alert .close {
    background: url("../img/icons/noti-cross.png") no-repeat scroll 0 0 transparent;
    background-position: -9px -10px;
    width: 10px;
    height: 9px;
    position: relative;
    opacity: 0.8;
    top: 4.5px;
    float: right;
    margin-left: 20px;
    font-size: 0;
    padding: 0;
}

.alert .close:hover {
    opacity: 1;
}

.alert-danger,
.alert-error {
    background-color: #fde2da;
    color: #900f17;
    border-color: rgba(144, 15, 23, 0.24);
}

.alert-danger .close,
.alert-error .close {
    background-position: -95px -10px !important;
}

.alert-warning {
    background-color: #fffde1;
    color: #aa7918;
    border-color: rgba(170, 121, 24, 0.24);
}

.alert-info {
    background-color: #d3eeff;
    color: #00318e;
    border-color: rgba(0, 49, 142, 0.24);
}

.alert-info .close {
    background-position: -67px -10px !important;
}

.alert-success {
    background-color: #d6f7f0;
    color: #04733e;
    border-color: rgba(4, 115, 62, 0.24);
}

.alert-success .close {
    background-position: -38px -10px !important;
}

.alert-default {
    background-color: #fff;
    color: #4b4b4b;
    border-color: #e0e0e0;
}

.alert-default .close {
    background-position: -67px -10px !important;
}

.badge {
    text-shadow: none;
    font-weight: 600;
    background-color: #e0e0e0;
    font-size: 11px;
    padding-left: 6px;
    padding-right: 6px;
    padding-bottom: 4px;
    color: #4b4b4b;
    border-radius: 10px;
}

.badge-success {
    background-color: #19AD79;
    color: #fff;
}

.badge-warning {
    background-color: #FFd945;
    color: #fff;
}

.badge-important {
    background-color: #D83C31;
    color: #fff;
}

.badge-danger {
    background-color: #D83C31;
    color: #fff;
}

.badge-info {
    background-color: #3B4752;
    color: #fff;
}

.badge-inverse {
    background-color: #00318e;
    color: #fff;
}

.badge-white {
    background-color: #fff;
    color: #4b4b4b;
}

.badge-disable {
    background-color: #212121;
    color: #4b4b4b;
}

.tooltip-inner {
    font-size: 12px;
}

.popover {
    border: 1px solid rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 0 9px rgba(191, 191, 191, 0.36);
    box-shadow: 0 0 9px rgba(191, 191, 191, 0.36);
    z-index: 790;
}


/*------------------------------------------------------------------
[08. Modal]
------------------------------------------------------------------*/

.modal .close {
    position: absolute;
    right: 20px;
    top: 20px;
}

.modal .close:focus {
    outline: 0;
}

.modal[data-popup=true] {
    position: relative;
    top: unset;
    left: unset;
    right: unset;
    bottom: unset;
    width: unset;
    height: unset;
}

.modal[data-popup=true].fade.modal-top-left .modal-dialog,
.modal[data-popup=true].fade.modal-top-right .modal-dialog,
.modal[data-popup=true].fade.modal-bottom-right .modal-dialog,
.modal[data-popup=true].fade.modal-bottom-left .modal-dialog,
.modal[data-popup=true].fade.modal-bottom-center .modal-dialog {
    position: fixed;
}

.modal[data-popup=true].fade .modal-content {
    -webkit-box-shadow: 0 20px 60px -2px rgba(18, 21, 35, 0.19);
    box-shadow: 0 20px 60px -2px rgba(18, 21, 35, 0.19);
}

.modal .modal-dialog {
    -webkit-transition: all 0.2s !important;
    -o-transition: all 0.2s !important;
    transition: all 0.2s !important;
}

.modal .modal-dialog.modal-full-width {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    left: 0 !important;
    right: 0 !important;
}

.modal .modal-content {
    border: 0;
    border-radius: 0px;
}

.modal .modal-header {
    position: relative;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    text-align: left;
    border-bottom: 0;
    padding: 10px 25px 0 25px;
}

.modal .modal-header h1,
.modal .modal-header h2,
.modal .modal-header h3,
.modal .modal-header h4,
.modal .modal-header h5,
.modal .modal-header p {
    font-weight: 500 !important;
    letter-spacing: -0.06em !important;
}

.modal .modal-body {
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 20px;
    /*
  padding-top: 0;
*/
    white-space: normal;
}

.modal .modal-footer {
    border-top: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin-top: 0;
    padding: 25px;
    padding-top: 0;
}

.modal .drop-shadow {
    -webkit-box-shadow: 0 0 9px rgba(191, 191, 191, 0.36) !important;
    box-shadow: 0 0 9px rgba(191, 191, 191, 0.36) !important;
}


.modal.fade.modal-top-left .modal-dialog {
    width: 100%;
    position: absolute;
    top: 0;
}

.modal.fade.modal-top-right .modal-dialog {
    width: 100%;
    position: absolute;
    top: 0;
}

.modal.fade.modal-bottom-right .modal-dialog {
    width: 100%;
    position: absolute;
    bottom: 0;
}

.modal.fade.modal-bottom-left .modal-dialog {
    width: 100%;
    position: absolute;
    bottom: 0;
}

.modal.fade.modal-bottom-center .modal-dialog {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
}


.modal.fade {
    opacity: 1 !important;
    padding-right: 0 !important;
}

.modal.fade.stick-up {
    /*&.in{
        .modal-dialog{
          @include translate3d(0,0,0);
        } 
      }*/
}

.modal.fade.stick-up .modal-dialog {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    -ms-transform: translate(0, -100%);
    margin-top: -5px;
}

.modal.fade.stick-up.show .modal-dialog {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -ms-transform: translate(0, 0);
}

.modal.fade.slide-up {
    height: 100%;
    top: 0;
    /*&.in{
          .modal-dialog{
          @include translate3d(0,0,0);
        }
      }*/
}

.modal.fade.slide-up.show .modal-dialog {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -ms-transform: translate(0, 0);
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.modal.fade.slide-up.disable-scroll {
    overflow: hidden;
}

.modal.fade.slide-up .modal-dialog {
    display: table;
    height: 100%;
    -webkit-transform: translate3d(0, 75%, 0);
    transform: translate3d(0, 75%, 0);
    -ms-transform: translate(0, 75%);
}

.modal.fade.slide-up .modal-content-wrapper {
    display: table-cell;
    vertical-align: middle;
}

.modal.fade.center-scale .modal-dialog {
    display: table;
    height: 100%;
}

.modal.fade.center-scale .modal-content {
    display: table-cell;
    vertical-align: middle;
    border: 0;
    background: transparent;
}

.modal.fade.center-scale .modal-content .modal-header {
    border-bottom: 0px;
}

.modal.fade.center-scale.show .modal-dialog {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.modal.fade.center-scale .modal-dialog {
    opacity: 0;
    -webkit-transform: scale(0.6);
    -ms-transform: scale(0.6);
    transform: scale(0.6);
}

.modal.fade.fill-in {
    background-color: rgba(255, 255, 255, 0);
    -webkit-transition: background-color 0.3s;
    -o-transition: background-color 0.3s;
    transition: background-color 0.3s;
    /*&.in{
        background-color: rgba(255, 255, 255, 0.85);
          .modal-dialog{
            opacity: 1;
          @include scale(1);
        }
      }*/
}

.modal.fade.fill-in > .close > i {
    font-size: 16px;
}

.modal.fade.fill-in .modal-dialog {
    display: table;
    height: 100%;
}

.modal.fade.fill-in .modal-content {
    display: table-cell;
    vertical-align: middle;
    border: 0;
    background: transparent;
}

.modal.fade.fill-in .modal-content .modal-header {
    border-bottom: 0px;
}

.modal.fade.fill-in.show {
    color: #fff;
    background-color: rgba(45, 52, 58, 0.9);
}

.modal.fade.fill-in.show .modal-dialog {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.modal.fade.fill-in .modal-dialog {
    opacity: 0;
    -webkit-transform: scale(0.6);
    -ms-transform: scale(0.6);
    transform: scale(0.6);
}

.modal.fade.slide-right .close {
    position: absolute;
    top: 0;
    right: 0;
    margin-right: 10px;
    z-index: 10;
}

.modal.fade.slide-right.show .modal-dialog {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -ms-transform: translate(0, 0);
}

.modal.fade.slide-right .modal-dialog {
    position: absolute;
    right: 0;
    margin: 0;
    height: 100%;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    -ms-transform: translate(100%, 0);
}

.modal.fade.slide-right .modal-dialog .modal-content-wrapper {
    height: 100%;
}

.modal.fade.slide-right .modal-dialog .modal-content {
    height: 100%;
}

.modal.fade.slide-right .modal-dialog .modal-body {
    background-color: #fff;
}

.modal.fade.slide-right .modal-content {
    border-radius: 0px;
}

.fill-in-modal .modal-backdrop {
    background-color: transparent;
}


.body-scrollable {
    overflow: unset;
    padding-right: unset !important;
}

.body-scrollable .modal-backdrop {
    display: none;
}

.modal-backdrop {
    background: #2d343a;
}

#modal-login > div > .modal-content > .modal-body > .close {
    max-width: 100%;
    cursor: pointer;
}

#modal-login > div > .modal-content > .modal-body > .text-center {
    margin: 18px 0 24px 0;
}

#modal-login > div > .modal-content > .modal-body > .text-center > img {
    max-width: 100%;
    margin-bottom: 5px;
}

#modal-login > div > .modal-content > .modal-body > .text-center > h3 {
    font-size: 16px;
    font-weight: 500;
    line-height: initial;
}

.login-form {
    width: 100%;
}

.login-form > .row > div {
    width: 100%;
    padding-right: 0 !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin: 0 40px;
}

.login-form > .row > div > .btn {
    margin: 25px 0 5px 0;
}

.login-form > .row > .bot-shearch {
    -webkit-box-flex: initial !important;
    -ms-flex: initial !important;
    flex: initial !important;
    max-width: 100% !important;
    -webkit-box-align: end !important;
    -ms-flex-align: end !important;
    align-items: flex-end !important;
}

.login-form > .row > .bot-shearch > a {
    color: #666666 !important;
}

.login-form > .row > .bottom-join {
    margin: 35px 0 18px 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.login-form > .row > .bottom-join > p {
    font-size: 12px;
    line-height: initial;
    color: #000;
}

.login-form > .row > .bottom-join > a {
    font-size: 14px;
    color: #000;
    font-weight: 500;
    border-bottom: 1px solid #000;
}


/* Alert styles */
.event-type {
    border: 3px solid #e0e6ed;
    height: 80px;
    width: 80px;
    border-radius: 50%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: all ease 0.2s;
    -o-transition: all ease 0.2s;
    transition: all ease 0.2s;
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

.event-type .event-indicator {
    -webkit-transition: all cubic-bezier(0, 0.89, 0.44, 1) 0.2s;
    -o-transition: all cubic-bezier(0, 0.89, 0.44, 1) 0.2s;
    transition: all cubic-bezier(0, 0.89, 0.44, 1) 0.2s;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    -webkit-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    transition-delay: 0.5s;
    width: 60px;
    height: 60px;
}

.show .event-type .event-indicator {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.show .event-type {
    border-color: #e0e6ed;
    background-color: #e0e6ed;
}

.show .event-type.success {
    border-color: #00CC99;
    background-color: #00CC99;
}

.show .event-type.error {
    border-color: #f2545b;
    background-color: #f2545b;
}

.show .event-type.warning {
    border-color: #f7bc06;
    background-color: #f7bc06;
}

.show .event-type.info {
    border-color: #19b5fe;
    background-color: #19b5fe;
}

/* Overlay for images */
.modal .overlay {
    background-color: rgba(0, 0, 0, 0.35);
}

.modal .overlay-light {
    background-color: rgba(0, 0, 0, 0.15);
}

/* Negative margins for creating pull effect */
.modal .pull-up-lg {
    margin-top: -70px;
}

.modal .pull-up-sm {
    /*margin-top: -35px;*/
}

.modal .border-thick {
    border-width: 0.3rem !important;
}

.modal .bg-img {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.pointer-events-none {
    pointer-events: none;
}

/* .modal {
    z-index: 80000;
} */

/* .modal-backdrop {
    z-index: 75000;
} */


/* Responsive Handler: Modal */
@media (min-width: 992px) {
    .modal-lg {
        width: 900px;
    }
}

@media (max-width: 767.98px) {
    .modal.fill-in .modal-dialog {
        width: calc(100% - 20px);
    }

    .modal.slide-up .modal-dialog {
        width: calc(100% - 20px);
    }

    .modal.fade.modal-top-left .modal-dialog {
        width: calc(100% - (0.5rem * 2));
    }

    .modal.fade.modal-top-right .modal-dialog {
        width: calc(100% - (0.5rem * 2));
    }

    .modal.fade.modal-bottom-right .modal-dialog {
        width: calc(100% - (0.5rem * 2));
    }

    .modal.fade.modal-bottom-left .modal-dialog {
        width: calc(100% - (0.5rem * 2));
    }

    .modal.fade.modal-bottom-center .modal-dialog {
        width: calc(100% - (0.5rem * 2));
    }
}

@media (min-width: 768px) {
    .modal.stick-up .modal-dialog {
        margin: -5px auto;
    }

    .modal.slide-up .modal-dialog {
        margin: 0 auto;
    }

    .modal.fill-in .modal-dialog {
        margin: 0 auto;
    }

    .modal .modal-content {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .modal .modal-dialog {
        width: 600px;
    }

    .modal .modal-sm {
        width: 300px;
    }

    .modal .modal-sm {
        min-width: auto;
    }
}

@media (min-width: 576px) {
    .modal-dialog {
        margin: 0 auto;
    }

    .modal.fade.modal-top-left .modal-dialog {
        left: 1.75rem;
        margin: 0 auto;
    }

    .modal.fade.modal-top-right .modal-dialog {
        right: 1.75rem;
        margin: 1.75rem auto;
    }

    .modal.fade.modal-bottom-right .modal-dialog {
        right: 1.75rem;
        margin: 1.75rem auto;
    }

    .modal.fade.modal-bottom-left .modal-dialog {
        left: 1.75rem;
        margin: 1.75rem auto;
    }

    .modal.fade.modal-bottom-center .modal-dialog {
        margin: 1.75rem auto;
    }

    /*2월15일수정*/
    #modal-login > .modal-dialog {
        max-width: 450px;
    }
}

/*------------------------------------------------------------------
[09. Tab]
------------------------------------------------------------------*/
.nav-tabs {
    position: relative;
}

.nav-tabs > li {
    padding-left: 0;
    padding-right: 0;
}

.nav-tabs > li > a.active:hover,
.nav-tabs > li > a.active:focus {
    border-color: #e0e0e0;
    color: #4b4b4b;
    background-color: #e0e0e0;
}

.nav-tabs > li > a {
    display: block;
    position: relative;
    border-radius: 0;
    padding: 13px 17px;
    margin-right: 0;
    letter-spacing: 0.06em;
    line-height: 1.7em;
    min-width: 70px;
    text-transform: uppercase;
    border-color: transparent;
}

.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
    background: transparent;
    border-color: transparent;
    color: #4b4b4b;
}

.nav-tabs > li > a .tab-icon {
    margin-right: 6px;
}

.nav-tabs > li > a.active {
    color: #212121;
}

.nav-tabs ~ .tab-content {
    overflow: hidden;
    padding: 15px;
}

.nav-tabs ~ .tab-content > .tab-pane.slide-left,
.nav-tabs ~ .tab-content > .tab-pane.slide-right {
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.nav-tabs ~ .tab-content > .tab-pane.slide-left.sliding,
.nav-tabs ~ .tab-content > .tab-pane.slide-right.sliding {
    opacity: 0 !important;
}

.nav-tabs ~ .tab-content > .tab-pane.slide-left.active,
.nav-tabs ~ .tab-content > .tab-pane.slide-right.active {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -ms-transform: translate(0, 0);
    opacity: 1;
}

.nav-tabs ~ .tab-content > .tab-pane.slide-left.sliding {
    -webkit-transform: translate3d(10%, 0, 0);
    transform: translate3d(10%, 0, 0);
    -ms-transform: translate(10%, 0);
}

.nav-tabs ~ .tab-content > .tab-pane.slide-right.sliding {
    -webkit-transform: translate3d(-10%, 0, 0);
    transform: translate3d(-10%, 0, 0);
    -ms-transform: translate(-10%, 0);
}

.nav-tabs.nav-tabs-left,
.nav-tabs.nav-tabs-right {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.nav-tabs.nav-tabs-left:after,
.nav-tabs.nav-tabs-right:after {
    border-bottom: 0px;
}

.nav-tabs.nav-tabs-left > li,
.nav-tabs.nav-tabs-right > li {
    float: none;
}

.nav-tabs.nav-tabs-left {
    float: left;
    padding-right: 0;
}

.nav-tabs.nav-tabs-left ~ .tab-content {
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    -ms-flex: 1;
    -ms-flex-negative: 0;
}

.nav-tabs.nav-tabs-right {
    float: right;
    padding-right: 0;
}

.nav-tabs.nav-tabs-right ~ .tab-content {
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    -ms-flex: 1;
    -ms-flex-negative: 0;
}


.nav-tabs-button {
    border-bottom: 0px;
    height: 50px;
}

.nav-tabs-button:after {
    content: "";
    border-bottom: none;
}

.nav-tabs-button > li {
    margin-right: 5px;
    margin-bottom: 0;
    display: inline-block;
}

.nav-tabs-button > li > a {
    display: block;
    position: relative;
    color: #525f7f;
    background: transparent;
    border: 1px solid transparent;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
    min-height: 28px;
    min-width: 28px;
    padding: 10px 30px;
}

.nav-tabs-button > li > a.active,
.nav-tabs-button > li > a.active:focus,
.nav-tabs-button > li > a.active:hover {
    color: #fff;
    background-color: rgba(0, 0, 0, 1);
    border: 1px solid rgba(0, 0, 0, 1) !important;
    border-bottom: 1px rgba(0, 0, 0, 1);
    -webkit-box-shadow: none;
    box-shadow: none;
}

.nav-tabs-button > li > a.hover:not(.active),
.nav-tabs-button > li > a:hover:not(.active) {
    background-color: transparent;
    color: rgba(0, 0, 0, 1);
    border: 1px solid rgba(0, 0, 0, 1);
    border-bottom: 1px solid rgba(0, 0, 0, 1);
}


.nav-tabs-simple {
    border-bottom: 0px;
}

.nav-tabs-simple:after {
    content: "";
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
    position: absolute;
    bottom: -2px;
    z-index: 120;
    left: 0;
}

.nav-tabs-simple > li {
    margin-bottom: 0;
}

.nav-tabs-simple > li > a:after {
    position: absolute;
    display: block;
    width: 100%;
    height: 0px;
    z-index: 125;
    content: "";
    background-color: #F47104;
    -webkit-transition: all 0.1s linear 0s;
    -o-transition: all 0.1s linear 0s;
    transition: all 0.1s linear 0s;
    -webkit-backface-visibility: hidden;
}

.nav-tabs-simple > li > a:after.nav-tabs-primary {
    background-color: #F47104;
}

.nav-tabs-simple > li > a:after.nav-tabs-success {
    background-color: #19AD79;
}

.nav-tabs-simple > li > a:after.nav-tabs-complete {
    background-color: #0072EC;
}

.nav-tabs-simple > li > a:after.nav-tabs-danger {
    background-color: #D83C31;
}

.nav-tabs-simple > li > a:after.nav-tabs-warning {
    background-color: #FFd945;
}

.nav-tabs-simple > li > a:after.nav-tabs-info {
    background-color: #3B4752;
}

.nav-tabs-simple > li > a.active:hover,
.nav-tabs-simple > li > a.active:focus {
    background-color: transparent;
    border-color: transparent;
}

.nav-tabs-simple > li > a.active:after,
.nav-tabs-simple > li > a:hover:after {
    height: 3px;
}

.nav-tabs-simple.nav-tabs-left:after,
.nav-tabs-simple.nav-tabs-right:after {
    border-bottom: 0px;
}

.nav-tabs-simple.nav-tabs-left > li > a:after,
.nav-tabs-simple.nav-tabs-right > li > a:after {
    width: 0px;
    height: 100%;
    top: 0;
    bottom: 0;
    position: absolute;
}

.nav-tabs-simple.nav-tabs-left > li > a.active:after,
.nav-tabs-simple.nav-tabs-left > li > a:hover:after,
.nav-tabs-simple.nav-tabs-right > li > a.active:after,
.nav-tabs-simple.nav-tabs-right > li > a:hover:after {
    width: 3px;
}

.nav-tabs-simple.nav-tabs-left > li > a:after {
    right: 0;
    left: auto;
}

.nav-tabs-simple.nav-tabs-right > li > a:after {
    left: 0;
}

.nav-tabs-linetriangle {
    border-bottom: 0;
}

.nav-tabs-linetriangle:after {
    content: "";
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
    position: absolute;
    bottom: -1px;
    z-index: 100;
    left: 0;
}

.nav-tabs-linetriangle > li > a.active {
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: transparent;
}

.nav-tabs-linetriangle > li > a.active:hover,
.nav-tabs-linetriangle > li > a.active:focus,
.nav-tabs-linetriangle > li > a.active:active {
    border-color: transparent;
    background-color: transparent;
}

.nav-tabs-linetriangle > li > a.active:after,
.nav-tabs-linetriangle > li > a.active:before {
    border: medium solid transparent;
    content: "";
    height: 0;
    left: 50%;
    pointer-events: none;
    position: absolute;
    width: 0;
    z-index: 120;
    top: 98%;
}

.nav-tabs-linetriangle > li > a.active:after {
    border-top-color: #f4f4f4;
    border-width: 10px;
    margin-left: -10px;
}

.nav-tabs-linetriangle > li > a.active:before {
    border-top-color: rgba(0, 0, 0, 0.2);
    border-width: 11px;
    margin-left: -11px;
}

.nav-tabs-linetriangle > li > a span {
    font-size: 1em;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-tabs-linetriangle > li > a:hover,
.nav-tabs-linetriangle > li > a:focus {
    overflow: visible;
    -webkit-transition: color 0.2s ease 0s;
    -o-transition: color 0.2s ease 0s;
    transition: color 0.2s ease 0s;
}

.nav-tabs-linetriangle ~ .tab-content {
    background: #fff;
}

.nav-tabs-linetriangle.nav-tabs-left.nav-tabs:after {
    border-bottom: none;
}

.nav-tabs-linetriangle.nav-tabs-left.nav-tabs > li > a.active:before {
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 11px solid rgba(0, 0, 0, 0.2);
}

.nav-tabs-linetriangle.nav-tabs-left.nav-tabs > li > a.active:after {
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid #f4f4f4;
    margin-top: 1px;
    margin-right: 2px;
}

.nav-tabs-linetriangle.nav-tabs-left.nav-tabs > li > a.active:after,
.nav-tabs-linetriangle.nav-tabs-left.nav-tabs > li > a.active:before {
    top: auto;
    right: -22px;
    left: auto;
}

.nav-tabs-linetriangle.nav-tabs-right.nav-tabs:after {
    border-bottom: none;
}

.nav-tabs-linetriangle.nav-tabs-right.nav-tabs > li > a.active:before {
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-right: 11px solid rgba(0, 0, 0, 0.2);
}

.nav-tabs-linetriangle.nav-tabs-right.nav-tabs > li > a.active:after {
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid #f4f4f4;
    margin-top: 1px;
    margin-left: -9px;
}

.nav-tabs-linetriangle.nav-tabs-right.nav-tabs > li > a.active:after,
.nav-tabs-linetriangle.nav-tabs-right.nav-tabs > li > a.active:before {
    top: auto;
    left: -11px;
    right: auto;
}

@media screen and (max-width: 58em) {
    .nav-tabs-linetriangle {
        font-size: 0.6em;
    }
}

.nav-tabs-fillup {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
}

.nav-tabs-fillup > li {
    overflow: hidden;
}

.nav-tabs-fillup > li > a {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: color 0.3s ease 0s;
    -o-transition: color 0.3s ease 0s;
    transition: color 0.3s ease 0s;
    background: transparent;
}

.nav-tabs-fillup > li > a:after {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background: none repeat scroll 0 0 #19AD79;
    border: 1px solid #19AD79;
    content: "";
    height: calc(100% + 1px);
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transform: translate3d(0, 100%, 0px);
    transform: translate3d(0, 100%, 0px);
    -webkit-transition: -webkit-transform 0.3s ease 0s;
    transition: -webkit-transform 0.3s ease 0s;
    -o-transition: transform 0.3s ease 0s;
    transition: transform 0.3s ease 0s;
    transition: transform 0.3s ease 0s, -webkit-transform 0.3s ease 0s;
    width: 100%;
    z-index: -1;
}

.nav-tabs-fillup > li > a:after.nav-tabs-primary {
    background: none repeat scroll 0 0 #F47104;
    border: 1px solid #F47104;
}

.nav-tabs-fillup > li > a:after.nav-tabs-success {
    background: none repeat scroll 0 0 #19AD79;
    border: 1px solid #19AD79;
}

.nav-tabs-fillup > li > a:after.nav-tabs-complete {
    background: none repeat scroll 0 0 #0072EC;
    border: 1px solid #0072EC;
}

.nav-tabs-fillup > li > a:after.nav-tabs-warning {
    background: none repeat scroll 0 0 #FFd945;
    border: 1px solid #FFd945;
}

.nav-tabs-fillup > li > a:after.nav-tabs-danger {
    background: none repeat scroll 0 0 #D83C31;
    border: 1px solid #D83C31;
}

.nav-tabs-fillup > li > a:after.nav-tabs-info {
    background: none repeat scroll 0 0 #3B4752;
    border: 1px solid #3B4752;
}

.nav-tabs-fillup > li > a span {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0px, 5px, 0px);
    transform: translate3d(0px, 5px, 0px);
    -webkit-transition: -webkit-transform 0.5s ease 0s;
    transition: -webkit-transform 0.5s ease 0s;
    -o-transition: transform 0.5s ease 0s;
    transition: transform 0.5s ease 0s;
    transition: transform 0.5s ease 0s, -webkit-transform 0.5s ease 0s;
    display: block;
    font-weight: 700;
    line-height: 1.5;
}

.nav-tabs-fillup > li > a.active {
    z-index: 100;
    color: #fff;
}

.nav-tabs-fillup > li > a.active:hover,
.nav-tabs-fillup > li > a.active:focus {
    border-color: transparent;
    background: transparent;
    color: #fff;
}

.nav-tabs-fillup > li > a.active:after {
    -webkit-transform: translate3d(0px, 0px, 0px);
    transform: translate3d(0px, 0px, 0px);
    -ms-transform: translate(0px, 0px);
}

.nav-tabs-fillup > li > a.active span {
    -webkit-transform: translate3d(0px, -5px, 0px);
    transform: translate3d(0px, -5px, 0px);
    -ms-transform: translate(0px, -5px);
}

.nav-tabs-fillup .icon:before {
    -webkit-transform: translate3d(0px, 5px, 0px);
    transform: translate3d(0px, 5px, 0px);
    -ms-transform: translate(0px, 5px);
    -webkit-transition: transform 0.5s ease 0s;
    -webkit-transition: -webkit-transform 0.5s ease 0s;
    transition: -webkit-transform 0.5s ease 0s;
    -o-transition: transform 0.5s ease 0s;
    transition: transform 0.5s ease 0s;
    transition: transform 0.5s ease 0s, -webkit-transform 0.5s ease 0s;
    display: block;
    margin: 0;
}

.nav-tabs-fillup ~ .tab-content {
    background: #fff;
}

.nav-tabs-fillup.nav-tabs-left,
.nav-tabs-fillup.nav-tabs-right {
    border-bottom: none;
}

.nav-tabs-fillup.nav-tabs-left:after,
.nav-tabs-fillup.nav-tabs-right:after {
    border-bottom: none;
}

.nav-tabs-fillup.nav-tabs-left > li > a:after,
.nav-tabs-fillup.nav-tabs-right > li > a:after {
    width: calc(100% + 1px);
    height: 100%;
}

.nav-tabs-fillup.nav-tabs-left > li.active a:after,
.nav-tabs-fillup.nav-tabs-right > li.active a:after {
    -webkit-transform: translate3d(0px, 0px, 0px);
    transform: translate3d(0px, 0px, 0px);
    -ms-transform: translate(0px, 0px);
}

.nav-tabs-fillup.nav-tabs-left > li > a:after {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    -ms-transform: translate(100%, 0);
}

.nav-tabs-fillup.nav-tabs-left > li > a span {
    -webkit-transform: translate3d(5px, 0, 0px);
    transform: translate3d(5px, 0, 0px);
    -ms-transform: translate(5px, 0);
}

.nav-tabs-fillup.nav-tabs-left > li.active a span {
    -webkit-transform: translate3d(-5px, 0, 0px);
    transform: translate3d(-5px, 0, 0px);
    -ms-transform: translate(-5px, 0);
}

.nav-tabs-fillup.nav-tabs-left > li.active .icon:before {
    -webkit-transform: translate3d(-5px, 0, 0px);
    transform: translate3d(-5px, 0, 0px);
    -ms-transform: translate(-5px, 0);
}

.nav-tabs-fillup.nav-tabs-right > li > a:after {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
    left: -1px;
}

.nav-tabs-fillup.nav-tabs-right > li > a span {
    -webkit-transform: translate3d(-5px, 0, 0px);
    transform: translate3d(-5px, 0, 0px);
    -ms-transform: translate(-5px, 0);
}

.nav-tabs-fillup.nav-tabs-right > li.active a span {
    -webkit-transform: translate3d(5px, 0, 0px);
    transform: translate3d(5px, 0, 0px);
    -ms-transform: translate(5px, 0);
}

.nav-tabs-fillup.nav-tabs-right > li.active .icon:before {
    -webkit-transform: translate3d(5px, 0, 0px);
    transform: translate3d(5px, 0, 0px);
    -ms-transform: translate(5px, 0);
}

.nav-tabs-header {
    overflow: scroll;
    width: 100%;
}

.nav-tabs-header .nav-tabs {
    width: auto;
    white-space: nowrap;
}

.nav-tabs-header .nav-tabs > li {
    display: inline-block;
    float: inherit;
}

.nav-tabs-header.nav-tabs-linetriangle {
    height: 54px;
    overflow-y: hidden;
}

.nav-tabs-header.nav-tabs-linetriangle:after {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
    position: relative;
    bottom: 3px;
    z-index: 120;
    content: "";
    clear: both;
}

.nav-tabs-header.nav-tabs-linetriangle ~ .tab-content {
    position: relative;
    top: -12px;
}

.nav-tabs-header ~ .tab-content {
    overflow: hidden;
    padding: 15px;
}

.nav-tab-dropdown .cs-select {
    width: 100% !important;
    max-width: 100%;
}

.nav-tab-dropdown .cs-select .cs-placeholder {
    height: 48px;
    padding: 12px 34px 15px 15px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.nav-tab-dropdown .cs-select .cs-backdrop {
    border: 1px solid transparent;
    border-bottom: 1px solid rgba(33, 33, 33, 0.14);
}

.nav-pills > li:first-child {
    padding-left: 0;
}

.nav-pills > li > a {
    color: #4b4b4b;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
    color: #4b4b4b;
    background-color: #e0e0e0;
}

@media (max-width: 767px) {
    .nav.nav-tabs.nav-stack-sm li {
        float: none;
    }

    .nav.nav-tabs.nav-stack-sm.nav-tabs-linetriangle > li.active > a:after,
    .nav.nav-tabs.nav-stack-sm.nav-tabs-linetriangle > li.active > a:before {
        display: none;
    }
}


/*------------------------------------------------------------------
[10. Treeview]
------------------------------------------------------------------*/
span.dynatree-active a {
    color: #212121 !important;
    background-color: transparent !important;
}

span.dynatree-selected a {
    color: #212121 !important;
    font-style: normal;
}

ul.dynatree-container a:focus,
span.dynatree-focused a:link {
    background-color: transparent;
}

ul.dynatree-container {
    background-color: transparent;
}

ul.dynatree-container a:hover {
    color: #4b4b4b;
    opacity: 0.7;
    background-color: transparent;
}

ul.dynatree-container a {
    color: #4b4b4b;
}

span.dynatree-empty,
span.dynatree-vline,
span.dynatree-connector,
span.dynatree-expander,
span.dynatree-icon,
span.dynatree-checkbox,
span.dynatree-radio,
span.dynatree-drag-helper-img,
#dynatree-drop-marker {
    height: 17px;
    position: relative;
    top: 3px;
}


/*------------------------------------------------------------------
[10. View Ports]
------------------------------------------------------------------*/
.view-port {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    white-space: nowrap;
    word-spacing: 0;
    font-size: 0;
    overflow: hidden;
}

.view-port > * {
    font-size: initial;
}

.view-port .navbar {
    border-radius: 0;
    padding-left: 0;
    margin-bottom: 0;
    border-left: 0;
    display: table;
    width: 100%;
    top: 0;
    border-top: 0;
    padding: 0;
    border-bottom: 1px solid #e0e0e0;
}

.view-port .navbar .navbar-inner {
    display: table-cell;
    height: 50px;
    vertical-align: middle;
}

.view-port .navbar .action {
    position: absolute;
    top: 0;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
}

.view-port .navbar .action.pull-right {
    right: 0;
}

.view-port .navbar .view-heading {
    font-size: 15px;
    text-align: center;
}

.view-port .navbar > p {
    line-height: 12px;
    font-size: 12px;
    margin: 0;
}

.view-port .navbar.navbar-sm {
    min-height: 35px;
}

.view-port .navbar.navbar-sm .navbar-inner {
    height: 35px;
}

.view-port .navbar.navbar-sm .action {
    line-height: 35px;
}

.view-port .view {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    height: 100%;
    vertical-align: top;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.view-port .view:first-child:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    z-index: -1;
}

.view-port .view:only-child {
    margin: 0;
}

.view-port.from-top > .view:last-child {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
}

.view-port.push > .view:first-child {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
}

.view-port.push > .view:last-child {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
}

.view-port.push-parrallax > .view:first-child {
    -webkit-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -o-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -webkit-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
    -ms-transform: translate(-25%, 0);
}

.view-port.push-parrallax > .view:first-child:before {
    opacity: 0;
    z-index: 100;
}

.view-port.push-parrallax > .view:last-child {
    -webkit-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -o-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
    -webkit-box-shadow: 0 0 9px rgba(191, 191, 191, 0.36);
    box-shadow: 0 0 9px rgba(191, 191, 191, 0.36);
}


/*------------------------------------------------------------------
[11. List] 
------------------------------------------------------------------*/
.list-view-wrapper {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    width: 100%;
    -webkit-overflow-scrolling: touch;
}

.list-view-container {
    position: relative;
}

.list-view-container .list-quickscroll ul {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    right: 10px;
    z-index: 120;
    padding-top: 10px;
    padding-bottom: 10px;
}

.list-view-container .list-quickscroll ul li a {
    font-size: 0.7em;
    vertical-align: baseline;
}

.list-view-group-container {
    margin: 0;
    min-height: 1px;
    overflow: hidden;
    padding: 26px 0 0 0;
    position: relative;
}

.list-view-group-container:last-child ul {
    border: 0;
}

.list-view-group-header,
.list-view-fake-header {
    background: #f4f4f4;
    color: #232830;
    text-transform: uppercase;
    margin: 0;
    padding: 6px 0 5px 15px;
    position: absolute;
    z-index: 10;
}

.list-view-group-header {
    bottom: auto;
    min-height: 1px;
    top: 0;
    width: 100%;
    border-top: 0;
}

.list-view-fake-header {
    width: 100%;
    z-index: 100;
    font-size: 11px !important;
    line-height: 14px !important;
}

.list-view-fake-header.list-view-hidden {
    visibility: hidden;
}

.list-view-group-container.list-view-animated .list-view-group-header {
    bottom: 0;
    top: auto;
}

input.list-view-search {
    font-size: 15px;
    color: #232830;
}

.no-top-border .list-view-fake-header {
    border-top: 0;
}

.list-view ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid rgba(33, 33, 33, 0.14);
}

.list-view li {
    padding-left: 15px;
    white-space: nowrap;
    cursor: pointer;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.list-view li:hover {
    background-color: #d3eeff;
}

.list-view li.active {
    background-color: #fffde1;
}

.list-view li p {
    margin: 0;
    line-height: 19px;
}

.list-view li > a {
    margin-right: 15px;
    width: 100%;
}

.list-view li > * {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.list-view.boreded li > a {
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.list-view.boreded li:last-child > a {
    border-bottom: 0;
}

.list-view.boreded li + li {
    border-top: 0;
}

[data-ios="true"] .list-view-group-header,
[data-ios="true"] .list-view-fake-header {
    width: 288px;
}

.list-group-item {
    border: 1px solid #f4f4f4;
}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    background-color: #26bf93;
    border-color: #26bf93;
}

.list-group-item:first-child {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}

.list-group-item:last-child {
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
}

.list-inline {
    margin: 0;
}

.list-inline.copy{
    position: absolute;
    bottom: 10px;
    width: 100%;
    left: 0;
    text-align: center;
}

.list-inline.copy li{
    color: #808080;
    font-weight: 300;
    font-size: 10px;
    line-height: 1.2;
}

.list-inline > li {
    display: inline-block;
    margin: 0;
    padding: 0;
    font-size: 14px;
}

/*------------------------------------------------------------------
[12. Slider]
------------------------------------------------------------------*/
/* Ion Range Slider: https://github.com/IonDen/ion.rangeSlider */
.irs-line-mid,
.irs-line-left,
.irs-line-right,
.irs-bar,
.irs-bar-edge,
.irs-slider {
    background-image: none;
}

.irs-bar {
    background: #D83C31;
}

.irs-wrapper .irs-line {
    background-color: #e0e0e0;
}

.irs-wrapper .irs-line-mid,
.irs-wrapper .irs-line-left,
.irs-wrapper .irs-line-right,
.irs-wrapper .irs-diapason,
.irs-wrapper .irs-slider {
    background: none;
}

.irs-wrapper .irs-diapason {
    background-color: #D83C31;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.irs-wrapper .irs-from,
.irs-wrapper .irs-to,
.irs-wrapper .irs-single {
    background: #D83C31;
}

.irs-wrapper .irs-slider.from:before {
    top: -2%;
    left: 37%;
    width: 16%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    background-color: #D83C31;
}

.irs-wrapper .irs-slider.to:before {
    top: -2%;
    left: 37%;
    width: 16%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    background-color: #D83C31;
}

.irs-wrapper .irs-slider.single:before {
    top: -2%;
    left: 37%;
    width: 16%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    background-color: #D83C31;
}

.irs-wrapper .irs-from:after,
.irs-wrapper .irs-to:after,
.irs-wrapper .irs-single:after {
    border-top-color: #D83C31;
}

.irs-wrapper.success .irs-diapason {
    background-color: #19AD79;
}

.irs-wrapper.success .irs-from,
.irs-wrapper.success .irs-to,
.irs-wrapper.success .irs-single,
.irs-wrapper.success .irs-handle > i:first-child {
    background: #19AD79;
}

.irs-wrapper.success .irs-slider.from:before {
    background-color: #19AD79;
}

.irs-wrapper.success .irs-slider.to:before {
    background-color: #19AD79;
}

.irs-wrapper.success .irs-slider.single:before {
    background-color: #19AD79;
}

.irs-wrapper.success .irs-from:after,
.irs-wrapper.success .irs-to:after,
.irs-wrapper.success .irs-single:after {
    border-top-color: #19AD79;
}

.irs-wrapper.success .irs-bar {
    background-color: #19AD79;
}

.irs-wrapper.primary .irs-diapason {
    background-color: #F47104;
}

.irs-wrapper.primary .irs-from,
.irs-wrapper.primary .irs-to,
.irs-wrapper.primary .irs-single,
.irs-wrapper.primary .irs-handle > i:first-child {
    background: #F47104;
}

.irs-wrapper.primary .irs-slider.from:before {
    background-color: #F47104;
}

.irs-wrapper.primary .irs-slider.to:before {
    background-color: #F47104;
}

.irs-wrapper.primary .irs-slider.single:before {
    background-color: #F47104;
}

.irs-wrapper.primary .irs-from:after,
.irs-wrapper.primary .irs-to:after,
.irs-wrapper.primary .irs-single:after {
    border-top-color: #F47104;
}

.irs-wrapper.primary .irs-bar {
    background-color: #F47104;
}

.irs-wrapper.warning .irs-diapason {
    background-color: #FFd945;
}

.irs-wrapper.warning .irs-from,
.irs-wrapper.warning .irs-to,
.irs-wrapper.warning .irs-single,
.irs-wrapper.warning .irs-handle > i:first-child {
    background: #FFd945;
}

.irs-wrapper.warning .irs-slider.from:before {
    background-color: #FFd945;
}

.irs-wrapper.warning .irs-slider.to:before {
    background-color: #FFd945;
}

.irs-wrapper.warning .irs-slider.single:before {
    background-color: #FFd945;
}

.irs-wrapper.warning .irs-from:after,
.irs-wrapper.warning .irs-to:after,
.irs-wrapper.warning .irs-single:after {
    border-top-color: #FFd945;
}

.irs-wrapper.warning .irs-bar {
    background-color: #FFd945;
}

.irs-wrapper.complete .irs-diapason {
    background-color: #0072EC;
}

.irs-wrapper.complete .irs-from,
.irs-wrapper.complete .irs-to,
.irs-wrapper.complete .irs-single,
.irs-wrapper.complete .irs-handle > i:first-child {
    background: #0072EC;
}

.irs-wrapper.complete .irs-slider.from:before {
    background-color: #0072EC;
}

.irs-wrapper.complete .irs-slider.to:before {
    background-color: #0072EC;
}

.irs-wrapper.complete .irs-slider.single:before {
    background-color: #0072EC;
}

.irs-wrapper.complete .irs-from:after,
.irs-wrapper.complete .irs-to:after,
.irs-wrapper.complete .irs-single:after {
    border-top-color: #0072EC;
}

.irs-wrapper.complete .irs-bar {
    background-color: #0072EC;
}

.irs-wrapper.danger .irs-diapason {
    background-color: #D83C31;
}

.irs-wrapper.danger .irs-from,
.irs-wrapper.danger .irs-to,
.irs-wrapper.danger .irs-single,
.irs-wrapper.danger .irs-handle > i:first-child {
    background: #D83C31;
}

.irs-wrapper.danger .irs-slider.from:before {
    background-color: #D83C31;
}

.irs-wrapper.danger .irs-slider.to:before {
    background-color: #D83C31;
}

.irs-wrapper.danger .irs-slider.single:before {
    background-color: #D83C31;
}

.irs-wrapper.danger .irs-from:after,
.irs-wrapper.danger .irs-to:after,
.irs-wrapper.danger .irs-single:after {
    border-top-color: #D83C31;
}

.irs-wrapper.danger .irs-bar {
    background-color: #D83C31;
}


/*------------------------------------------------------------------
[13. Progress Indicator]
------------------------------------------------------------------*/
.progress {
    height: 4px;
    background-color: rgba(75, 75, 75, 0.2);
    background-image: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    margin-bottom: 20px;
}

.progress.transparent {
    background-color: rgba(0, 0, 0, 0.28);
}

.progress.progress-small {
    height: 3px;
}

.progress-bar-indeterminate {
    background: url("../img/progress/progress-bar-master.svg") no-repeat top left;
    width: 100%;
    height: 100%;
    background-size: cover;
}

.progress-bar-indeterminate.progress-bar-primary {
    background-image: url("../img/progress/progress-bar-primary.svg");
    background-color: transparent;
}

.progress-bar-indeterminate.progress-bar-complete {
    background-image: url("../img/progress/progress-bar-complete.svg");
    background-color: transparent;
}

.progress-bar-indeterminate.progress-bar-success {
    background-image: url("../img/progress/progress-bar-success.svg");
    background-color: transparent;
}

.progress-bar-indeterminate.progress-bar-info {
    background-image: url("../img/progress/progress-bar-info.svg");
    background-color: transparent;
}

.progress-bar-indeterminate.progress-bar-warning {
    background-image: url("../img/progress/progress-bar-warning.svg");
    background-color: transparent;
}

.progress-bar-indeterminate.progress-bar-danger {
    background-image: url("../img/progress/progress-bar-danger.svg");
    background-color: transparent;
}

.progress-bar-indeterminate.progress-bar-master {
    background-image: url("../img/progress/progress-bar-master.svg");
    background-color: transparent;
}

.progress-bar {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    background-color: #4b4b4b;
    background-image: none;
    -webkit-transition: all 1000ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition: all 1000ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: all 1000ms cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -webkit-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.progress-bar-primary {
    background-color: #F47104;
    background-image: none;
}

.progress-bar-complete {
    background-color: #0072EC;
    background-image: none;
}

.progress-bar-success {
    background-color: #19AD79;
    background-image: none;
}

.progress-bar-info {
    background-color: #3B4752;
    background-image: none;
}

.progress-bar-warning {
    background-color: #FFd945;
    background-image: none;
}

.progress-bar-danger {
    background-color: #D83C31;
    background-image: none;
}

.progress-bar-white {
    background-color: #fff;
    background-image: none;
}

.progress-bar-black {
    background-color: #212121;
    background-image: none;
}

.progress-info .bar,
.progress .bar-info {
    background-color: #1b2839;
    background-image: none;
}

.progress-warning .bar,
.progress .bar-warning {
    background-color: #aa7918;
    background-image: none;
}

.progress-danger .bar,
.progress .bar-danger {
    background-color: #900f17;
    background-image: none;
}

.progress-white .bar,
.progress .bar-white {
    background-color: #fff;
    background-image: none;
}

.progress-success.progress-striped .bar,
.progress-striped .bar-success {
    background-color: #19AD79;
}

.progress-info.progress-striped .bar,
.progress-striped .bar-info {
    background-color: #3B4752;
}

.progress-circle-indeterminate {
    background: url("../img/progress/progress-circle-master.svg") no-repeat top left;
    width: 50px;
    height: 50px;
    background-size: 100% auto;
    margin: 0 auto;
}

.progress-circle-indeterminate.progress-circle-warning {
    background-image: url("../img/progress/progress-circle-warning.svg");
}

.progress-circle-indeterminate.progress-circle-danger {
    background-image: url("../img/progress/progress-circle-danger.svg");
}

.progress-circle-indeterminate.progress-circle-info {
    background-image: url("../img/progress/progress-circle-info.svg");
}

.progress-circle-indeterminate.progress-circle-primary {
    background-image: url("../img/progress/progress-circle-primary.svg");
}

.progress-circle-indeterminate.progress-circle-success {
    background-image: url("../img/progress/progress-circle-success.svg");
}

.progress-circle-indeterminate.progress-circle-complete {
    background-image: url("../img/progress/progress-circle-complete.svg");
}

.progress-circle {
    display: block;
    height: 45px;
    margin: 0 auto;
    position: relative;
    width: 45px;
    -webkit-backface-visibility: hidden;
}

.progress-circle.progress-circle-warning .pie .half-circle {
    border-color: #FFd945;
}

.progress-circle.progress-circle-danger .pie .half-circle {
    border-color: #D83C31;
}

.progress-circle.progress-circle-info .pie .half-circle {
    border-color: #3B4752;
}

.progress-circle.progress-circle-primary .pie .half-circle {
    border-color: #F47104;
}

.progress-circle.progress-circle-success .pie .half-circle {
    border-color: #19AD79;
}

.progress-circle.progress-circle-complete .pie .half-circle {
    border-color: #0072EC;
}

.progress-circle.progress-circle-thick .pie .half-circle,
.progress-circle.progress-circle-thick .shadow {
    border-width: 5px;
}

.progress-circle .pie {
    clip: rect(0, 45px, 45px, 22.5px);
    height: 45px;
    position: absolute;
    width: 45px;
}

.progress-circle .pie .half-circle {
    border: 3px solid #4b4b4b;
    border-radius: 50%;
    clip: rect(0, 22.5px, 45px, 0);
    height: 45px;
    position: absolute;
    width: 45px;
}

.progress-circle .shadow {
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    height: 100%;
    width: 100%;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}


/*------------------------------------------------------------------
[14. Login]
------------------------------------------------------------------*/
.login-wrapper {
    background-color: #F47104;
    /*background: url(../img/bg/bg_login);*/
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}

.login-wrapper > * {
    height: 100%;
}

.login-wrapper .bg-pic {
    position: absolute;
    width: 100%;
    overflow: hidden;
}

.login-wrapper .bg-pic > img {
    width: auto !important;
    height: 100%;
    opacity: 0.85;
}

.login-wrapper .login-container {
    width: 496px;
    min-height: 100% !important;
    display: block;
    position: relative;
    float: right;
}

.login-wrapper .bg-caption {
    /*width: 500px;*/
    width: 600px;
}

.register-container {
    width: 550px;
    margin: auto;
    height: 100%;
}

/* Responsive handler : Login */
@media (max-width: 768px) {
    .login-wrapper .login-container {
        width: 100%;
    }

    .register-container {
        width: 100%;
        padding: 15px;
    }
}

@media only screen and (max-width: 321px) {
    .login-wrapper .login-container {
        width: 100%;
    }
}


/*------------------------------------------------------------------
[02. View Port]
------------------------------------------------------------------*/
.view-port {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    white-space: nowrap;
    word-spacing: 0;
    font-size: 0;
    overflow: hidden;
}

.view-port > * {
    font-size: initial;
}

.view-port .navbar {
    border-radius: 0;
    padding-left: 0;
    margin-bottom: 0;
    border-left: 0;
    display: table;
    width: 100%;
    top: 0;
    border-top: 0;
    padding: 0;
    border-bottom: 1px solid #e0e0e0;
}

.view-port .navbar .navbar-inner {
    display: table-cell;
    height: 50px;
    vertical-align: middle;
}

.view-port .navbar .action {
    position: absolute;
    top: 0;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
}

.view-port .navbar .action.pull-right {
    right: 0;
}

.view-port .navbar .view-heading {
    font-size: 15px;
    text-align: center;
}

.view-port .navbar > p {
    line-height: 12px;
    font-size: 12px;
    margin: 0;
}

.view-port .navbar.navbar-sm {
    min-height: 35px;
}

.view-port .navbar.navbar-sm .navbar-inner {
    height: 35px;
}

.view-port .navbar.navbar-sm .action {
    line-height: 35px;
}

.view-port .view {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    height: 100%;
    vertical-align: top;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.view-port .view:first-child:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    z-index: -1;
}

.view-port .view:only-child {
    margin: 0;
}

.view-port.from-top > .view:last-child {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
}

.view-port.push > .view:first-child {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
}

.view-port.push > .view:last-child {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
}

.view-port.push-parrallax > .view:first-child {
    -webkit-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -o-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -webkit-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
    -ms-transform: translate(-25%, 0);
}

.view-port.push-parrallax > .view:first-child:before {
    opacity: 0;
    z-index: 100;
}

.view-port.push-parrallax > .view:last-child {
    -webkit-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -o-transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    transition: all 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    -ms-transform: translate(-100%, 0);
    -webkit-box-shadow: 0 0 9px rgba(191, 191, 191, 0.36);
    box-shadow: 0 0 9px rgba(191, 191, 191, 0.36);
}


/*------------------------------------------------------------------
[18. Gallery]
------------------------------------------------------------------*/
/* Box Shadow */
.bs-none,
.bs-none:hover {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.bs {
    -webkit-box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.07), 0 2px 9px 0 rgba(0, 0, 0, 0.06);
    box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.07), 0 2px 9px 0 rgba(0, 0, 0, 0.06);
    -webkit-transition: -webkit-transform 0.2s ease-in-out, -webkit-box-shadow 0.2s ease-in-out;
    transition: -webkit-transform 0.2s ease-in-out, -webkit-box-shadow 0.2s ease-in-out;
    -o-transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out, -webkit-box-shadow 0.2s ease-in-out;
    will-change: transform, box-shadow;
}

.bs-light {
    -webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
}

.bs-inset {
    -webkit-box-shadow: inset 0 4px 7px 1px #fff, inset 0 -5px 20px rgba(0, 0, 0, 0.25), 0 2px 6px rgba(0, 0, 0, 0.14), 0 10px 20px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 4px 7px 1px #fff, inset 0 -5px 20px rgba(0, 0, 0, 0.25), 0 2px 6px rgba(0, 0, 0, 0.14), 0 10px 20px rgba(0, 0, 0, 0.05);
}

.bs-1, .bs-1h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 0 20px 0;
    box-shadow: rgba(0, 0, 0, 0.1) 0 0 20px 0;
}

.bs-2, .bs-2h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 20px 60px -10px;
    box-shadow: rgba(0, 0, 0, 0.1) 0 20px 60px -10px;
}

.bs-3, .bs-3h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.09) 0 6px 9px 0;
    box-shadow: rgba(0, 0, 0, 0.09) 0 6px 9px 0;
}

.bs-4, .bs-4h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 5px 20px 0;
    box-shadow: rgba(0, 0, 0, 0.1) 0 5px 20px 0;
}

.bs-5, .bs-5h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0 3px 13px 1px;
    box-shadow: rgba(0, 0, 0, 0.12) 0 3px 13px 1px;
}

.bs-6, .bs-6h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 15px 35px 0, rgba(0, 0, 0, 0.07) 0 3px 10px 0;
    box-shadow: rgba(0, 0, 0, 0.1) 0 15px 35px 0, rgba(0, 0, 0, 0.07) 0 3px 10px 0;
}

.bs-7, .bs-7h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0 0 1px 0, rgba(0, 0, 8, 0.25) 0 20px 55px -8px;
    box-shadow: rgba(0, 0, 0, 0.15) 0 0 1px 0, rgba(0, 0, 8, 0.25) 0 20px 55px -8px;
}

.bs-8, .bs-8h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.25) 0 15px 45px -9px;
    box-shadow: rgba(0, 0, 0, 0.25) 0 15px 45px -9px;
}

.bs-9, .bs-9h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.06) 0 1px 1px 1px;
    box-shadow: rgba(0, 0, 0, 0.06) 0 1px 1px 1px;
}

.bs-10, .bs-10h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 2px 6px 0;
    box-shadow: rgba(0, 0, 0, 0.4) 0 2px 6px 0;
}

.bs-11, .bs-11h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 6px 16px 0;
    box-shadow: rgba(0, 0, 0, 0.3) 0 6px 16px 0;
}

.bs-12, .bs-12h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.36) 0 16px 38px -12px, rgba(0, 0, 0, 0.12) 0 4px 25px 0, rgba(0, 0, 0, 0.2) 0 8px 10px -5px;
    box-shadow: rgba(0, 0, 0, 0.36) 0 16px 38px -12px, rgba(0, 0, 0, 0.12) 0 4px 25px 0, rgba(0, 0, 0, 0.2) 0 8px 10px -5px;
}

.bs-13, .bs-13h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 -15px 5px -12px;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -15px 5px -12px;
}

.bs-14, .bs-14h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.09) 0 -6px 9px 0;
    box-shadow: rgba(0, 0, 0, 0.09) 0 -6px 9px 0;
}

.bs-15, .bs-15h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 -20px 60px -10px;
    box-shadow: rgba(0, 0, 0, 0.1) 0 -20px 60px -10px;
}

.bs-16, .bs-16h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.25) 0 -50px 100px -30px;
    box-shadow: rgba(0, 0, 0, 0.25) 0 -50px 100px -30px;
}

.bs-17, .bs-17h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 -16px 24px 0;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -16px 24px 0;
}

.bs-18, .bs-18h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.28) 0 -16px 32px 0, transparent 0 0 0 0;
    box-shadow: rgba(0, 0, 0, 0.28) 0 -16px 32px 0, transparent 0 0 0 0;
}

.bs-19, .bs-18h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.36) 0 -16px 32px 0, transparent 0 0 0 0;
    box-shadow: rgba(0, 0, 0, 0.36) 0 -16px 32px 0, transparent 0 0 0 0;
}

.bs-20, .bs-20h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 -30px 40px 0;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -30px 40px 0;
}

.bs-21, .bs-21h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.05) 5px 5px 0 0;
    box-shadow: rgba(0, 0, 0, 0.05) 5px 5px 0 0;
}

.bs-22, .bs-22h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.05) -5px 5px 0 0;
    box-shadow: rgba(0, 0, 0, 0.05) -5px 5px 0 0;
}

.bs-23, .bs-23h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.05) 5px -5px 0 0;
    box-shadow: rgba(0, 0, 0, 0.05) 5px -5px 0 0;
}

.bs-24, .bs-24h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.05) -5px -5px 0 0;
    box-shadow: rgba(0, 0, 0, 0.05) -5px -5px 0 0;
}

.bs-25, .bs-25h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 4px 0;
    box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 4px 0;
}

.bs-26, .bs-26h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) -2px 2px 4px 0;
    box-shadow: rgba(0, 0, 0, 0.2) -2px 2px 4px 0;
}

.bs-27, .bs-27h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 2px -2px 4px 0;
    box-shadow: rgba(0, 0, 0, 0.2) 2px -2px 4px 0;
}

.bs-28, .bs-28h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) -2px -2px 4px 0;
    box-shadow: rgba(0, 0, 0, 0.2) -2px -2px 4px 0;
}

.bs-29, .bs-29h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.14) 2px 4px 6px 1px;
    box-shadow: rgba(0, 0, 0, 0.14) 2px 4px 6px 1px;
}

.bs-30, .bs-30h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.14) -2px 4px 6px 1px;
    box-shadow: rgba(0, 0, 0, 0.14) -2px 4px 6px 1px;
}

.bs-31, .bs-31h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.14) 2px -4px 6px 1px;
    box-shadow: rgba(0, 0, 0, 0.14) 2px -4px 6px 1px;
}

.bs-32, .bs-32h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.14) -2px -4px 6px 1px;
    box-shadow: rgba(0, 0, 0, 0.14) -2px -4px 6px 1px;
}

.bs-33, .bs-33h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 15px 15px 5px -5px;
    box-shadow: rgba(0, 0, 0, 0.2) 15px 15px 5px -5px;
}

.bs-34, .bs-34h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) -15px 15px 5px -5px;
    box-shadow: rgba(0, 0, 0, 0.2) -15px 15px 5px -5px;
}

.bs-35, .bs-35h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 15px -15px 5px -5px;
    box-shadow: rgba(0, 0, 0, 0.2) 15px -15px 5px -5px;
}

.bs-36, .bs-36h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) -15px -15px 5px -5px;
    box-shadow: rgba(0, 0, 0, 0.2) -15px -15px 5px -5px;
}

.bs-37, .bs-37h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.28) 10px 10px 32px 0, transparent 0 0 0 0;
    box-shadow: rgba(0, 0, 0, 0.28) 10px 10px 32px 0, transparent 0 0 0 0;
}

.bs-38, .bs-38h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.28) -10px 10px 32px 0, transparent 0 0 0 0;
    box-shadow: rgba(0, 0, 0, 0.28) -10px 10px 32px 0, transparent 0 0 0 0;
}

.bs-39, .bs-39h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.28) 10px -10px 32px 0, transparent 0 0 0 0;
    box-shadow: rgba(0, 0, 0, 0.28) 10px -10px 32px 0, transparent 0 0 0 0;
}

.bs-40, .bs-40h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.28) -10px -10px 32px 0, transparent 0 0 0 0;
    box-shadow: rgba(0, 0, 0, 0.28) -10px -10px 32px 0, transparent 0 0 0 0;
}

.bs-41, .bs-41h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.05) 1px 1px 5px 0, rgba(0, 0, 0, 0.5) 39px 62.5px 125px -25px, rgba(0, 0, 0, 0.3) 23.4px 37.5px 75px -37.5px;
    box-shadow: rgba(0, 0, 0, 0.05) 1px 1px 5px 0, rgba(0, 0, 0, 0.5) 39px 62.5px 125px -25px, rgba(0, 0, 0, 0.3) 23.4px 37.5px 75px -37.5px;
}

.bs-42, .bs-42h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.05) 1px 1px 5px 0, rgba(0, 0, 0, 0.5) -39px 62.5px 125px -25px, rgba(0, 0, 0, 0.3) 23.4px 37.5px 75px -37.5px;
    box-shadow: rgba(0, 0, 0, 0.05) 1px 1px 5px 0, rgba(0, 0, 0, 0.5) -39px 62.5px 125px -25px, rgba(0, 0, 0, 0.3) 23.4px 37.5px 75px -37.5px;
}

.bs-43, .bs-43h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 15px 5px -12px;
    box-shadow: rgba(0, 0, 0, 0.2) 0 15px 5px -12px;
}

.bs-44, .bs-44h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.25) 0 50px 100px -30px;
    box-shadow: rgba(0, 0, 0, 0.25) 0 50px 100px -30px;
}

.bs-45, .bs-45h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.05) 0 8px 16px 0;
    box-shadow: rgba(0, 0, 0, 0.05) 0 8px 16px 0;
}

.bs-46, .bs-46h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.09) 0 6px 9px 0;
    box-shadow: rgba(0, 0, 0, 0.09) 0 6px 9px 0;
}

.bs-47, .bs-47h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 16px 24px 0;
    box-shadow: rgba(0, 0, 0, 0.2) 0 16px 24px 0;
}

.bs-48, .bs-48h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.28) 0 16px 32px 0, transparent 0 0 0 0;
    box-shadow: rgba(0, 0, 0, 0.28) 0 16px 32px 0, transparent 0 0 0 0;
}

.bs-49, .bs-49h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 30px 40px 0;
    box-shadow: rgba(0, 0, 0, 0.2) 0 30px 40px 0;
}

.bs-50, .bs-50h:hover {
    -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0 0 70px 6px;
    box-shadow: rgba(0, 0, 0, 0.12) 0 0 70px 6px;
}

.bs-51, .bs-51h:hover {
    -webkit-box-shadow: 5px 31px 85px 23px rgba(0, 0, 0, 0.07);
    box-shadow: 5px 31px 85px 23px rgba(0, 0, 0, 0.07);
}

.bs-52, .bs-52h:hover {
    -webkit-box-shadow: 30px 70px 70px 40px rgba(0, 0, 0, 0.05);
    box-shadow: 30px 70px 70px 40px rgba(0, 0, 0, 0.05);
}

.bs-53, .bs-53h:hover {
    -webkit-box-shadow: 0 30px 48px 22px rgba(0, 0, 0, 0.07);
    box-shadow: 0 30px 48px 22px rgba(0, 0, 0, 0.07);
}

.bs-54, .bs-54h:hover {
    -webkit-box-shadow: -41px 51px 68px 5px rgba(0, 0, 0, 0.06);
    box-shadow: -41px 51px 68px 5px rgba(0, 0, 0, 0.06);
}

.bs-55, .bs-55h:hover {
    -webkit-box-shadow: 41px 51px 68px 5px rgba(0, 0, 0, 0.06);
    box-shadow: 41px 51px 68px 5px rgba(0, 0, 0, 0.06);
}

.bs-56, .bs-56h:hover {
    -webkit-box-shadow: -100px 100px 85px 23px rgba(0, 0, 0, 0.07);
    box-shadow: -100px 100px 85px 23px rgba(0, 0, 0, 0.07);
}

.bs-57, .bs-57h:hover {
    -webkit-box-shadow: 100px 100px 85px 23px rgba(0, 0, 0, 0.07);
    box-shadow: 100px 100px 85px 23px rgba(0, 0, 0, 0.07);
}

.bs-58, .bs-58h:hover {
    -webkit-box-shadow: 5px 0 12px -10px rgba(0, 0, 0, 0.25), -5px 0 12px -10px rgba(0, 0, 0, 0.25);
    box-shadow: 5px 0 12px -10px rgba(0, 0, 0, 0.25), -5px 0 12px -10px rgba(0, 0, 0, 0.25);
}

.bs-59, .bs-59h:hover {
    -webkit-box-shadow: 6px 0 12px -8px rgba(0, 0, 0, 0.45), -6px 0 12px -8px rgba(0, 0, 0, 0.45);
    box-shadow: 6px 0 12px -8px rgba(0, 0, 0, 0.45), -6px 0 12px -8px rgba(0, 0, 0, 0.45);
}

.bs-60, .bs-60h:hover {
    -webkit-box-shadow: 6px 0 12px -7px rgba(0, 0, 0, 0.75), -6px 0 12px -7px rgba(0, 0, 0, 0.75);
    box-shadow: 6px 0 12px -7px rgba(0, 0, 0, 0.75), -6px 0 12px -7px rgba(0, 0, 0, 0.75);
}

.bs-61, .bs-61h:hover {
    -webkit-box-shadow: -20px 0 50px -25px rgba(0, 0, 0, 0.65), 20px 0 50px -25px rgba(0, 0, 0, 0.65);
    box-shadow: -20px 0 50px -25px rgba(0, 0, 0, 0.65), 20px 0 50px -25px rgba(0, 0, 0, 0.65);
}

.bs-62, .bs-62h:hover {
    -webkit-box-shadow: 20px 0 25px -15px rgba(0, 0, 0, 0.35), -20px 0 25px -15px rgba(0, 0, 0, 0.35);
    box-shadow: 20px 0 25px -15px rgba(0, 0, 0, 0.35), -20px 0 25px -15px rgba(0, 0, 0, 0.35);
}

.bs-63, .bs-63h:hover {
    -webkit-box-shadow: 0 11px 30px -20px rgba(0, 0, 0, 0.51), 0 -11px 30px -20px rgba(0, 0, 0, 0.51);
    box-shadow: 0 11px 30px -20px rgba(0, 0, 0, 0.51), 0 -11px 30px -20px rgba(0, 0, 0, 0.51);
}

.bs-64, .bs-64h:hover {
    -webkit-box-shadow: 0 11px 8px -10px rgba(0, 0, 0, 0.51), 0 -11px 8px -10px rgba(0, 0, 0, 0.51);
    box-shadow: 0 11px 8px -10px rgba(0, 0, 0, 0.51), 0 -11px 8px -10px rgba(0, 0, 0, 0.51);
}

/*------------------------------------------------------------------
[19. Misc]
------------------------------------------------------------------*/
.blind {
    position: absolute;
    clip: rect(0 0 0 0);
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
}

.icon-list .fa-item {
    display: block;
    color: #121212;
    line-height: 32px;
    height: 32px;
    padding-left: 10px;
}

.icon-list .fa-item > i {
    width: 32px;
    font-size: 14px;
    display: inline-block;
    text-align: right;
    margin-right: 10px;
}

.push-on-sidebar-open {
    -webkit-transition: -webkit-transform 0.25s ease;
    transition: -webkit-transform 0.25s ease;
    -o-transition: transform 0.25s ease;
    transition: transform 0.25s ease;
    transition: transform 0.25s ease, -webkit-transform 0.25s ease;
    -webkit-backface-visibility: hidden;
}

/* Thumbnail */
.thumbnail-wrapper {
    display: inline-block;
    overflow: hidden;
    float: left;
}

.thumbnail-wrapper.circular {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

.thumbnail-wrapper.bordered {
    border-width: 4px;
    border-style: solid;
}

.thumbnail-wrapper.bordered.d16 {
    width: 20px;
    height: 20px;
}

.thumbnail-wrapper.bordered.d16 > * {
    line-height: 12px;
}

.thumbnail-wrapper.bordered.d24 {
    width: 28px;
    height: 28px;
}

.thumbnail-wrapper.bordered.d24 > * {
    line-height: 24px;
}

.thumbnail-wrapper.bordered.d32 {
    width: 36px;
    height: 36px;
}

.thumbnail-wrapper.bordered.d32 > * {
    line-height: 28px;
}

.thumbnail-wrapper.bordered.d48 {
    width: 52px;
    height: 52px;
}

.thumbnail-wrapper.bordered.d48 > * {
    line-height: 44px;
}

.thumbnail-wrapper.d16 {
    width: 16px;
    height: 16px;
}

.thumbnail-wrapper.d16 > * {
    line-height: 16px;
}

.thumbnail-wrapper.d24 {
    width: 24px;
    height: 24px;
}

.thumbnail-wrapper.d24 > * {
    line-height: 24px;
}

.thumbnail-wrapper.d32 {
    width: 32px;
    height: 32px;
}

.thumbnail-wrapper.d32 > * {
    line-height: 32px;
}

.thumbnail-wrapper.d39 {
    width: 39px;
    height: 39px;
}

.thumbnail-wrapper.d39 > * {
    line-height: 39px;
}

.thumbnail-wrapper.d48 {
    width: 48px;
    height: 48px;
}

.thumbnail-wrapper.d48 > * {
    line-height: 50px;
}

.thumbnail-wrapper > * {
    vertical-align: middle;
    width: 100%;
    height: 100%;
    text-align: center;
}


/* Scroll */
.scrollable {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* Override */
.no-padding {
    padding: 0px !important;
}

.no-margin {
    margin: 0px !important;
}

.no-overflow {
    overflow: hidden !important;
}

.auto-overflow {
    overflow: auto !important;
}

.reset-overflow {
    overflow: initial !important;
}

.center-margin {
    margin-left: auto;
    margin-right: auto;
}

.inherit-size {
    width: inherit;
    height: inherit;
}

.inherit-height {
    height: inherit;
}

.image-responsive-height {
    width: 100%;
}

.image-responsive-width {
    height: 100%;
}

.overlayer {
    position: absolute;
    display: block;
    z-index: 21;
}

.overlayer.fullwidth {
    width: 100%;
}

.overlayer-wrapper {
    position: relative;
    display: block;
    z-index: 10;
}

.overlay-fixed {
    position: fixed !important;
    top: auto !important;
}

.top-left {
    position: absolute !important;
    top: 0;
    left: 0;
}

.top-right {
    position: absolute !important;
    top: 1px;
    right: 0;
}

.bottom-left {
    position: absolute !important;
    bottom: 1px;
    left: 0;
}

.bottom-right {
    position: absolute !important;
    bottom: 0;
    right: 0;
}

.pull-bottom {
    position: absolute !important;
    bottom: 0;
}

.pull-up {
    position: absolute !important;
    top: 0;
}

.pull-left {
    float: left !important;
}

.pull-right {
    float: right !important;
}

.pull-center {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    display: table;
    z-index: 1;
}

.cursor {
    cursor: pointer;
}

.scroll-x-hidden {
    overflow-x: hidden !important;
}

/* Flag Helpers */
.flag {
    display: inline-block;
    position: relative;
    top: 1px;
    width: 16px;
    height: 11px;
    font-size: 0;
    line-height: 0;
    margin: 0;
    padding: 0;
    background: url('../img/icons/flags.png') no-repeat
}

.flag.flag-gu {
    background-position: -96px -55px
}

.flag.flag-mn {
    background-position: -208px -88px
}

.flag.flag-va {
    background-position: -48px -154px
}

.flag.flag-tibet {
    background-position: -32px -143px
}

.flag.flag-fo {
    background-position: -64px -44px
}

.flag.flag-th {
    background-position: -16px -143px
}

.flag.flag-tr {
    background-position: -144px -143px
}

.flag.flag-tl {
    background-position: -80px -143px
}

.flag.flag-kz {
    background-position: -144px -77px
}

.flag.flag-zm {
    background-position: -16px -165px
}

.flag.flag-uz {
    background-position: -32px -154px
}

.flag.flag-dk {
    background-position: -64px -33px
}

.flag.flag-scotland {
    background-position: -176px -121px
}

.flag.flag-gi {
    background-position: -224px -44px
}

.flag.flag-gy {
    background-position: -128px -55px
}

.flag.flag-bj {
    background-position: -112px -11px
}

.flag.flag-fr {
    background-position: -80px -44px
}

.flag.flag-mo {
    background-position: -224px -88px
}

.flag.flag-ir {
    background-position: -112px -66px
}

.flag.flag-io {
    background-position: -80px -66px
}

.flag.flag-tm {
    background-position: -96px -143px
}

.flag.flag-ch {
    background-position: -96px -22px
}

.flag.flag-mt {
    background-position: -32px -99px
}

.flag.flag-nl {
    background-position: -240px -99px
}

.flag.flag-gp {
    background-position: -16px -55px
}

.flag.flag-im {
    background-position: -48px -66px
}

.flag.flag-tv {
    background-position: -176px -143px
}

.flag.flag-mu {
    background-position: -48px -99px
}

.flag.flag-pe {
    background-position: -96px -110px
}

.flag.flag-vi {
    background-position: -112px -154px
}

.flag.flag-hn {
    background-position: -176px -55px
}

.flag.flag-ss {
    background-position: -128px -132px
}

.flag.flag-ae {
    background-position: -16px 0
}

.flag.flag-td {
    background-position: -240px -132px
}

.flag.flag-pw {
    background-position: 0 -121px
}

.flag.flag-nu {
    background-position: -32px -110px
}

.flag.flag-bt {
    background-position: -208px -11px
}

.flag.flag-ms {
    background-position: -16px -99px
}

.flag.flag-cv {
    background-position: -240px -22px
}

.flag.flag-es {
    background-position: -224px -33px
}

.flag.flag-mh {
    background-position: -144px -88px
}

.flag.flag-la {
    background-position: -160px -77px
}

.flag.flag-vn {
    background-position: -128px -154px
}

.flag.flag-py {
    background-position: -16px -121px
}

.flag.flag-br {
    background-position: -176px -11px
}

.flag.flag-ye {
    background-position: -224px -154px
}

.flag.flag-ie {
    background-position: 0 -66px
}

.flag.flag-gh {
    background-position: -208px -44px
}

.flag.flag-cg {
    background-position: -80px -22px
}

.flag.flag-cu {
    background-position: -224px -22px
}

.flag.flag-hu {
    background-position: -224px -55px
}

.flag.flag-sg {
    background-position: -224px -121px
}

.flag.flag-at {
    background-position: -176px 0
}

.flag.flag-lk {
    background-position: -224px -77px
}

.flag.flag-vu {
    background-position: -144px -154px
}

.flag.flag-bo {
    background-position: -160px -11px
}

.flag.flag-jo {
    background-position: -208px -66px
}

.flag.flag-er {
    background-position: -208px -33px
}

.flag.flag-za {
    background-position: -256px -154px
}

.flag.flag-rs {
    background-position: -80px -121px
}

.flag.flag-nr {
    background-position: -16px -110px
}

.flag.flag-ls {
    background-position: -256px -77px
}

.flag.flag-jm {
    background-position: -192px -66px
}

.flag.flag-tz {
    background-position: -208px -143px
}

.flag.flag-ki {
    background-position: -16px -77px
}

.flag.flag-sj {
    background-position: 0 -132px
}

.flag.flag-cz {
    background-position: -16px -33px
}

.flag.flag-pg {
    background-position: -128px -110px
}

.flag.flag-lv {
    background-position: -32px -88px
}

.flag.flag-do {
    background-position: -96px -33px
}

.flag.flag-lu {
    background-position: -16px -88px
}

.flag.flag-no {
    background-position: -256px -99px
}

.flag.flag-kw {
    background-position: -112px -77px
}

.flag.flag-mx {
    background-position: -96px -99px
}

.flag.flag-yt {
    background-position: -240px -154px
}

.flag.flag-ly {
    background-position: -48px -88px
}

.flag.flag-cy {
    background-position: 0 -33px
}

.flag.flag-ph {
    background-position: -144px -110px
}

.flag.flag-my {
    background-position: -112px -99px
}

.flag.flag-sm {
    background-position: -48px -132px
}

.flag.flag-et {
    background-position: -240px -33px
}

.flag.flag-ru {
    background-position: -96px -121px
}

.flag.flag-tj {
    background-position: -48px -143px
}

.flag.flag-ai {
    background-position: -64px 0
}

.flag.flag-pl {
    background-position: -176px -110px
}

.flag.flag-kp {
    background-position: -64px -77px
}

.flag.flag-uy {
    background-position: -16px -154px
}

.flag.flag-gb {
    background-position: -112px -44px
}

.flag.flag-gs {
    background-position: -64px -55px
}

.flag.flag-kurdistan {
    background-position: -96px -77px
}

.flag.flag-rw {
    background-position: -112px -121px
}

.flag.flag-ec {
    background-position: -128px -33px
}

.flag.flag-mm {
    background-position: -192px -88px
}

.flag.flag-pa {
    background-position: -80px -110px
}

.flag.flag-wales {
    background-position: -160px -154px
}

.flag.flag-kg {
    background-position: -256px -66px
}

.flag.flag-ve {
    background-position: -80px -154px
}

.flag.flag-tk {
    background-position: -64px -143px
}

.flag.flag-ca {
    background-position: -16px -22px
}

.flag.flag-is {
    background-position: -128px -66px
}

.flag.flag-ke {
    background-position: -240px -66px
}

.flag.flag-ro {
    background-position: -64px -121px
}

.flag.flag-gq {
    background-position: -32px -55px
}

.flag.flag-pt {
    background-position: -256px -110px
}

.flag.flag-tf {
    background-position: -256px -132px
}

.flag.flag-ad {
    background-position: 0 0
}

.flag.flag-sk {
    background-position: -16px -132px
}

.flag.flag-pm {
    background-position: -192px -110px
}

.flag.flag-om {
    background-position: -64px -110px
}

.flag.flag-an {
    background-position: -112px 0
}

.flag.flag-ws {
    background-position: -192px -154px
}

.flag.flag-sh {
    background-position: -240px -121px
}

.flag.flag-mp {
    background-position: -240px -88px
}

.flag.flag-gt {
    background-position: -80px -55px
}

.flag.flag-cf {
    background-position: -64px -22px
}

.flag.flag-zanzibar {
    background-position: 0 -165px
}

.flag.flag-mw {
    background-position: -80px -99px
}

.flag.flag-catalonia {
    background-position: -32px -22px
}

.flag.flag-ug {
    background-position: -240px -143px
}

.flag.flag-je {
    background-position: -176px -66px
}

.flag.flag-km {
    background-position: -32px -77px
}

.flag.flag-in {
    background-position: -64px -66px
}

.flag.flag-bf {
    background-position: -48px -11px
}

.flag.flag-mc {
    background-position: -80px -88px
}

.flag.flag-sy {
    background-position: -192px -132px
}

.flag.flag-sn {
    background-position: -64px -132px
}

.flag.flag-kr {
    background-position: -80px -77px
}

.flag.flag-eu {
    background-position: -256px -33px
}

.flag.flag-bn {
    background-position: -144px -11px
}

.flag.flag-st {
    background-position: -144px -132px
}

.flag.flag-england {
    background-position: -192px -33px
}

.flag.flag-lc {
    background-position: -192px -77px
}

.flag.flag-dm {
    background-position: -80px -33px
}

.flag.flag-be {
    background-position: -32px -11px
}

.flag.flag-ni {
    background-position: -224px -99px
}

.flag.flag-ua {
    background-position: -224px -143px
}

.flag.flag-mz {
    background-position: -128px -99px
}

.flag.flag-pf {
    background-position: -112px -110px
}

.flag.flag-tn {
    background-position: -112px -143px
}

.flag.flag-ee {
    background-position: -144px -33px
}

.flag.flag-xk {
    background-position: -208px -154px
}

.flag.flag-sx {
    background-position: -176px -132px
}

.flag.flag-sd {
    background-position: -192px -121px
}

.flag.flag-gd {
    background-position: -128px -44px
}

.flag.flag-ci {
    background-position: -112px -22px
}

.flag.flag-sz {
    background-position: -208px -132px
}

.flag.flag-cl {
    background-position: -144px -22px
}

.flag.flag-fi {
    background-position: 0 -44px
}

.flag.flag-ga {
    background-position: -96px -44px
}

.flag.flag-jp {
    background-position: -224px -66px
}

.flag.flag-de {
    background-position: -32px -33px
}

.flag.flag-np {
    background-position: 0 -110px
}

.flag.flag-re {
    background-position: -48px -121px
}

.flag.flag-bg {
    background-position: -64px -11px
}

.flag.flag-sc {
    background-position: -160px -121px
}

.flag.flag-ng {
    background-position: -208px -99px
}

.flag.flag-qa {
    background-position: -32px -121px
}

.flag.flag-mk {
    background-position: -160px -88px
}

.flag.flag-aw {
    background-position: -208px 0
}

.flag.flag-kn {
    background-position: -48px -77px
}

.flag.flag-al {
    background-position: -80px 0
}

.flag.flag-bw {
    background-position: -240px -11px
}

.flag.flag-um {
    background-position: -256px -143px
}

.flag.flag-ky {
    background-position: -128px -77px
}

.flag.flag-tt {
    background-position: -160px -143px
}

.flag.flag-so {
    background-position: -80px -132px
}

.flag.flag-lt {
    background-position: 0 -88px
}

.flag.flag-by {
    background-position: -256px -11px
}

.flag.flag-bb {
    background-position: 0 -11px
}

.flag.flag-us {
    background-position: 0 -154px
}

.flag.flag-md {
    background-position: -96px -88px
}

.flag.flag-ag {
    background-position: -48px 0
}

.flag.flag-hm {
    background-position: -160px -55px
}

.flag.flag-as {
    background-position: -160px 0
}

.flag.flag-eg {
    background-position: -160px -33px
}

.flag.flag-sv {
    background-position: -160px -132px
}

.flag.flag-sl {
    background-position: -32px -132px
}

.flag.flag-fk {
    background-position: -32px -44px
}

.flag.flag-am {
    background-position: -96px 0
}

.flag.flag-ck {
    background-position: -128px -22px
}

.flag.flag-tw {
    background-position: -192px -143px
}

.flag.flag-kh {
    background-position: 0 -77px
}

.flag.flag-to {
    background-position: -128px -143px
}

.flag.flag-se {
    background-position: -208px -121px
}

.flag.flag-cd {
    background-position: -48px -22px
}

.flag.flag-pn {
    background-position: -208px -110px
}

.flag.flag-gr {
    background-position: -48px -55px
}

.flag.flag-id {
    background-position: -256px -55px
}

.flag.flag-vc {
    background-position: -64px -154px
}

.flag.flag-somaliland {
    background-position: -96px -132px
}

.flag.flag-bi {
    background-position: -96px -11px
}

.flag.flag-pk {
    background-position: -160px -110px
}

.flag.flag-pr {
    background-position: -224px -110px
}

.flag.flag-bd {
    background-position: -16px -11px
}

.flag.flag-co {
    background-position: -192px -22px
}

.flag.flag-fm {
    background-position: -48px -44px
}

.flag.flag-bm {
    background-position: -128px -11px
}

.flag.flag-ar {
    background-position: -144px 0
}

.flag.flag-bv {
    background-position: -224px -11px
}

.flag.flag-sb {
    background-position: -144px -121px
}

.flag.flag-mq {
    background-position: -256px -88px
}

.flag.flag-eh {
    background-position: -176px -33px
}

.flag.flag-bh {
    background-position: -80px -11px
}

.flag.flag-it {
    background-position: -144px -66px
}

.flag.flag-hr {
    background-position: -192px -55px
}

.flag.flag-sa {
    background-position: -128px -121px
}

.flag.flag-mv {
    background-position: -64px -99px
}

.flag.flag-mg {
    background-position: -128px -88px
}

.flag.flag-dz {
    background-position: -112px -33px
}

.flag.flag-gg {
    background-position: -192px -44px
}

.flag.flag-gm {
    background-position: -256px -44px
}

.flag.flag-af {
    background-position: -32px 0
}

.flag.flag-li {
    background-position: -208px -77px
}

.flag.flag-sr {
    background-position: -112px -132px
}

.flag.flag-vg {
    background-position: -96px -154px
}

.flag.flag-cr {
    background-position: -208px -22px
}

.flag.flag-tc {
    background-position: -224px -132px
}

.flag.flag-ao {
    background-position: -128px 0
}

.flag.flag-ma {
    background-position: -64px -88px
}

.flag.flag-mr {
    background-position: 0 -99px
}

.flag.flag-gn {
    background-position: 0 -55px
}

.flag.flag-ne {
    background-position: -176px -99px
}

.flag.flag-nf {
    background-position: -192px -99px
}

.flag.flag-wf {
    background-position: -176px -154px
}

.flag.flag-hk {
    background-position: -144px -55px
}

.flag.flag-gf {
    background-position: -160px -44px
}

.flag.flag-ps {
    background-position: -240px -110px
}

.flag.flag-ic {
    background-position: -240px -55px
}

.flag.flag-cw {
    background-position: -256px -22px
}

.flag.flag-ml {
    background-position: -176px -88px
}

.flag.flag-ax {
    background-position: -224px 0
}

.flag.flag-gl {
    background-position: -240px -44px
}

.flag.flag-dj {
    background-position: -48px -33px
}

.flag.flag-cn {
    background-position: -176px -22px
}

.flag.flag-ht {
    background-position: -208px -55px
}

.flag.flag-lr {
    background-position: -240px -77px
}

.flag.flag-tg {
    background-position: 0 -143px
}

.flag.flag-ba {
    background-position: -256px 0
}

.flag.flag-ge {
    background-position: -144px -44px
}

.flag.flag-bz {
    background-position: 0 -22px
}

.flag.flag-au {
    background-position: -192px 0
}

.flag.flag-iq {
    background-position: -96px -66px
}

.flag.flag-cm {
    background-position: -160px -22px
}

.flag.flag-gw {
    background-position: -112px -55px
}

.flag.flag-az {
    background-position: -240px 0
}

.flag.flag-na {
    background-position: -144px -99px
}

.flag.flag-fj {
    background-position: -16px -44px
}

.flag.flag-zw {
    background-position: -32px -165px
}

.flag.flag-bs {
    background-position: -192px -11px
}

.flag.flag-il {
    background-position: -16px -66px
}

.flag.flag-nz {
    background-position: -48px -110px
}

.flag.flag-me {
    background-position: -112px -88px
}

.flag.flag-si {
    background-position: -256px -121px
}

.flag.flag-nc {
    background-position: -160px -99px
}

.flag.flag-lb {
    background-position: -176px -77px
}

/* Height Helpers */
.h-px-10 {
    height: 10px !important;
}

.h-px-20 {
    height: 20px !important;
}

.h-px-30 {
    height: 30px !important;
}

.h-px-40 {
    height: 40px !important;
}

.h-px-50 {
    height: 50px !important;
}

.h-px-60 {
    height: 60px !important;
}

.h-px-70 {
    height: 70px !important;
}

.h-px-80 {
    height: 80px !important;
}

.h-px-90 {
    height: 90px !important;
}

.h-px-100 {
    height: 100px !important;
}

.h-px-200 {
    height: 200px !important;
}

.h-px-250 {
    height: 250px !important;
}

.h-px-300 {
    height: 300px !important;
}

.h-px-400 {
    height: 400px !important;
}

.h-px-500 {
    height: 500px !important;
}

.h-px-600 {
    height: 600px !important;
}

.m-h-10 {
    min-height: 10vh !important;
}

.m-h-15 {
    min-height: 15vh !important;
}

.m-h-20 {
    min-height: 20vh !important;
}

.m-h-30 {
    min-height: 30vh !important;
}

.m-h-40 {
    min-height: 40vh !important;
}

.m-h-50 {
    min-height: 50vh !important;
}

.m-h-60 {
    min-height: 60vh !important;
}

.m-h-70 {
    min-height: 70vh !important;
}

.m-h-80 {
    min-height: 80vh !important;
}

.m-h-90 {
    min-height: 90vh !important;
}

.m-h-100 {
    min-height: 100vh !important;
}

/* Padding Helpers */
.p-t-0 {
    padding-top: 0px !important;
}

.p-r-0 {
    padding-right: 0px !important;
}

.p-l-0 {
    padding-left: 0px !important;
}

.p-b-0 {
    padding-bottom: 0px !important;
}

.padding-0 {
    padding: 0px !important;
}

.p-t-5 {
    padding-top: 5px !important;
}

.p-r-5 {
    padding-right: 5px !important;
}

.p-l-5 {
    padding-left: 5px !important;
}

.p-b-5 {
    padding-bottom: 5px !important;
}

.padding-5 {
    padding: 5px !important;
}

.p-t-10 {
    padding-top: 10px !important;
}

.p-r-10 {
    padding-right: 10px !important;
}

.p-l-10 {
    padding-left: 10px !important;
}

.p-b-10 {
    padding-bottom: 10px !important;
}

.padding-10 {
    padding: 10px !important;
}

.p-t-15 {
    padding-top: 15px !important;
}

.p-r-15 {
    padding-right: 15px !important;
}

.p-l-15 {
    padding-left: 15px !important;
}

.p-b-15 {
    padding-bottom: 15px !important;
}

.padding-15 {
    padding: 15px !important;
}

.p-t-20 {
    padding-top: 20px !important;
}

.p-r-20 {
    padding-right: 20px !important;
}

.p-l-20 {
    padding-left: 20px !important;
}

.p-b-20 {
    padding-bottom: 20px !important;
}

.padding-20 {
    padding: 20px !important;
}

.p-t-25 {
    padding-top: 25px !important;
}

.p-r-25 {
    padding-right: 25px !important;
}

.p-l-25 {
    padding-left: 25px !important;
}

.p-b-25 {
    padding-bottom: 25px !important;
}

.padding-25 {
    padding: 25px !important;
}

.p-t-30 {
    padding-top: 30px !important;
}

.p-r-30 {
    padding-right: 30px !important;
}

.p-l-30 {
    padding-left: 30px !important;
}

.p-b-30 {
    padding-bottom: 30px !important;
}

.padding-30 {
    padding: 30px !important;
}

.p-t-35 {
    padding-top: 35px !important;
}

.p-r-35 {
    padding-right: 35px !important;
}

.p-l-35 {
    padding-left: 35px !important;
}

.p-b-35 {
    padding-bottom: 35px !important;
}

.padding-35 {
    padding: 35px !important;
}

.p-t-40 {
    padding-top: 40px !important;
}

.p-r-40 {
    padding-right: 40px !important;
}

.p-l-40 {
    padding-left: 40px !important;
}

.p-b-40 {
    padding-bottom: 40px !important;
}

.padding-40 {
    padding: 40px !important;
}

.p-t-45 {
    padding-top: 45px !important;
}

.p-r-45 {
    padding-right: 45px !important;
}

.p-l-45 {
    padding-left: 45px !important;
}

.p-b-45 {
    padding-bottom: 45px !important;
}

.padding-45 {
    padding: 45px !important;
}

.p-t-50 {
    padding-top: 50px !important;
}

.p-r-50 {
    padding-right: 50px !important;
}

.p-l-50 {
    padding-left: 50px !important;
}

.p-b-50 {
    padding-bottom: 50px !important;
}

.padding-50 {
    padding: 50px !important;
}

/* Margin Helpers */
.m-t-0 {
    margin-top: 0px;
}

.m-r-0 {
    margin-right: 0px;
}

.m-l-0 {
    margin-left: 0px;
}

.m-b-0 {
    margin-bottom: 0px !important;
}

.m-t-1 {
    margin-top: 1px;
}

.m-r-1 {
    margin-right: 1px;
}

.m-l-1 {
    margin-left: 1px;
}

.m-b-1 {
    margin-bottom: 1px;
}

.m-t-2 {
    margin-top: 2px;
}

.m-r-2 {
    margin-right: 2px;
}

.m-l-2 {
    margin-left: 2px;
}

.m-b-2 {
    margin-bottom: 2px;
}

.m-t-3 {
    margin-top: 3px;
}

.m-r-3 {
    margin-right: 3px;
}

.m-l-3 {
    margin-left: 3px;
}

.m-b-3 {
    margin-bottom: 3px;
}

.m-t-4 {
    margin-top: 4px;
}

.m-r-4 {
    margin-right: 4px;
}

.m-l-4 {
    margin-left: 4px;
}

.m-b-4 {
    margin-bottom: 4px;
}

.m-t-5 {
    margin-top: 5px;
}

.m-r-5 {
    margin-right: 5px;
}

.m-l-5 {
    margin-left: 5px;
}

.m-b-5 {
    margin-bottom: 5px;
}

.m-t-10 {
    margin-top: 10px;
}

.m-r-10 {
    margin-right: 10px;
}

.m-l-10 {
    margin-left: 10px;
}

.m-b-10 {
    margin-bottom: 10px;
}

.m-t-15 {
    margin-top: 15px;
}

.m-r-15 {
    margin-right: 15px;
}

.m-l-15 {
    margin-left: 15px;
}

.m-b-15 {
    margin-bottom: 15px;
}

.m-t-20 {
    margin-top: 20px;
}

.m-r-20 {
    margin-right: 20px;
}

.m-l-20 {
    margin-left: 20px;
}

.m-b-20 {
    margin-bottom: 20px;
}

.m-t-25 {
    margin-top: 25px;
}

.m-r-25 {
    margin-right: 25px;
}

.m-l-25 {
    margin-left: 25px;
}

.m-b-25 {
    margin-bottom: 25px;
}

.m-t-30 {
    margin-top: 30px;
}

.m-r-30 {
    margin-right: 30px;
}

.m-l-30 {
    margin-left: 30px;
}

.m-b-30 {
    margin-bottom: 30px;
}

.m-t-35 {
    margin-top: 35px;
}

.m-r-35 {
    margin-right: 35px;
}

.m-l-35 {
    margin-left: 35px;
}

.m-b-35 {
    margin-bottom: 35px;
}

.m-t-40 {
    margin-top: 40px;
}

.m-r-40 {
    margin-right: 40px;
}

.m-l-40 {
    margin-left: 40px;
}

.m-b-40 {
    margin-bottom: 40px;
}

.m-t-45 {
    margin-top: 45px;
}

.m-r-45 {
    margin-right: 45px;
}

.m-l-45 {
    margin-left: 45px;
}

.m-b-45 {
    margin-bottom: 45px;
}

.m-t-50 {
    margin-top: 50px;
}

.m-r-50 {
    margin-right: 50px;
}

.m-l-50 {
    margin-left: 50px;
}

.m-b-50 {
    margin-bottom: 50px;
}

.full-height {
    height: 100% !important;
}

.full-width {
    width: 100%;
}

.hide {
    display: none !important;
}

.inline {
    display: inline-block !important;
}

.block {
    display: block !important;
}

.b-blank {
    border-color: #000;
}

/* Border Helpers */
.b-a,
.b-r,
.b-l,
.b-t,
.b-b {
    border-style: solid;
    border-width: 0;
}

.b-r {
    border-right-width: 1px;
}

.b-l {
    border-left-width: 1px;
}

.b-t {
    border-top-width: 1px;
}

.b-b {
    border-bottom-width: 1px;
}

.b-a {
    border-width: 1px;
}

.b-dashed {
    border-style: dashed;
}

.b-thick {
    border-width: 2px;
}

.b-transparent {
    border-color: transparent;
}

.b-transparent-white {
    border-color: rgba(255, 255, 255, 0.3);
}

.b-grey {
    border-color: rgba(33, 33, 33, 0.14);
}

.b-white {
    border-color: #fff;
}

.b-primary {
    border-color: #F47104;
}

.b-complete {
    border-color: #0072EC;
}

.b-success {
    border-color: #19AD79;
}

.b-info {
    border-color: #3B4752;
}

.b-danger {
    border-color: #D83C31;
}

.b-warning {
    border-color: #FFd945;
}

/* Border Radius */
.b-rad-sm {
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

.b-rad-md {
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.b-rad-lg {
    border-radius: 7px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
}

.no-border {
    border: none !important;
}

.relative {
    position: relative;
}

.flex-1 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

[data-ka-bg-image] {
    background-size: cover;
}

.error-number {
    font-family: "Open Sans", sans-serif;
    font-size: 90px;
    line-height: 90px;
}

.error-container-innner {
    margin-left: auto;
    margin-right: auto;
    width: 360px;
}

.error-container {
    margin-top: -100px;
    width: 38%;
}

.visible-xlg {
    display: none;
}

.hidden-xlg {
    display: block;
}

.sm-gutter .row > [class^="col-"],
.sm-gutter .row > [class*="col-"] {
    padding-left: 5px;
    padding-right: 5px;
}

.sm-gutter .row {
    margin-left: -5px;
    margin-right: -5px;
}


/* Aspect ratio */
.ar-1-1 .card,
.ar-2-1 .card,
.ar-1-2 .card,
.ar-3-2 .card,
.ar-2-3 .card {
    margin: 0;
}

.ar-1-1 {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ar-1-1:before {
    content: "";
    display: block;
    padding-top: 100%;
}

.ar-1-1 > div {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.ar-2-1 {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ar-2-1:before {
    content: "";
    display: block;
    padding-top: calc(50% - 5px);
}

.ar-2-1 > div {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.ar-1-2 {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ar-1-2:before {
    content: "";
    display: block;
    padding-top: calc(150% - 5px);
}

.ar-1-2 > div {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.ar-3-2 {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ar-3-2:before {
    content: "";
    display: block;
    padding-top: calc(75% - 5px);
}

.ar-3-2 > div {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.ar-2-3 {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.ar-2-3:before {
    content: "";
    display: block;
    padding-top: calc(125% - 5px);
}

.ar-2-3 > div {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

/* vertical alignment */
.v-align-bottom {
    vertical-align: bottom !important;
}

.v-align-top {
    vertical-align: top !important;
}

.v-align-middle {
    vertical-align: middle !important;
}

.col-top {
    vertical-align: top !important;
}

.col-middle {
    vertical-align: middle !important;
}

.col-bottom {
    vertical-align: bottom !important;
}

/* columns of same height */
.container-xs-height {
    display: table;
    padding-left: 0px;
    padding-right: 0px;
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.row-xs-height {
    display: table-row;
}

.col-xs-height {
    display: table-cell;
    float: none;
}

@media (min-width: 768px) {
    .container-sm-height {
        display: table;
        padding-left: 0px;
        padding-right: 0px;
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }

    .row-sm-height {
        display: table-row;
    }

    .col-sm-height {
        /*display:table-cell !important;
        float:none !important;*/
    }
}

@media (min-width: 992px) {
    .container-md-height {
        display: table;
        padding-left: 0px;
        padding-right: 0px;
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }

    .row-md-height {
        display: table-row;
    }

    .col-md-height {
        display: table-cell !important;
        float: none !important;
    }
}

@media (min-width: 1200px) {
    .container-lg-height {
        display: table;
        padding-left: 0px;
        padding-right: 0px;
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }

    .row-lg-height {
        display: table-row;
    }

    .col-lg-height {
        display: table-cell !important;
        float: none !important;
    }
}

.windows .d-flex {
    -ms-flex-wrap: wrap;
}

/* Views page */
.view-iframe-wrapper {
    width: 100%;
    height: 255px;
    background: #fff;
    position: relative;
}

.view-iframe-wrapper iframe {
    width: 100%;
    height: 100%;
    padding: 45px 45px 0 45px;
}

@media (max-width: 1200px) {
    .view-iframe-wrapper iframe {
        padding: 0;
    }
}

.visible-xlg {
    display: none;
}

.hidden-xlg {
    display: block;
}

/*** Large screen ***/
@media (min-width: 1824px) {
    .visible-xlg {
        display: block !important;
    }

    .hidden-xlg {
        display: none !important;
    }

    .container-fluid.container-fixed-lg {
        width: 1700px;
        margin-right: auto;
        margin-left: auto;
    }

    /*.visible-xlg {
        display: block !important;
    }
    .hidden-xlg {
        display: none !important;
    }*/
    .col-xlg-1,
    .col-xlg-2,
    .col-xlg-3,
    .col-xlg-4,
    .col-xlg-5,
    .col-xlg-6,
    .col-xlg-7,
    .col-xlg-8,
    .col-xlg-9,
    .col-xlg-10,
    .col-xlg-11 {
        min-height: 1px;
        padding-left: 15px;
        padding-right: 15px;
        position: relative;
    }

    .col-xlg-12 {
        min-height: 1px;
        padding-left: 15px;
        padding-right: 15px;
        position: relative;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .col-xlg-11 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 91.6667%;
        flex: 0 0 91.6667%;
        max-width: 91.6667%;
    }

    .col-xlg-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.3333%;
        flex: 0 0 83.3333%;
        max-width: 83.3333%;
    }

    .col-xlg-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-xlg-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.6667%;
        flex: 0 0 66.6667%;
        max-width: 66.6667%;
    }

    .col-xlg-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.3333%;
        flex: 0 0 58.3333%;
        max-width: 58.3333%;
    }

    .col-xlg-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-xlg-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 41.6667%;
        flex: 0 0 41.6667%;
        max-width: 41.6667%;
    }

    .col-xlg-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3333%;
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }

    .col-xlg-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-xlg-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.6667%;
        flex: 0 0 16.6667%;
        max-width: 16.6667%;
    }

    .col-xlg-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333%;
        flex: 0 0 8.33333%;
        max-width: 8.33333%;
    }

    .col-xlg-pull-12 {
        right: 100%;
    }

    .col-xlg-pull-11 {
        right: 91.6667%;
    }

    .col-xlg-pull-10 {
        right: 83.3333%;
    }

    .col-xlg-pull-9 {
        right: 75%;
    }

    .col-xlg-pull-8 {
        right: 66.6667%;
    }

    .col-xlg-pull-7 {
        right: 58.3333%;
    }

    .col-xlg-pull-6 {
        right: 50%;
    }

    .col-xlg-pull-5 {
        right: 41.6667%;
    }

    .col-xlg-pull-4 {
        right: 33.3333%;
    }

    .col-xlg-pull-3 {
        right: 25%;
    }

    .col-xlg-pull-2 {
        right: 16.6667%;
    }

    .col-xlg-pull-1 {
        right: 8.33333%;
    }

    .col-xlg-pull-0 {
        right: 0;
    }

    .col-xlg-push-12 {
        left: 100%;
    }

    .col-xlg-push-11 {
        left: 91.6667%;
    }

    .col-xlg-push-10 {
        left: 83.3333%;
    }

    .col-xlg-push-9 {
        left: 75%;
    }

    .col-xlg-push-8 {
        left: 66.6667%;
    }

    .col-xlg-push-7 {
        left: 58.3333%;
    }

    .col-xlg-push-6 {
        left: 50%;
    }

    .col-xlg-push-5 {
        left: 41.6667%;
    }

    .col-xlg-push-4 {
        left: 33.3333%;
    }

    .col-xlg-push-3 {
        left: 25%;
    }

    .col-xlg-push-2 {
        left: 16.6667%;
    }

    .col-xlg-push-1 {
        left: 8.33333%;
    }

    .col-xlg-push-0 {
        left: 0;
    }

    .col-xlg-offset-12 {
        margin-left: 100%;
    }

    .col-xlg-offset-11 {
        margin-left: 91.6667%;
    }

    .col-xlg-offset-10 {
        margin-left: 83.3333%;
    }

    .col-xlg-offset-9 {
        margin-left: 75%;
    }

    .col-xlg-offset-8 {
        margin-left: 66.6667%;
    }

    .col-xlg-offset-7 {
        margin-left: 58.3333%;
    }

    .col-xlg-offset-6 {
        margin-left: 50%;
    }

    .col-xlg-offset-5 {
        margin-left: 41.6667%;
    }

    .col-xlg-offset-4 {
        margin-left: 33.3333%;
    }

    .col-xlg-offset-3 {
        margin-left: 25%;
    }

    .col-xlg-offset-2 {
        margin-left: 16.6667%;
    }

    .col-xlg-offset-1 {
        margin-left: 8.33333%;
    }

    .col-xlg-offset-0 {
        margin-left: 0;
    }
}

/*** Desktop ***/
/*** Medium Size Screen ***/
@media only screen and (max-width: 1400px) {
    .footer-widget {
        padding: 11px 21px !important;
    }
}

@media only screen and (max-width: 1199px) {
    .visible-xl-down {
        display: block !important;
    }
}

/*** Desktop & Laptop ***/
@media only screen and (min-width: 980px) {
}

/*** Tablet and phone ***/
@media (max-width: 991px) {
    .hidden-lg-down {
        display: none !important;
    }

    .ka-container {
        padding-left: 0;
    }

    .d-flex-lg-down {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .justify-between-lg-down {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    body.sidebar-open .ka-container {
        -webkit-transform: translate3d(250px, 0, 0);
        transform: translate3d(250px, 0, 0);
        -ms-transform: translate(250px, 0);
        overflow: hidden;
        position: fixed;
    }

    body.sidebar-open .push-on-sidebar-open {
        -webkit-transform: translate3d(250px, 0, 0);
        transform: translate3d(250px, 0, 0);
        -ms-transform: translate(250px, 0);
        overflow: hidden;
    }

    .sm-action-bar {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 10;
    }

    .sm-action-bar > a {
        padding: 10px;
        display: inline-block;
    }

    .pace .pace-activity {
        top: 60px;
    }

    .ka-container {
        padding-left: 0;
        position: relative;
        -webkit-transition: -webkit-transform .25s ease;
        transition: -webkit-transform .25s ease;
        -o-transition: transform .25s ease;
        transition: transform .25s ease;
        transition: transform .25s ease, -webkit-transform .25s ease;
        -webkit-transition: -webkit-transform 0.25s ease;
    }

    .ka-container .ka-content-wrapper .content {
        overflow-x: hidden;
        height: auto;
    }

    .inner-content {
        margin: 0;
    }

    .breadcrumb {
        padding-left: 25px;
        padding-right: 15px;
    }

    .copyright {
        padding-left: 15px;
        padding-right: 15px;
    }

    body > .kan-wrapper[data-position="top"] {
        top: 48px;
        left: 0;
    }

    body > .kan-wrapper[data-position="bottom"] {
        left: 0;
    }

    body > .kan-wrapper[data-position$='-left'] {
        left: 20px;
        right: auto;
    }

    .sm-table {
        display: table;
        width: 100%;
    }

    .user-profile-wrapper {
        position: absolute;
        right: 50px;
        top: -9px;
    }

    .container {
        width: 100%;
    }

    .table-responsive-block table,
    .table-responsive-block thead,
    .table-responsive-block tbody,
    .table-responsive-block th,
    .table-responsive-block td,
    .table-responsive-block tr {
        display: block;
    }

    .table-responsive-block thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .table-responsive-block tr {
        border: 1px solid rgba(230, 230, 230, 0.7);
        margin-bottom: 15px;
    }

    .table-responsive-block td {
        border: none;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 50%;
        white-space: normal;
        text-align: left;
    }

    .table-responsive-block td:last-child {
        border-bottom: 0;
    }

    .table-responsive-block td:before {
        position: absolute;
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: 700;
    }

    .table-responsive-block td:before {
        content: attr(data-title);
    }

    .kill-pull-md-down {
        position: relative;
        display: block;
        width: inherit;
    }

    .nav-tabs-header.nav-tabs-linetriangle {
        height: 61px;
    }

    .overlay {
        padding-left: 15px;
    }
}

/* Tablet: Landscape view */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .ka-container .ka-content-wrapper .content {
        /*
    padding-top: 80px;
*/
    }

    .error-page .error-container {
        width: auto;
    }

    .inner-content {
        margin-left: 0;
    }
}

@media (max-width: 991px) {
    .sm-b-r,
    .sm-b-l,
    .sm-b-t,
    .sm-b-b {
        border-width: 0;
    }

    .sm-b-r {
        border-right-width: 1px;
    }

    .sm-b-l {
        border-left-width: 1px;
    }

    .sm-b-t {
        border-top-width: 1px;
    }

    .sm-b-b {
        border-bottom-width: 1px;
    }
}

@media (min-width: 1200px) {
    .row-same-height {
        overflow: hidden;
    }

    .row-same-height > [class*="col-lg"] {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

@media (max-width: 1199px) and (min-width: 992px) {
    .visible-md {
        display: block !important;
    }
}

@media (min-width: 992px) {
    .row-same-height {
        overflow: hidden;
    }

    .row-same-height > [class*="col-md"] {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

@media (min-width: 768px) {
    .row-same-height {
        overflow: hidden;
    }

    .row-same-height > [class*="col-sm"] {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }

    .d-flex-md-up {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .navbar-toggle {
        display: none;
    }

    .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important;
    }

    .dataTables_wrapper.form-inline .checkbox input[type=checkbox],
    .form-inline .radio input[type=radio] {
        position: absolute;
    }

    .justify-end-md-up {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }
}

@media (min-width: 700px) {
    .dd {
        float: none;
    }
}

/* Tablet: Portrait view  */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
    .error-page .error-container {
        width: auto;
    }
}

@media (max-width: 991px) and (min-width: 768px) {
    .visible-sm {
        display: block;
    }

    .hidden-sm {
        display: none;
    }

    .visible-sm-inline-block {
        display: inline-block !important;
    }

    .md-p-t-0 {
        padding-top: 0px;
    }

    .md-p-r-0 {
        padding-right: 0px;
    }

    .md-p-l-0 {
        padding-left: 0px;
    }

    .md-p-b-0 {
        padding-bottom: 0px;
    }

    .md-p-t-5 {
        padding-top: 5px;
    }

    .md-p-r-5 {
        padding-right: 5px;
    }

    .md-p-l-5 {
        padding-left: 5px;
    }

    .md-p-b-5 {
        padding-bottom: 5px;
    }

    .md-p-t-10 {
        padding-top: 10px;
    }

    .md-p-r-10 {
        padding-right: 10px;
    }

    .md-p-l-10 {
        padding-left: 10px;
    }

    .md-p-b-10 {
        padding-bottom: 10px;
    }

    .md-p-t-15 {
        padding-top: 15px;
    }

    .md-p-r-15 {
        padding-right: 15px;
    }

    .md-p-l-15 {
        padding-left: 15px;
    }

    .md-p-b-15 {
        padding-bottom: 15px;
    }

    .md-p-t-20 {
        padding-top: 20px;
    }

    .md-p-r-20 {
        padding-right: 20px;
    }

    .md-p-l-20 {
        padding-left: 20px;
    }

    .md-p-b-20 {
        padding-bottom: 20px;
    }

    .md-p-t-25 {
        padding-top: 25px;
    }

    .md-p-r-25 {
        padding-right: 25px;
    }

    .md-p-l-25 {
        padding-left: 25px;
    }

    .md-p-b-25 {
        padding-bottom: 25px;
    }

    .md-p-t-30 {
        padding-top: 30px;
    }

    .md-p-r-30 {
        padding-right: 30px;
    }

    .md-p-l-30 {
        padding-left: 30px;
    }

    .md-p-b-30 {
        padding-bottom: 30px;
    }


    .md-m-t-0 {
        margin-top: 0;
    }

    .md-m-r-0 {
        margin-right: 0;
    }

    .md-m-l-0 {
        margin-left: 0;
    }

    .md-m-b-0 {
        margin-bottom: 0;
    }

    .md-m-t-5 {
        margin-top: 5px;
    }

    .md-m-r-5 {
        margin-right: 5px;
    }

    .md-m-l-5 {
        margin-left: 5px;
    }

    .md-m-b-5 {
        margin-bottom: 5px;
    }

    .md-m-t-10 {
        margin-top: 10px;
    }

    .md-m-r-10 {
        margin-right: 10px;
    }

    .md-m-l-10 {
        margin-left: 10px;
    }

    .md-m-b-10 {
        margin-bottom: 10px;
    }

    .md-m-t-15 {
        margin-top: 15px;
    }

    .md-m-r-15 {
        margin-right: 15px;
    }

    .md-m-l-15 {
        margin-left: 15px;
    }

    .md-m-b-15 {
        margin-bottom: 15px;
    }

    .md-m-t-20 {
        margin-top: 20px;
    }

    .md-m-r-20 {
        margin-right: 20px;
    }

    .md-m-l-20 {
        margin-left: 20px;
    }

    .md-m-b-20 {
        margin-bottom: 20px;
    }

    .md-m-t-25 {
        margin-top: 25px;
    }

    .md-m-r-25 {
        margin-right: 25px;
    }

    .md-m-l-25 {
        margin-left: 25px;
    }

    .md-m-b-25 {
        margin-bottom: 25px;
    }

    .md-m-t-30 {
        margin-top: 30px;
    }

    .md-m-r-30 {
        margin-right: 30px;
    }

    .md-m-l-30 {
        margin-left: 30px;
    }

    .md-m-b-30 {
        margin-bottom: 30px;
    }


}

@media (max-width: 979px) {
    .md-padding-0 {
        padding: 0px !important;
    }

    .md-padding-10 {
        padding: 10px !important;
    }

    .md-padding-20 {
        padding: 20px !important;
    }

    .md-padding-30 {
        padding: 30px !important;
    }

    .md-padding-40 {
        padding: 40px !important;
    }

    .md-padding-50 {
        padding: 50px !important;
    }
}

@media (max-width: 767px) {
    .header {
        height: 80px;
    }

    /* .header .header-inner {
    height: 80px;
  } */
    .header .user-info-wrapper {
        display: none;
    }

    .header .search-link {
        height: 19px;
        width: 16px;
        overflow: hidden;
    }

    .jumbotron,
    .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .ka-container .ka-content-wrapper .content {
        padding-top: 0px;
    }

    .sm-pull-bottom,
    .sm-pull-up {
        position: relative !important;
    }

    .sm-p-t-0 {
        padding-top: 0px !important;
    }

    .sm-p-r-0 {
        padding-right: 0px !important;
    }

    .sm-p-l-0 {
        padding-left: 0px !important;
    }

    .sm-p-b-0 {
        padding-bottom: 0px !important;
    }

    .sm-padding-0 {
        padding: 0px !important;
    }

    .sm-p-t-5 {
        padding-top: 5px !important;
    }

    .sm-p-r-5 {
        padding-right: 5px !important;
    }

    .sm-p-l-5 {
        padding-left: 5px !important;
    }

    .sm-p-b-5 {
        padding-bottom: 5px !important;
    }

    .sm-padding-5 {
        padding: 5px !important;
    }

    .sm-p-t-10 {
        padding-top: 10px !important;
    }

    .sm-p-r-10 {
        padding-right: 10px !important;
    }

    .sm-p-l-10 {
        padding-left: 10px !important;
    }

    .sm-p-b-10 {
        padding-bottom: 10px !important;
    }

    .sm-padding-10 {
        padding: 10px !important;
    }

    .sm-p-t-15 {
        padding-top: 15px !important;
    }

    .sm-p-r-15 {
        padding-right: 15px !important;
    }

    .sm-p-l-15 {
        padding-left: 15px !important;
    }

    .sm-p-b-15 {
        padding-bottom: 15px !important;
    }

    .sm-padding-15 {
        padding: 15px !important;
    }

    .sm-p-t-20 {
        padding-top: 20px !important;
    }

    .sm-p-r-20 {
        padding-right: 20px !important;
    }

    .sm-p-l-20 {
        padding-left: 20px !important;
    }

    .sm-p-b-20 {
        padding-bottom: 20px !important;
    }

    .sm-padding-20 {
        padding: 20px !important;
    }

    .sm-p-t-25 {
        padding-top: 25px !important;
    }

    .sm-p-r-25 {
        padding-right: 25px !important;
    }

    .sm-p-l-25 {
        padding-left: 25px !important;
    }

    .sm-p-b-25 {
        padding-bottom: 25px !important;
    }

    .sm-padding-25 {
        padding: 25px !important;
    }

    .sm-p-t-30 {
        padding-top: 30px !important;
    }

    .sm-p-r-30 {
        padding-right: 30px !important;
    }

    .sm-p-l-30 {
        padding-left: 30px !important;
    }

    .sm-p-b-30 {
        padding-bottom: 30px !important;
    }

    .sm-padding-30 {
        padding: 30px !important;
    }

    .sm-padding-40 {
        padding: 40px !important;
    }

    .sm-padding-50 {
        padding: 50px !important;
    }


    .sm-m-t-0 {
        margin-top: 0 !important;
    }

    .sm-m-r-0 {
        margin-right: 0 !important;
    }

    .sm-m-l-0 {
        margin-left: 0 !important;
    }

    .sm-m-b-0 {
        margin-bottom: 0 !important;
    }

    .sm-m-t-5 {
        margin-top: 5px !important;
    }

    .sm-m-r-5 {
        margin-right: 5px !important;
    }

    .sm-m-l-5 {
        margin-left: 5px !important;
    }

    .sm-m-b-5 {
        margin-bottom: 5px !important;
    }

    .sm-m-t-10 {
        margin-top: 10px !important;
    }

    .sm-m-r-10 {
        margin-right: 10px !important;
    }

    .sm-m-l-10 {
        margin-left: 10px !important;
    }

    .sm-m-b-10 {
        margin-bottom: 10px !important;
    }

    .sm-m-t-15 {
        margin-top: 15px !important;
    }

    .sm-m-r-15 {
        margin-right: 15px !important;
    }

    .sm-m-l-15 {
        margin-left: 15px !important;
    }

    .sm-m-b-15 {
        margin-bottom: 15px !important;
    }

    .sm-m-t-20 {
        margin-top: 20px !important;
    }

    .sm-m-r-20 {
        margin-right: 20px !important;
    }

    .sm-m-l-20 {
        margin-left: 20px !important;
    }

    .sm-m-b-20 {
        margin-bottom: 20px !important;
    }

    .sm-m-t-25 {
        margin-top: 25px !important;
    }

    .sm-m-r-25 {
        margin-right: 25px !important;
    }

    .sm-m-l-25 {
        margin-left: 25px !important;
    }

    .sm-m-b-25 {
        margin-bottom: 25px !important;
    }

    .sm-m-t-30 {
        margin-top: 30px !important;
    }

    .sm-m-r-30 {
        margin-right: 30px !important;
    }

    .sm-m-l-30 {
        margin-left: 30px !important;
    }

    .sm-m-b-30 {
        margin-bottom: 30px !important;
    }

    .sm-no-margin {
        margin: 0px !important;
    }

    .sm-no-padding {
        padding: 0px !important;
    }

    .sm-text-right {
        text-align: right !important;
    }

    .sm-text-left {
        text-align: left !important;
    }

    .sm-text-center {
        text-align: center !important;
    }

    .sm-pull-right {
        float: right !important;
    }

    .sm-pull-left {
        float: left !important;
    }

    .sm-pull-reset {
        float: none !important;
    }

    .sm-block {
        display: block;
    }

    .error-container {
        width: auto;
    }

    .sm-image-responsive-height {
        width: 100%;
        height: auto;
    }

    .email-composer {
        padding-left: 30px;
        padding-right: 30px;
    }

    .sm-padding-10 {
        padding: 10px !important;
    }

    .lock-box {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        height: auto;
    }

    .login-box {
        padding-right: 15px;
        padding-left: 15px;
    }

    .visible-xs-inline-block {
        display: inline-block !important;
    }

    .nav-tabs-linetriangle.nav-cust {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .nav-tabs-linetriangle li a.active:after,
    .nav-tabs-linetriangle li a.active:before {
        display: none;
    }

    .sm-vh-25 {
        height: 25vh;
    }

    .sm-vh-50 {
        height: 50vh;
    }

    .sm-vh-75 {
        height: 75vh;
    }

    .sm-vh-100 {
        height: 100vh;
    }

    .summernote-wrapper .btn-group {
        -ms-flex-flow: wrap;
        flex-flow: wrap;
    }
}

/*** Phone ***/
@media (max-width: 485px) {
    .ka-container {
        padding-top: 50px;
    }
}

@media (max-width: 480px) {
    body {
        width: 100%;
    }

    body .header {
        width: 100%;
        height: 48px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    }

    body .header .header-inner {
        height: 48px;
        text-align: center;
    }

    body .header .dropdown-submenu {
        top: 12px;
    }

    body #overlay-search {
        font-size: 48px;
        height: 118px;
        line-height: 46px;
    }

    .panel .panel-heading {
        padding-left: 15px;
    }

    .panel .panel-body {
        padding: 15px;
        padding-top: 0;
    }

    .register-container {
        height: auto !important;
    }

    .card .card-heading {
        padding-left: 15px;
    }

    .card .card-body {
        padding: 15px;
        /*padding-top: 0;*/
    }

    .error-page {
        padding: 15px;
    }

    .error-page .error-container {
        margin-top: 30px;
        width: auto;
    }

    .error-page .pull-bottom {
        position: relative;
    }

    .register-container {
        height: auto !important;
    }

    .error-container-innner {
        width: auto;
    }
}

/*** Retina Display **/
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 200/100), only screen and (min-device-pixel-ratio: 2) {
    .editor-icon {
        background-image: url("../img/editor_tray_2x.png");
        background-size: 480px 40px;
    }

    .alert .close {
        background: url("../img/icons/noti-cross-2x.png") no-repeat scroll 0 0 transparent;
        background-position: -9px -10px;
        width: 10px;
        height: 9px;
        position: relative;
        opacity: 0.8;
        background-size: 114px 29px;
    }
}

.hidden {
    display: none !important;
}

.visible-sm,
.visible-xs {
    display: none;
}

@media (max-width: 767px) {
    .visible-xs {
        display: block;
    }

    .hidden-xs {
        display: none;
    }
}

/* Amimate Helper */
@-webkit-keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    40%,
    43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0);
    }
}

@keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    40%,
    43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0);
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0);
    }
}

.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
}

@-webkit-keyframes flash {
    from,
    50%,
    to {
        opacity: 1;
    }

    25%,
    75% {
        opacity: 0;
    }
}

@keyframes flash {
    from,
    50%,
    to {
        opacity: 1;
    }

    25%,
    75% {
        opacity: 0;
    }
}

.flash {
    -webkit-animation-name: flash;
    animation-name: flash;
}

@-webkit-keyframes pulse {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes pulse {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse;
}

@-webkit-keyframes rubber-band {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes rubber-band {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.rubber-band {
    -webkit-animation-name: rubber-band;
    animation-name: rubber-band;
}

@-webkit-keyframes shake {
    from,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

@keyframes shake {
    from,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }

    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake;
}

@-webkit-keyframes head-shake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg);
    }

    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg);
    }

    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg);
    }

    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg);
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes head-shake {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg);
    }

    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg);
    }

    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg);
    }

    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg);
    }

    50% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

.head-shake {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-name: head-shake;
    animation-name: head-shake;
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg);
    }

    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg);
    }

    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg);
    }

    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg);
    }

    to {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg);
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg);
    }

    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg);
    }

    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg);
    }

    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg);
    }

    to {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg);
    }
}

.swing {
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing;
}

@-webkit-keyframes tada {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    10%,
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes tada {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    10%,
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    }

    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    }

    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.tada {
    -webkit-animation-name: tada;
    animation-name: tada;
}

@-webkit-keyframes wobble {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    }

    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    }

    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    }

    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    }

    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes wobble {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    }

    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    }

    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    }

    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    }

    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble;
}

@-webkit-keyframes jello {
    from,
    11.1%,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg);
    }

    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg);
    }

    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg);
    }

    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg);
    }

    66.6% {
        -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
        transform: skewX(-0.78125deg) skewY(-0.78125deg);
    }

    77.7% {
        -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
        transform: skewX(0.390625deg) skewY(0.390625deg);
    }

    88.8% {
        -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
        transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    }
}

@keyframes jello {
    from,
    11.1%,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg);
    }

    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg);
    }

    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg);
    }

    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg);
    }

    66.6% {
        -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
        transform: skewX(-0.78125deg) skewY(-0.78125deg);
    }

    77.7% {
        -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
        transform: skewX(0.390625deg) skewY(0.390625deg);
    }

    88.8% {
        -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
        transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    }
}

.jello {
    -webkit-animation-name: jello;
    animation-name: jello;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
}

@-webkit-keyframes heart-beat {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    14% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
    }

    28% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    42% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
    }

    70% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes heart-beat {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    14% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
    }

    28% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    42% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3);
    }

    70% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.heart-beat {
    -webkit-animation-name: heart-beat;
    animation-name: heart-beat;
    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
}

@-webkit-keyframes bounce-in {
    from,
    20%,
    40%,
    60%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes bounce-in {
    from,
    20%,
    40%,
    60%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.bounce-in {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounce-in;
    animation-name: bounce-in;
}

@-webkit-keyframes bounce-in-down {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0);
    }

    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes bounce-in-down {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0);
    }

    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.bounce-in-down {
    -webkit-animation-name: bounce-in-down;
    animation-name: bounce-in-down;
}

@-webkit-keyframes bounce-in-left {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0);
    }

    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }

    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes bounce-in-left {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0);
    }

    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }

    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.bounce-in-left {
    -webkit-animation-name: bounce-in-left;
    animation-name: bounce-in-left;
}

@-webkit-keyframes bounce-in-right {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    from {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0);
    }

    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }

    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes bounce-in-right {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    from {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0);
    }

    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }

    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.bounce-in-right {
    -webkit-animation-name: bounce-in-right;
    animation-name: bounce-in-right;
}

@-webkit-keyframes bounce-in-up {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }

    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes bounce-in-up {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }

    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.bounce-in-up {
    -webkit-animation-name: bounce-in-up;
    animation-name: bounce-in-up;
}

@-webkit-keyframes bounce-out {
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    50%,
    55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
}

@keyframes bounce-out {
    20% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    50%,
    55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
}

.bounce-out {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounce-out;
    animation-name: bounce-out;
}

@-webkit-keyframes bounce-out-down {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }

    40%,
    45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

@keyframes bounce-out-down {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0);
    }

    40%,
    45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

.bounce-out-down {
    -webkit-animation-name: bounce-out-down;
    animation-name: bounce-out-down;
}

@-webkit-keyframes bounce-out-left {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

@keyframes bounce-out-left {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

.bounce-out-left {
    -webkit-animation-name: bounce-out-left;
    animation-name: bounce-out-left;
}

@-webkit-keyframes bounce-out-right {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

@keyframes bounce-out-right {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

.bounce-out-right {
    -webkit-animation-name: bounce-out-right;
    animation-name: bounce-out-right;
}

@-webkit-keyframes bounce-out-up {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }

    40%,
    45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

@keyframes bounce-out-up {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0);
    }

    40%,
    45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

.bounce-out-up {
    -webkit-animation-name: bounce-out-up;
    animation-name: bounce-out-up;
}

@-webkit-keyframes fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fade-in {
    -webkit-animation-name: fade-in;
    animation-name: fade-in;
}

@-webkit-keyframes fade-in-down {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-down {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-down {
    -webkit-animation-name: fade-in-down;
    animation-name: fade-in-down;
}

@-webkit-keyframes fade-in-down-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-down-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-down-big {
    -webkit-animation-name: fade-in-down-big;
    animation-name: fade-in-down-big;
}

@-webkit-keyframes fade-in-left {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-left {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-left {
    -webkit-animation-name: fade-in-left;
    animation-name: fade-in-left;
}

@-webkit-keyframes fade-in-left-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-left-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-left-big {
    -webkit-animation-name: fade-in-left-big;
    animation-name: fade-in-left-big;
}

@-webkit-keyframes fade-in-right {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-right {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-right {
    -webkit-animation-name: fade-in-right;
    animation-name: fade-in-right;
}

@-webkit-keyframes fade-in-right-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-right-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-right-big {
    -webkit-animation-name: fade-in-right-big;
    animation-name: fade-in-right-big;
}

@-webkit-keyframes fade-in-up {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-up {
    -webkit-animation-name: fade-in-up;
    animation-name: fade-in-up;
}

@-webkit-keyframes fade-in-up-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fade-in-up-big {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fade-in-up-big {
    -webkit-animation-name: fade-in-up-big;
    animation-name: fade-in-up-big;
}

@-webkit-keyframes fade-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes fade-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.fade-out {
    -webkit-animation-name: fade-out;
    animation-name: fade-out;
}

@-webkit-keyframes fade-out-down {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

@keyframes fade-out-down {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

.fade-out-down {
    -webkit-animation-name: fade-out-down;
    animation-name: fade-out-down;
}

@-webkit-keyframes fade-out-down-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

@keyframes fade-out-down-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0);
    }
}

.fade-out-down-big {
    -webkit-animation-name: fade-out-down-big;
    animation-name: fade-out-down-big;
}

@-webkit-keyframes fade-out-left {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes fade-out-left {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.fade-out-left {
    -webkit-animation-name: fade-out-left;
    animation-name: fade-out-left;
}

@-webkit-keyframes fade-out-left-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

@keyframes fade-out-left-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0);
    }
}

.fade-out-left-big {
    -webkit-animation-name: fade-out-left-big;
    animation-name: fade-out-left-big;
}

@-webkit-keyframes fade-out-right {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

@keyframes fade-out-right {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

.fade-out-right {
    -webkit-animation-name: fade-out-right;
    animation-name: fade-out-right;
}

@-webkit-keyframes fade-out-right-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

@keyframes fade-out-right-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0);
    }
}

.fade-out-right-big {
    -webkit-animation-name: fade-out-right-big;
    animation-name: fade-out-right-big;
}

@-webkit-keyframes fade-out-up {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

@keyframes fade-out-up {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

.fade-out-up {
    -webkit-animation-name: fade-out-up;
    animation-name: fade-out-up;
}

@-webkit-keyframes fade-out-up-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

@keyframes fade-out-up-big {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0);
    }
}

.fade-out-up-big {
    -webkit-animation-name: fade-out-up-big;
    animation-name: fade-out-up-big;
}

@-webkit-keyframes flip {
    from {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    40% {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    50% {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    80% {
        -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    to {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
}

@keyframes flip {
    from {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    40% {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    50% {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    80% {
        -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    to {
        -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }
}

.animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip;
}

@-webkit-keyframes flip-in-x {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

@keyframes flip-in-x {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

.flip-in-x {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flip-in-x;
    animation-name: flip-in-x;
}

@-webkit-keyframes flip-in-y {
    from {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

@keyframes flip-in-y {
    from {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

.flip-in-y {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flip-in-y;
    animation-name: flip-in-y;
}

@-webkit-keyframes flip-out-x {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1;
    }

    to {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0;
    }
}

@keyframes flip-out-x {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1;
    }

    to {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0;
    }
}

.flip-out-x {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: flip-out-x;
    animation-name: flip-out-x;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
}

@-webkit-keyframes flip-out-y {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1;
    }

    to {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0;
    }
}

@keyframes flip-out-y {
    from {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }

    30% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1;
    }

    to {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0;
    }
}

.flip-out-y {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flip-out-y;
    animation-name: flip-out-y;
}

@-webkit-keyframes light-speed-in {
    from {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes light-speed-in {
    from {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.light-speed-in {
    -webkit-animation-name: light-speed-in;
    animation-name: light-speed-in;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}

@-webkit-keyframes light-speed-out {
    from {
        opacity: 1;
    }

    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0;
    }
}

@keyframes light-speed-out {
    from {
        opacity: 1;
    }

    to {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0;
    }
}

.light-speed-out {
    -webkit-animation-name: light-speed-out;
    animation-name: light-speed-out;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}

@-webkit-keyframes rotate-in {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, -200deg);
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

@keyframes rotate-in {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, -200deg);
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

.rotate-in {
    -webkit-animation-name: rotate-in;
    animation-name: rotate-in;
}

@-webkit-keyframes rotate-in-down-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

@keyframes rotate-in-down-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

.rotate-in-down-left {
    -webkit-animation-name: rotate-in-down-left;
    animation-name: rotate-in-down-left;
}

@-webkit-keyframes rotate-in-down-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

@keyframes rotate-in-down-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

.rotate-in-down-right {
    -webkit-animation-name: rotate-in-down-right;
    animation-name: rotate-in-down-right;
}

@-webkit-keyframes rotate-in-up-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

@keyframes rotate-in-up-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

.rotate-in-up-left {
    -webkit-animation-name: rotate-in-up-left;
    animation-name: rotate-in-up-left;
}

@-webkit-keyframes rotate-in-up-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -90deg);
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

@keyframes rotate-in-up-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -90deg);
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

.rotate-in-up-right {
    -webkit-animation-name: rotate-in-up-right;
    animation-name: rotate-in-up-right;
}

@-webkit-keyframes rotate-out {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, 200deg);
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0;
    }
}

@keyframes rotate-out {
    from {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, 200deg);
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0;
    }
}

.rotate-out {
    -webkit-animation-name: rotate-out;
    animation-name: rotate-out;
}

@-webkit-keyframes rotate-out-down-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
}

@keyframes rotate-out-down-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0;
    }
}

.rotate-out-down-left {
    -webkit-animation-name: rotate-out-down-left;
    animation-name: rotate-out-down-left;
}

@-webkit-keyframes rotate-out-down-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

@keyframes rotate-out-down-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

.rotate-out-down-right {
    -webkit-animation-name: rotate-out-down-right;
    animation-name: rotate-out-down-right;
}

@-webkit-keyframes rotate-out-up-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

@keyframes rotate-out-up-left {
    from {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0;
    }
}

.rotate-out-up-left {
    -webkit-animation-name: rotate-out-up-left;
    animation-name: rotate-out-up-left;
}

@-webkit-keyframes rotate-out-up-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 90deg);
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0;
    }
}

@keyframes rotate-out-up-right {
    from {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1;
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 90deg);
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0;
    }
}

.rotate-out-up-right {
    -webkit-animation-name: rotate-out-up-right;
    animation-name: rotate-out-up-right;
}

@-webkit-keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }

    20%,
    60% {
        -webkit-transform: rotate3d(0, 0, 1, 80deg);
        transform: rotate3d(0, 0, 1, 80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }

    40%,
    80% {
        -webkit-transform: rotate3d(0, 0, 1, 60deg);
        transform: rotate3d(0, 0, 1, 60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1;
    }

    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0;
    }
}

@keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }

    20%,
    60% {
        -webkit-transform: rotate3d(0, 0, 1, 80deg);
        transform: rotate3d(0, 0, 1, 80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
    }

    40%,
    80% {
        -webkit-transform: rotate3d(0, 0, 1, 60deg);
        transform: rotate3d(0, 0, 1, 60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1;
    }

    to {
        -webkit-transform: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0;
    }
}

.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-name: hinge;
    animation-name: hinge;
}

@-webkit-keyframes jack-in-the-box {
    from {
        opacity: 0;
        -webkit-transform: scale(0.1) rotate(30deg);
        transform: scale(0.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg);
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes jack-in-the-box {
    from {
        opacity: 0;
        -webkit-transform: scale(0.1) rotate(30deg);
        transform: scale(0.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }

    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg);
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.jack-in-the-box {
    -webkit-animation-name: jack-in-the-box;
    animation-name: jack-in-the-box;
}

@-webkit-keyframes roll-in {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes roll-in {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.roll-in {
    -webkit-animation-name: roll-in;
    animation-name: roll-in;
}

@-webkit-keyframes roll-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    }
}

@keyframes roll-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    }
}

.roll-out {
    -webkit-animation-name: roll-out;
    animation-name: roll-out;
}

@-webkit-keyframes zoom-in {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

@keyframes zoom-in {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

.zoom-in {
    -webkit-animation-name: zoom-in;
    animation-name: zoom-in;
}

@-webkit-keyframes zoom-in-down {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoom-in-down {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoom-in-down {
    -webkit-animation-name: zoom-in-down;
    animation-name: zoom-in-down;
}

@-webkit-keyframes zoom-in-left {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoom-in-left {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoom-in-left {
    -webkit-animation-name: zoom-in-left;
    animation-name: zoom-in-left;
}

@-webkit-keyframes zoom-in-right {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoom-in-right {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoom-in-right {
    -webkit-animation-name: zoom-in-right;
    animation-name: zoom-in-right;
}

@-webkit-keyframes zoom-in-up {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoom-in-up {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoom-in-up {
    -webkit-animation-name: zoom-in-up;
    animation-name: zoom-in-up;
}

@-webkit-keyframes zoom-out {
    from {
        opacity: 1;
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    to {
        opacity: 0;
    }
}

@keyframes zoom-out {
    from {
        opacity: 1;
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    to {
        opacity: 0;
    }
}

.zoom-out {
    -webkit-animation-name: zoom-out;
    animation-name: zoom-out;
}

@-webkit-keyframes zoom-out-down {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoom-out-down {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoom-out-down {
    -webkit-animation-name: zoom-out-down;
    animation-name: zoom-out-down;
}

@-webkit-keyframes zoom-out-left {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
        transform: scale(0.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center;
    }
}

@keyframes zoom-out-left {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
        transform: scale(0.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center;
    }
}

.zoom-out-left {
    -webkit-animation-name: zoom-out-left;
    animation-name: zoom-out-left;
}

@-webkit-keyframes zoom-out-right {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
        transform: scale(0.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center;
    }
}

@keyframes zoom-out-right {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    }

    to {
        opacity: 0;
        -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
        transform: scale(0.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center;
    }
}

.zoom-out-right {
    -webkit-animation-name: zoom-out-right;
    animation-name: zoom-out-right;
}

@-webkit-keyframes zoom-out-up {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

@keyframes zoom-out-up {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
}

.zoom-out-up {
    -webkit-animation-name: zoom-out-up;
    animation-name: zoom-out-up;
}

@-webkit-keyframes slide-in-down {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slide-in-down {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slide-in-down {
    -webkit-animation-name: slide-in-down;
    animation-name: slide-in-down;
}

@-webkit-keyframes slide-in-left {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slide-in-left {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slide-in-left {
    -webkit-animation-name: slide-in-left;
    animation-name: slide-in-left;
}

@-webkit-keyframes slide-in-right {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slide-in-right {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slide-in-right {
    -webkit-animation-name: slide-in-right;
    animation-name: slide-in-right;
}

@-webkit-keyframes slide-in-up {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slide-in-up {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slide-in-up {
    -webkit-animation-name: slide-in-up;
    animation-name: slide-in-up;
}

@-webkit-keyframes slide-out-down {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

@keyframes slide-out-down {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

.slide-out-down {
    -webkit-animation-name: slide-out-down;
    animation-name: slide-out-down;
}

@-webkit-keyframes slide-out-left {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes slide-out-left {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.slide-out-left {
    -webkit-animation-name: slide-out-left;
    animation-name: slide-out-left;
}

@-webkit-keyframes slide-out-right {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

@keyframes slide-out-right {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

.slide-out-right {
    -webkit-animation-name: slide-out-right;
    animation-name: slide-out-right;
}

@-webkit-keyframes slide-out-up {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

@keyframes slide-out-up {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

.slide-out-up {
    -webkit-animation-name: slide-out-up;
    animation-name: slide-out-up;
}

.animated-holder,
.animated-bg-holder {
    display: none;
}

.animated {
    display: block;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.animated.delay-500ms {
    -webkit-animation-delay: 500ms;
    animation-delay: 500ms;
}

.animated.delay-1500ms {
    -webkit-animation-delay: 1500ms;
    animation-delay: 1500ms;
}

.animated.delay-2500ms {
    -webkit-animation-delay: 2500ms;
    animation-delay: 2500ms;
}

.animated.delay-3500ms {
    -webkit-animation-delay: 3500ms;
    animation-delay: 3500ms;
}

.animated.delay-4500ms {
    -webkit-animation-delay: 4500ms;
    animation-delay: 4500ms;
}

.animated.delay-500ms {
    -webkit-animation-delay: 500ms;
    animation-delay: 500ms;
}


.animated.delay-1s,
.animated.delay-1000ms {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.animated.delay-2s,
.animated.delay-2000ms {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}

.animated.delay-3s,
.animated.delay-3000ms {
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
}

.animated.delay-4s,
.animated.delay-4000ms {
    -webkit-animation-delay: 4s;
    animation-delay: 4s;
}

.animated.delay-5s,
.animated.delay-5000ms {
    -webkit-animation-delay: 5s;
    animation-delay: 5s;
}

.animated.fast {
    -webkit-animation-duration: 500ms;
    animation-duration: 500ms;
}

.animated.faster {
    -webkit-animation-duration: 300ms;
    animation-duration: 300ms;
}

.animated.slow {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
}

.animated.slower {
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
}

@media (print), (prefers-reduced-motion: reduce) {
    .animated {
        display: block;
        -webkit-animation-duration: 1ms !important;
        animation-duration: 1ms !important;
        -webkit-transition-duration: 1ms !important;
        -o-transition-duration: 1ms !important;
        transition-duration: 1ms !important;
        -webkit-animation-iteration-count: 1 !important;
        animation-iteration-count: 1 !important;
    }
}


/* Floating Side Menu */
.floating-menu {
    visibility: hidden;
}

.floating-menu.fm-ready {
    visibility: visible;
}

.floating-menu a {
    cursor: pointer;
    text-decoration: none;
}

.floating-menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.fm-bar {
    position: fixed;
    z-index: 10100;
}

.fm-bar.fm-side-space {
    margin: 2px;
}

.fm-round.fm-side-space {
    margin: 3px;
}

.fm-rounded.fm-side-space {
    margin: 3px;
}

.fm-bar li {
    list-style: none;
}

.fm-bar li:hover {
    z-index: 1001 !important;
}

.fm-bar.fm-right li {
    height: 38px;
}

.fm-bar.fm-button-space li:not(:last-child) {
    margin-bottom: 2px;
}

.fm-round li {
    border-radius: 21px;
}

.fm-round.fm-button-space li:not(:last-child) {
    margin-bottom: 3px;
}

.fm-rounded li,
.fm-rounded li img {
    border-radius: 5px;
}

.fm-rounded.fm-button-space li:not(:last-child) {
    margin-bottom: 3px;
}

.fm-rounded-out li,
.fm-rounded-out img {
    border-radius: 0 5px 5px 0;
}

.fm-space {
    margin-top: 4px;
}

.fm-button-space .fm-space {
    margin-top: 6px;
}

.fm-round.fm-button-space .fm-space {
    margin-top: 7px;
}

.fm-rounded.fm-button-space .fm-space {
    margin-top: 7px;
}

.fm-mask {
    position: relative;
    overflow: hidden;
    z-index: 12;
}

.fm-mask.fm-off {
    overflow: visible;
}

.fm-right .fm-mask {
    position: absolute;
    right: 0;
    height: 38px;
}

.fm-round .fm-mask {
    border-radius: 21px;
}

.fm-rounded .fm-mask, .fm-rounded .fm-mask img {
    border-radius: 5px;
}

.fm-rounded-out .fm-mask {
}

.fm-bar a {
    width: 38px;
    display: block;
    position: relative;
}

.fm-bar.fm-right a {
    position: absolute;
    right: 0;
}

.fm-round a {
    border-radius: 21px;
}

.fm-rounded a {
    border-radius: 5px;
}

.fm-rounded-out a {
    border-radius: 0 5px 5px 0;
}

.fm-right.fm-rounded-out a {
    border-radius: 5px 0 0 5px;
}

.fm-icon {
    /*height: 100%;*/
    width: 38px;
    height: 38px;
    line-height: 38px;
    position: relative;
    z-index: 11;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    background-repeat: no-repeat;
    font-size: 14px;
}

.fm-right .fm-icon {
    position: absolute;
    right: 0;
}

.fm-round .fm-icon {
    border-radius: 21px;
}

.fm-rounded .fm-icon {
    border-radius: 5px;
}

.fm-rounded-out .fm-icon {
    border-radius: 0 5px 5px 0;
}

.fm-right.fm-rounded-out .fm-icon {
    border-radius: 5px 0 0 5px;
}

.fm-icon img {
    position: absolute;
    width: 40%;
    height: 40%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

​.fm-icon .fa {
    line-height: 38px !important;
}

.fm-label {
    display: none;
    position: absolute;
    left: 38px;
    top: 0;
    z-index: 10;
    font-size: 12px;
    font-weight: 700;
    line-height: 38px;
    padding: 0 11px 0 8px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
    text-transform: uppercase;
}

.fm-right .fm-label {
    padding: 0 8px 0 11px;
    right: 38px;
    left: auto;
}

.fm-label-space .fm-label {
    margin-left: 2px;
}

.fm-right.fm-label-space .fm-label {
    margin-right: 2px;
    margin-left: 0;
}

.fm-round .fm-label {
    border-radius: 21px;
    padding: 0 12px;
}

.fm-rounded .fm-label {
    border-radius: 5px;
    padding: 0 11px;
}

.fm-rounded-out .fm-label {
    border-radius: 5px;
    padding: 0 11px;
}

.fm-connected .fm-label {
    left: 0;
}

.fm-right.fm-connected .fm-label {
    right: 0;
    left: auto;
}

.fm-hit {
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: none;
    height: 38px;
}

.fm-label-space .fm-hit {
    width: 2px;
    left: 38px;
}

.fm-right.fm-label-space .fm-hit {
    right: 38px;
    left: auto;
}

.fm-round .fm-hit {
    width: 38px;
    left: 19px;
}

.fm-right.fm-round .fm-hit {
    right: 19px;
    left: auto;
}

.fm-round.fm-label-space .fm-hit {
    width: 40px;
}

.fm-right.fm-round.fm-label-space .fm-hit {
}

.fm-rounded .fm-hit {
    width: 10px;
    left: 35px;
}

.fm-right.fm-rounded .fm-hit {
    right: 35px;
    left: auto;
}

.fm-rounded.fm-label-space .fm-hit {
    width: 12px;
}

.fm-right.fm-rounded.fm-label-space .fm-hit {
}

.fm-rounded-out .fm-hit {
    width: 10px;
    left: 35px;
}

.fm-right.fm-rounded-out .fm-hit {
    right: 35px;
    left: auto;
}

.fm-rounded-out.fm-label-space .fm-hit {
    width: 12px;
}

.fm-right.fm-rounded-out.fm-label-space .fm-hit {
}

.fm-sub {
    cursor: pointer;
}

.fm-sub > .fm-icon {
    position: relative;
    z-index: 1000;
}

.fm-sub > ul {
    width: 38px;
    position: absolute;
    left: 0;
    top: 38px;
}

.fm-sub.fm-side > ul {
    position: absolute;
    left: 38px;
    top: 0;
}

.fm-right .fm-sub.fm-side > ul {
    right: 38px;
    left: auto;
}

.fm-sub.fm-circular > ul {
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
}

.fm-right .fm-sub.fm-circular > ul {
    right: 0;
    left: auto;
    margin: auto 0;
}

.fm-sub.fm-sub-space > ul {
    margin-top: 2px;
}

.fm-sub.fm-side.fm-sub-space > ul {
    margin: 0 2px;
    margin-top: 0;
}

.fm-round .fm-sub.fm-sub-space > ul,
.fm-rounded .fm-sub.fm-sub-space > ul {
    margin-top: 3px;
}

.fm-round .fm-sub.fm-side.fm-sub-space > ul,
.fm-rounded .fm-sub.fm-side.fm-sub-space > ul {
    margin: 0 3px;
    margin-top: 0;
}

.fm-sub.fm-posabs > ul > li {
    position: absolute;
}

.fm-right .fm-sub.fm-posabs > ul > li {
    right: 0;
}

.fm-subhit {
    position: absolute;
    display: none;
    left: 0;
    top: 0;
}

.fm-right .fm-subhit {
    right: 0;
    left: auto;
}

.fm-naver-blog .fm-icon,
.fm-naver-blog a:hover .fm-icon,
.fm-naver-blog .fm-label {
    color: #ffffff;
    background-color: #23b300;
}

.fm-naver-post .fm-icon,
.fm-naver-post a:hover .fm-icon,
.fm-naver-post .fm-label {
    color: #ffffff;
    background-color: #23b300;
}

.fm-kakao-channel .fm-icon,
.fm-kakao-channel a:hover .fm-icon,
.fm-kakao-channel .fm-label {
    color: #3c2222;
    background-color: #ffcd00;
}

.fm-kakao-talk .fm-icon,
.fm-kakao-talk a:hover .fm-icon,
.fm-kakao-talk .fm-label {
    color: #3c2222;
    background-color: #ffcd00;
}

.fm-facebook .fm-icon,
.fm-facebook a:hover .fm-icon,
.fm-facebook .fm-label {
    color: #ffffff;
    background-color: #3b5998;
}

.fm-twitter .fm-icon,
.fm-twitter a:hover .fm-icon,
.fm-twitter .fm-label {
    color: #ffffff;
    background-color: #55acee;
}

.fm-googleplus .fm-icon,
.fm-googleplus a:hover .fm-icon,
.fm-googleplus .fm-label {
    color: #ffffff;
    background-color: #dd4b39;
}

.fm-instagram .fm-icon,
.fm-instagram a:hover .fm-icon,
.fm-instagram .fm-label {
    color: #ffffff;
    background-color: #3f729b;
}

.fm-youtube .fm-icon,
.fm-youtube a:hover .fm-icon,
.fm-youtube .fm-label {
    color: #ffffff;
    background-color: #cd201f;
}

.fm-wish-list .fm-icon,
.fm-wish-list a:hover .fm-icon,
.fm-wish-list .fm-label {
    color: #ffffff;
    background-color: #F47104;
}

.fm-history .fm-icon,
.fm-history a:hover .fm-icon,
.fm-history .fm-label {
    color: #ffffff;
    background-color: #ff8800;
}


.fm-contact .fm-icon,
.fm-contact a:hover .fm-icon,
.fm-contact .fm-label {
    color: #000;
    background-color: #ffbb33;
}

.fm-scroll-top {
    background-color: rgba(247, 248, 251, 0.5);
}

.fm-scroll-top .fm-icon,
.fm-scroll-top .fm-label {
    color: #000;
    opacity: .5;
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;

}

.fm-scroll-top a:hover .fm-icon,
.fm-scroll-top a:hover .fm-label {
    opacity: 1;
}


.fm-social > .fm-icon,
.fm-social:hover > .fm-icon {
    color: #ffffff;
    background-color: #1d8edf;
}

.fm-black .fm-icon {
    background-color: #2a2a2a;
}

.fm-black-over a:hover .fm-icon,
.fm-black-over .fm-label,
.fm-black-over .fm-social:hover > .fm-icon {
    background-color: #2a2a2a;
}

.fm-blue .fm-icon {
    background-color: #4090FF;
}

.fm-blue-over a:hover .fm-icon,
.fm-blue-over .fm-label,
.fm-blue-over .fm-social:hover > .fm-icon {
    background-color: #4090FF;
}

.fm-red .fm-icon {
    background-color: #F23D3D;
}

.fm-red-over a:hover .fm-icon,
.fm-red-over .fm-label,
.fm-red-over .fm-social:hover > .fm-icon {
    background-color: #F23D3D;
}

.fm-yellow .fm-icon {
    background-color: #FFBD22;
}

.fm-yellow-over a:hover .fm-icon,
.fm-yellow-over .fm-label,
.fm-yellow-over .fm-social:hover > .fm-icon {
    background-color: #FFBD22;
}

.fm-icon {
    -webkit-transition: background-color 100ms linear;
    -o-transition: background-color 100ms linear;
    transition: background-color 100ms linear;
}

.fm-show {
    display: block !important;
}

.fm-hide {
    display: none !important;
}

.fm-clearfix:after {
    content: "";
    display: table;
    clear: both;
}


.fm-connected .fm-label {
    padding: 0 11px 0 46px;
}

.fm-right.fm-connected .fm-label {
    padding: 0 46px 0 11px;
}

.fm-connected.fm-round .fm-label {
    padding: 0 15px 0 37px;
}

.fm-right.fm-connected.fm-round .fm-label {
    padding: 0 37px 0 15px;
}


/* Modal Animated Icons */
.modal-alert {
    margin: 0;
    padding: 0;
}

.modal-alert .modal-icon {
    border-radius: 50%;
    border: 4px solid gray;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 80px;
    margin: 20px auto;
    padding: 0;
    position: relative;
    width: 80px;
}

.modal-alert .modal-icon.modal-success,
.modal-alert .modal-icon.modal-error {
    border-color: #A5DC86;
}

.modal-alert .modal-icon.modal-success:after,
.modal-alert .modal-icon.modal-success:before,
.modal-alert .modal-icon.modal-error:after,
.modal-alert .modal-icon.modal-error:before {
    background: #fff;
    content: '';
    height: 120px;
    position: absolute;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 60px;
}

.modal-alert .modal-icon.modal-success:before,
.modal-alert .modal-icon.modal-error:before {
    border-radius: 120px 0 0 120px;
    left: -33px;
    top: -7px;
    -webkit-transform-origin: 60px 60px;
    -ms-transform-origin: 60px 60px;
    transform-origin: 60px 60px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.modal-alert .modal-icon.modal-success:after,
.modal-alert .modal-icon.modal-error:after {
    border-radius: 0 120px 120px 0;
    left: 30px;
    top: -11px;
    -webkit-transform-origin: 0 60px;
    -ms-transform-origin: 0 60px;
    transform-origin: 0 60px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.modal-alert .modal-icon.modal-success .modal-placeholder,
.modal-alert .modal-icon.modal-error .modal-placeholder {
    border-radius: 50%;
    border: 4px solid rgba(165, 220, 134, 0.2);
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 80px;
    left: -4px;
    position: absolute;
    top: -4px;
    width: 80px;
    z-index: 2;
}

.modal-alert .modal-icon.modal-success .modal-fix,
.modal-alert .modal-icon.modal-error .modal-fix {
    background-color: #fff;
    height: 90px;
    left: 28px;
    position: absolute;
    top: 8px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 5px;
    z-index: 1;
}

.modal-alert .modal-icon.modal-success .modal-line,
.modal-alert .modal-icon.modal-error .modal-line {
    background-color: #A5DC86;
    border-radius: 2px;
    display: block;
    height: 5px;
    position: absolute;
    z-index: 2;
}

.modal-alert .modal-icon.modal-success .modal-line.modal-tip,
.modal-alert .modal-icon.modal-error .modal-line.modal-tip {
    left: 14px;
    top: 46px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 25px;
}

.modal-alert .modal-icon.modal-success .modal-line.modal-long,
.modal-alert .modal-icon.modal-error .modal-line.modal-long {
    right: 8px;
    top: 38px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 47px;
}

.modal-alert .modal-icon.modal-error {
    border-color: #F27474;
}

.modal-alert .modal-icon.modal-error .modal-x-mark {
    display: block;
    position: relative;
    z-index: 2;
}

.modal-alert .modal-icon.modal-error .modal-placeholder {
    border: 4px solid rgba(200, 0, 0, 0.2);
}

.modal-alert .modal-icon.modal-error .modal-line {
    background-color: #F27474;
    top: 37px;
    width: 47px;
}

.modal-alert .modal-icon.modal-error .modal-line.modal-left {
    left: 17px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.modal-alert .modal-icon.modal-error .modal-line.modal-right {
    right: 16px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.modal-alert .modal-icon.modal-warning {
    border-color: #F8BB86;
}

.modal-alert .modal-icon.modal-warning:before {
    -webkit-animation: pulseWarning 2s linear infinite;
    animation: pulseWarning 2s linear infinite;
    background-color: #fff;
    border-radius: 50%;
    content: "";
    display: inline-block;
    height: 100%;
    opacity: 0;
    position: absolute;
    width: 100%;
}

.modal-alert .modal-icon.modal-warning:after {
    background-color: #fff;
    border-radius: 50%;
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 1;
}

.modal-alert .modal-icon.modal-warning .modal-line {
    background-color: #F8BB86;
    border-radius: 2px;
    height: 47px;
    left: 50%;
    margin-left: -2px;
    position: absolute;
    top: 10px;
    width: 5px;
    z-index: 2;
}

.modal-alert .modal-icon.modal-warning .modal-dot {
    background-color: #F8BB86;
    border-radius: 50%;
    bottom: 10px;
    height: 7px;
    left: 50%;
    margin-left: -3px;
    position: absolute;
    width: 7px;
    z-index: 2;
}

.modal-alert .modal-icon + .modal-icon {
    margin-top: 50px;
}

.animateSuccessTip {
    -webkit-animation: animateSuccessTip .75s;
    animation: animateSuccessTip .75s;
}

.animateSuccessLong {
    -webkit-animation: animateSuccessLong .75s;
    animation: animateSuccessLong .75s;
}

.modal-icon.modal-success.animate:after {
    -webkit-animation: rotatePlaceholder 4.25s ease-in;
    animation: rotatePlaceholder 4.25s ease-in;
}

.modal-icon.modal-error.animate:after {
    -webkit-animation: rotatePlaceholder 4.25s ease-in;
    animation: rotatePlaceholder 4.25s ease-in;
}

.animateErrorIcon {
    -webkit-animation: animateErrorIcon .5s;
    animation: animateErrorIcon .5s;
}

.animateXLeft {
    -webkit-animation: animateXLeft .75s;
    animation: animateXLeft .75s;
}

.animateXRight {
    -webkit-animation: animateXRight .75s;
    animation: animateXRight .75s;
}

.scaleWarning {
    -webkit-animation: scaleWarning 0.75s infinite alternate;
    animation: scaleWarning 0.75s infinite alternate;
}

.pulseWarningIns {
    -webkit-animation: pulseWarningIns 0.75s infinite alternate;
    animation: pulseWarningIns 0.75s infinite alternate;
}

@-webkit-keyframes animateSuccessTip {
    0%, 54% {
        width: 0;
        left: 1px;
        top: 19px;
    }
    70% {
        width: 50px;
        left: -8px;
        top: 37px;
    }
    84% {
        width: 17px;
        left: 21px;
        top: 48px;
    }
    100% {
        width: 25px;
        left: 14px;
        top: 45px;
    }
}

@keyframes animateSuccessTip {
    0%, 54% {
        width: 0;
        left: 1px;
        top: 19px;
    }
    70% {
        width: 50px;
        left: -8px;
        top: 37px;
    }
    84% {
        width: 17px;
        left: 21px;
        top: 48px;
    }
    100% {
        width: 25px;
        left: 14px;
        top: 45px;
    }
}

@-webkit-keyframes animateSuccessLong {
    0%, 65% {
        width: 0;
        right: 46px;
        top: 54px;
    }
    84% {
        width: 55px;
        right: 0;
        top: 35px;
    }
    100% {
        width: 47px;
        right: 8px;
        top: 38px;
    }
}

@keyframes animateSuccessLong {
    0%, 65% {
        width: 0;
        right: 46px;
        top: 54px;
    }
    84% {
        width: 55px;
        right: 0;
        top: 35px;
    }
    100% {
        width: 47px;
        right: 8px;
        top: 38px;
    }
}

@-webkit-keyframes rotatePlaceholder {
    0%, 5% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    100%, 12% {
        -webkit-transform: rotate(-405deg);
        transform: rotate(-405deg);
    }
}

@keyframes rotatePlaceholder {
    0%, 5% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    100%, 12% {
        -webkit-transform: rotate(-405deg);
        transform: rotate(-405deg);
    }
}

@-webkit-keyframes animateErrorIcon {
    0% {
        -webkit-transform: rotateX(100deg);
        transform: rotateX(100deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: rotateX(0deg);
        transform: rotateX(0deg);
        opacity: 1;
    }
}

@keyframes animateErrorIcon {
    0% {
        -webkit-transform: rotateX(100deg);
        transform: rotateX(100deg);
        opacity: 0;
    }
    100% {
        -webkit-transform: rotateX(0deg);
        transform: rotateX(0deg);
        opacity: 1;
    }
}

@-webkit-keyframes animateXLeft {
    0%,
    65% {
        left: 82px;
        top: 95px;
        width: 0;
    }
    84% {
        left: 14px;
        top: 33px;
        width: 47px;
    }
    100% {
        left: 17px;
        top: 37px;
        width: 47px;
    }
}

@keyframes animateXLeft {
    0%,
    65% {
        left: 82px;
        top: 95px;
        width: 0;
    }
    84% {
        left: 14px;
        top: 33px;
        width: 47px;
    }
    100% {
        left: 17px;
        top: 37px;
        width: 47px;
    }
}

@-webkit-keyframes animateXRight {
    0%,
    65% {
        right: 82px;
        top: 95px;
        width: 0;
    }
    84% {
        right: 14px;
        top: 33px;
        width: 47px;
    }
    100% {
        right: 16px;
        top: 37px;
        width: 47px;
    }
}

@keyframes animateXRight {
    0%,
    65% {
        right: 82px;
        top: 95px;
        width: 0;
    }
    84% {
        right: 14px;
        top: 33px;
        width: 47px;
    }
    100% {
        right: 16px;
        top: 37px;
        width: 47px;
    }
}

@-webkit-keyframes scaleWarning {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    30% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes scaleWarning {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    30% {
        -webkit-transform: scale(1.02);
        transform: scale(1.02);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-webkit-keyframes pulseWarning {
    0% {
        background-color: #fff;
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.5;
    }
    30% {
        background-color: #fff;
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.5;
    }
    100% {
        background-color: #F8BB86;
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0;
    }
}

@keyframes pulseWarning {
    0% {
        background-color: #fff;
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.5;
    }
    30% {
        background-color: #fff;
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0.5;
    }
    100% {
        background-color: #F8BB86;
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0;
    }
}

@-webkit-keyframes pulseWarningIns {
    0% {
        background-color: #F8D486;
    }
    100% {
        background-color: #F8BB86;
    }
}

@keyframes pulseWarningIns {
    0% {
        background-color: #F8D486;
    }
    100% {
        background-color: #F8BB86;
    }
}


/* Common */
.overlay-box {
    width: 100%;
    height: 100%;
    font-size: 14px;
    line-height: 16px;
    padding: 30px;
}

.overlay-box.heading {
    padding: 1px 10px;
}

.overlay-box.black {
    color: #fff;
    background-color: rgba(0, 0, 0, 0.5);
}

.overlay-box.black-solid {
    color: #fff;
    background-color: rgba(0, 0, 0, 0.9);
}

.overlay-box.black h1,
.overlay-box.black h2,
.overlay-box.black h3,
.overlay-box.black h4,
.overlay-box.black h5 {
    color: #fff;
}

.overlay-box.white {
    /*color: #000;*/
    background-color: rgba(255, 255, 255, 0.5);
}

.overlay-box.white-solid {
    /*color: #000;*/
    background-color: rgba(255, 255, 255, 0.9);
}

.overlay-box.white h1,
.overlay-box.white h2,
.overlay-box.white h3,
.overlay-box.white h4,
.overlay-box.white h5 {
    /*color: #000;*/
}

.data-table {
    width: 100%;
}

.more i {
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.more i:hover {
    color: #F47104;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}


.link-block a {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, rgba(144, 159, 179, 0.2)));
    background-image: -o-linear-gradient(left, transparent 50%, rgba(144, 159, 179, 0.2) 50%);
    background-image: linear-gradient(to right, transparent 50%, rgba(144, 159, 179, 0.2) 50%);
    background-position: 0;
    background-size: 200%;
    -webkit-transition: all 0.3s !important;
    -o-transition: all 0.3s !important;
    transition: all 0.3s !important;
}

.link-block a:hover {
    color: #000 !important;
    background-position: -100% !important;
}

@media screen and (max-width: 479px) {
    .ka-container .ka-content-wrapper .content {
        padding-bottom: 250px;
    }
}


/* Main */
.notice h4, .notice h5, .notice p {
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.info-wrap {
    display: block;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 50px 0 0 55px;
    width: 100%;
    height: inherit;
    overflow: hidden;
}

.info-wrap-1 {
    min-height: 280px;
    background-image: url('../img/bg/bg_main_info_1.jpg');
}

.info-wrap-2 {
    min-height: 220px;
    background-image: url('../img/bg/bg_main_info_2.jpg');
}

.info-wrap-3 {
    min-height: 220px;
    background-image: url('../img/bg/bg_main_info_3.jpg');
}

.info-overlay {
    display: block;
    position: absolute;
    top: 10%;
    left: 10%;
}


.swiper-container {
    width: 100%;
    max-height: 600px;
    letter-spacing: -0.06em;
    text-align: left;
}

.swiper-container .swiper-slide {
    position: relative;
    width: 100%;
    height: inherit;
    font-size: 18px;
    letter-spacing: -0.06em;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden !important;

    background-position: center center;
    background-repeat: no-repeat;

    /* 2020.06.29 :: cover -> contain */
    /*background-size: cover;*/
    background-size: contain;
    background-color: #fff;

    width: 100%;
    height: auto;
    min-height: 600px;
}

.swiper-container h1 {
    font-weight: 100;
    margin: -10px 0 20px;
    color: #fff !important;
}

.swiper-container h4,
.swiper-container h5 {
    margin: 0;
    font-weight: 500;
    color: #fff !important;
}

.swiper-container img.bg-image {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: auto;
    min-height: 200px;
    overflow: hidden !important;
}

.swiper-container.swiper-container-outer .swiper-slide .information {
    display: none;
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);

    /* 2020.06.29 :: left 12 -> 15 */
    /*left: 12%;*/
    left: 20%;

    width: 32%;
    background-color: rgba(0, 0, 0, 0.3);
    padding: 20px;
    color: #fff !important;
}

.swiper-container.swiper-container-outer .swiper-slide .information.w100 {
    /* 2020.06.29 :: left 주석 처리 */
    /*left: 10%;*/
    width: 80%;
}

.swiper-container.swiper-container-outer .swiper-slide .animated-holder {

}

.swiper-container.swiper-container-inner {
    position: absolute;
    left: 45%;
    top: 0;
    width: 50%;
}

.swiper-container.swiper-container-inner .swiper-slide img {
    display: block;
    width: 10em;
}

.swiper-container.swiper-container-inner .swiper-slide .description {
    width: 10em;
    margin: 50px 0 0 20px;
    color: #fff;
}

@media screen and (max-width: 767px) {
    .swiper-container {
        width: 100%;
        max-height: 500px;
    }

    .swiper-container .swiper-slide {
        min-height: 500px;
    }

    .swiper-container.swiper-container-outer .swiper-slide .information,
    .swiper-container.swiper-container-outer .swiper-slide .information.w100 {
        left: 5%;
        width: 90%;
    }

    .swiper-button-next,
    .swiper-button-prev,
    .swiper-container.swiper-container-inner {
        display: none;
    }
}

@media screen and (max-width: 479px) {
    .info-wrap-1 {
        min-height: 260px;
        max-height: 300px;
    }

    .info-wrap-2,
    .info-wrap-3 {
        max-height: 200px;
    }
}

.main-grid {
    text-align: center;
}

.main-grid .controls {
    padding: 10px;
}

.main-grid .control {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.main-grid .mix-container {
    padding: 1rem;
    text-align: justify;
    font-size: 0.1px;
}

.main-grid .mix-container:after {
    content: '';
    display: inline-block;
    width: 100%;
}

.main-grid .mix,
.main-grid .gap {
    display: inline-block;
    vertical-align: top;
}

.main-grid .mix {
    margin-bottom: 1rem;
    position: relative;
    background-color: transparent;
}

.main-grid .mix:before {
    content: '';
    display: inline-block;
    padding-top: 56.25%;
}

.main-grid .mix,
.main-grid .gap {
    width: calc(100% / 2 - (((2 - 1) * 1rem) / 2));
}

.main-grid .mix {
    overflow: hidden;
    background: #000;
}

.main-grid .mix img {
    display: block;
    width: 100%;
    -webkit-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}

.main-grid .mix:hover img {
    opacity: 0.3;
}

.main-grid .mix::after,
.main-grid .mix::before {
    position: absolute;
    width: 100%;
    color: #fff;
    z-index: 1;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    -o-transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.main-grid .mix::after {
    top: 0;
    left: 0;
    height: 70%;
    content: attr(data-artist);
    white-space: pre-wrap;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.06em;
    line-height: 20px;
    color: #fff;
    padding: 13px 20px;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
}

.main-grid .mix::before {
    top: 70%;
    height: 30%;
    content: attr(data-price);
    white-space: pre-wrap;
    display: inline-block;
    background: #f27545;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.06em;
    line-height: 16px;
    padding: 12px 20px;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
}

.main-grid .mix:hover::after,
.main-grid .mix:hover::before {
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%);
}

@media screen and (max-width: 767.98px) {
    .main-grid .mix,
    .main-grid .gap {
        width: calc(100% / 3 - (((3 - 1) * 1rem) / 3));
    }
}

@media screen and (min-width: 768px) and (max-width: 960.98px) {
    .main-grid .mix,
    .main-grid .gap {
        width: calc(100% / 4 - (((4 - 1) * 1rem) / 4));
    }
}

@media screen and (min-width: 961px) and (max-width: 991.98px) {
    .main-grid .mix,
    .main-grid .gap {
        width: calc(100% / 4 - (((4 - 1) * 1rem) / 4));
    }
}

@media screen and (min-width: 992px) {
    .main-grid .mix,
    .main-grid .gap {
        width: calc(100% / 5 - (((5 - 1) * 1rem) / 5));
    }
}

@media screen and (max-width: 1199.98px) {
    .main-grid .mix::after {
        font-size: 14px;
        line-height: 18px;
        padding: 13px 20px;
    }

    .main-grid .mix::before {
        font-size: 12px;
        line-height: 14px;
        padding: 6px 20px;
    }
}

@media screen and (min-width: 992px) and (max-width: 1199.98px) {
    .main-grid .mix::before {
        padding: 9px 20px;
    }
}


/* About */

dl.history dt {

}

dl.row.history dt span {
    font-family: 'Open Sans';
    font-size: 12px;
    line-height: 1em;
    color: #fff;
    background-color: #000;
    padding: 2px 7px;
    margin-right: 10px;
    margin-top: 10px;
}

dl.history dd {
    margin: 3px 0 0;

}

dl.history dd p {
    font-size: 14px;
    line-height: 1em;
}


/* How To */

.section-pagination {
    position: fixed;
    left: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 1.4em;
    z-index: 10;
}

.section-pagination li {
    list-style-type: none;
    margin-left: -40px;
}

.section-pagination a {
    display: block;
    height: 20px;
    margin-bottom: 5px;
    color: #000;
    position: relative;
    padding: 4px;
    -webkit-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
}

.section-pagination a.active:after {
    opacity: 0.8;
    -webkit-box-shadow: inset 0 0 0 5px;
    box-shadow: inset 0 0 0 5px;
}

.section-pagination a:hover {
    opacity: 1;
}

.section-pagination a:after {
    opacity: 0.2;
    -webkit-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
    width: 10px;
    height: 10px;
    display: block;
    background-color: #000;
    border-radius: 50%;
    content: '';
    position: absolute;
    margin: auto;
    top: 0;
    left: 4px;
    bottom: 0;
}


/* Auction */

/*12월수정*/
.card.auction {
    border: 1px solid #d4d4d4;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.card.auction img {
    max-width: 100%;
    max-height: 100%;
    display: inline-block;
    margin: 0 auto;
    vertical-align: middle;

    height: 200px;
    -o-object-fit: cover;
    object-fit: cover;
}

.card.auction .card-body {
    padding: 20px;
}

.card.auction .card-body .state {
    position: absolute;
    top: 125px;
    left: 0;
    height: 75px;
    padding: 10px 15px;
    font-size: 14px;
    font-weight: 600;
    line-height: 14px;
    text-transform: uppercase;
    color: #fff;
}

.card.auction .card-body .state.on {
    background: #ff7e2e !important;
}

.card.auction .card-body .state.off {
    background: rgba(0, 0, 0, 0.5);
}

.card.auction .card-title {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.06em;
    line-height: 22px;
    margin-top: 0;
}

.card.auction .card-subtitle {
    font-size: 18px;
    letter-spacing: -0.06em;
}

.card.auction .card-text {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -0.06em;
}

.card.auction .card-text .description,
.card.auction .card-text .list-inline-item {
    font-size: 14px;
    line-height: 22px;
    letter-spacing: -0.06em;
}


/*12월30일수정*/
/*경매리스트 결과보기버튼*/
.result-item {
    width: 50px;
    /* background: linear-gradient(to bottom, #F46001, #E14802); */
    background: #ff5d16;
    border-radius: 3px;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}

.result-item:hover {
    -webkit-box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.2);
}

.result-item > span {
    font-size: 10px;
    color: #fff !important;
}

.list-pd {
    padding: 0 5px !important;
}

.list-pd > div {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 1px solid #dee2e6;
    height: 500px !important;
}

/*7월5일수정*/
.list-pd:hover > div {
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16) !important;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16) !important;
}


.list-pd > div > div {
    padding: 40px 15px 0 15px !important;
}

.list-pd > div > div.Deadline-lot {
    padding: 0!important;
}

.Deadline-lot {
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.3);
    width: 100%;
    height: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 50;
}

.Deadline-lot > span {
    font-size: 8px;
    color: #ffffff;
}

/*copyright */
.text-copyright {
    position: absolute;
    bottom: 7px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
    text-align: center;
    padding: 0 5px;
    line-height: normal;
}

.text-copyright .text-truncate{
    overflow: visible;
    white-space: normal;
}

.text-copyright span {
    color: #808080;
    font-weight: 300;
    line-height: 1.2;
    display: block;
    font-size: 10px;
}


.card.artwork {
    min-height: 520px;
    padding: 0;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.15);
    -webkit-transition: all 0.2s linear 0s;
    -o-transition: all 0.2s linear 0s;
    transition: all 0.2s linear 0s;
    box-shadow: 0px 1px 5px 1px rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: 0px 1px 5px 1px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0px 1px 5px 1px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}

@media (max-width: 768px) {
    .card.artwork {
        height: 550px !important;
    }
}

@media (max-width: 575px) {
    .list-pd > div {
        height: 550px !important;
    }
}


.card.artwork:hover,
.card.artwork.hover {
    -webkit-box-shadow: 0px 1px 35px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 35px 0px rgba(0, 0, 0, 0.3);
}

.card.artwork img {
    max-width: 100%;
    max-height: 100%;
    display: inline-block;
    margin: 0 auto;
    vertical-align: middle;
    height: auto;
    padding: 5px;
}

/*경매리스트 페이지 img css 수정*/
.card.artwork > .listimg {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 228px;
    overflow: hidden;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 5px;
    background-color: #f9f9f9;
    flex-direction: column;
}

.card.artwork > .listimg > img {
    max-width: 100% !important;
    max-height: 100%;
    height: auto !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border-radius: 0;
}

.card.artwork:hover > .listimg > img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.card.artwork .card-body {
    padding: 15px;
    /*padding-top: 50px;*/
    padding-top: 35px;
}

.card.artwork .card-body .lot {
    position: absolute;
    top: 235px;
    left: 0;
    padding: 8px 15px;
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    /*font-weight: 600;*/
    font-weight: 600;
    line-height: 14px;
    text-transform: uppercase;
    /*color: #fff;*/
}


/*12월18일수정*/
.card.artwork .card-body .wishlist {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 1;
    width: auto;
    height: auto;
    border-radius: 100%;
    text-align: center;
    -webkti-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.card.artwork .card-body .wishlist .heart {
    font-size: 14px;
    line-height: 1em;
    color: #525f7f;
    opacity: 0.3;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}


.card.artwork .card-body .wishlist .heart-select {
    color: #ff7e2e;
    opacity: 1;
}

.card.artwork .card-body .wishlist .heart:hover {
    color: #ff7e2e;
    opacity: 1;
}

/*2월15일수정*/
.card.artwork .card-title {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.06em;
    line-height: 1.6em;
    /* 영문 이슈로 수정
      line-height: 22px;*/
    line-height: 26px;
    margin-top: 0;
}

.card.artwork .card-subtitle {
    font-size: 16px;
    line-height: 1.4em;
    letter-spacing: -0.06em;
    color: #666666;
    margin-bottom: 0.5em;
}

.card.artwork a.follow{
    position: absolute;
    top: 240px;
    right: 15px;
    font-weight: 400;
    font-size: 11px;
    line-height: 16px;
    color: #C1C1C1;
    border: 1px solid #C1C1C1;
    display: flex!important;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    height: 20px;
    border-radius: 20px;
    padding: 0 7px 0 5px;
}

.card.artwork a.follow i{
    background: url('../img/icons/icon_follow.png')no-repeat center;
    width: 13px;
    height:13px;
    background-size: cover;
}

.card.artwork:hover a.follow{
    border: 1px solid #868686;
    color: #868686;
}
.card.artwork:hover a.follow i{
    background-image: url('../img/icons/icon_follow_hover.png');
}

.card.artwork a.follow.on{
    border: 1px solid #F76E33;
    color: #F76E33;
}

.card.artwork a.follow b{
    font-weight: 400;
}

.card.artwork a.follow.on i{
    background-image: url('../img/icons/icon_follow_on.png');
}

.card.artwork .card-text {
    font-size: 12px;
    line-height: 18px;
    /* letter-spacing: -0.06em; */
    padding: 5px 0 1px 0;
}

.card.artwork .card-text.dotted {
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
}

.card.artwork .card-text .description {
    height: 36px;
    margin-bottom: 5px;
    color: #666666;
}

.card.artwork .card-text .description span {
    color: #666666;
    line-height: 1.3em;
}

/*4월25일수정*/
.card.artwork .card-text-subtitle .description {
    margin-bottom: 5px;
    color: #666666;
    line-height: 1.4em;
}

.card.artwork .card-text-subtitle .description span {
    color: #666666;
    font-size: 12px;
    line-height: 1.3em;
}

.card.artwork .card-text .description,
.card.artwork .card-text .list-inline-item {
    font-size: 12px !important;
    line-height: 1.2em;
    vertical-align: top !important;
    margin-bottom: 4px;
}

.card.artwork .card-text .list-inline-item.font-numbers {
    letter-spacing: 0.04em !important;
    color: #000000;
}

.list-inline-item:not(:last-child) {
    margin-right: 0;
}

@media (max-width: 575px) {
    .card.artwork .card-text-subtitle .description span {
        font-size: 14px;
    }

    .card.artwork .card-text .description,
    .card.artwork .card-text .list-inline-item {
        font-size: 14px !important;
    }
}


.card.artwork .description,
.card.artwork .list-inline-item {
    font-size: 12px !important;
    line-height: 18px;
}

.card-text.dotted {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dotted #ccc;
}

.carousel-auction .carousel-inner img {
    width: 100%;
}

.carousel-auction .carousel-item img {
    /* 2020.07.24 :: 세로 이미지 사이즈 고정 처리
  width: 100%;
  height: auto !important;*/
    width: auto;
    max-height: 510px;
    max-width: -webkit-fill-available;
}

.carousel-auction .carousel-indicators {
    position: relative !important;
    margin-top: 0;
    margin-bottom: 50px !important;
    padding-bottom: 50px !important;
    left: 0;
    -ms-flex-pack: left;
    -webkit-box-pack: left;
    justify-content: left;
}

.carousel-auction .carousel-indicators > li {
    width: 50px;
}

.carousel-auction .carousel-indicators li img {
    display: block;
    opacity: 0.5;
}

.carousel-auction .carousel-indicators li.active img {
    opacity: 1;
}

.carousel-auction .carousel-indicators li:hover img {
    opacity: 0.75;
}


/* Location */
.map {
    min-height: 350px;
}

.map-controls {
    display: none;
}

.map-overlay-container {
    position: relative;
}

.map-overlay {
    display: block;
    position: absolute;
    top: 15px;
    right: 0;
    width: 300px;
    height: 240px;
    font-size: 14px;
    line-height: 16px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.7);
    padding: 30px;
    z-index: 200;
}

.map-overlay dl {
    margin-bottom: 10px;
}

.map-overlay dd {
    margin-bottom: 10px;
}

.location dl {
    padding-top: 20px;
    padding-bottom: 0;
    margin-bottom: 0;
}

.location dl:not(:last-child) {
    border-bottom: 2px dotted #e6e6e6;
}

.location dd {
    margin-bottom: 10px;
}

.location dd i {
    vertical-align: middle;
}

.location dd .sub-1 {
    font-size: 16px;
    line-height: 1.2em;
    color: #f76835;
}

.location dd .sub-1:before {
    float: left;
    content: '';
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background: url('../img/icons/icon_sub_1.png') left no-repeat;
}

.location dd .sub-2 {
    color: #eea00d;
    font-size: 16px;
    line-height: 1.2em;
}

.location dd .sub-2:before {
    float: left;
    content: '';
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background: url('../img/icons/icon_sub_2.png') left no-repeat;
}

.location dd .bus {
    margin-top: 7px;
}

.location dd .bus:first-child {
    margin-top: 0;
}

.location dd .bus span {
    font-size: 16px;
    color: #666;
    line-height: 24px;
    display: inline-block;
    padding-left: 29px;
}

.location dd .bus-3 {
    margin-bottom: 15px;
}

.location dd .bus-1:before {
    float: left;
    content: '';
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background: url('../img/icons/icon_bus_1.png') left no-repeat;
}

.location dd .bus-2:before {
    float: left;
    content: '';
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background: url('../img/icons/icon_bus_2.png') left no-repeat;
}

.location dd .bus-3:before {
    float: left;
    content: '';
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background: url('../img/icons/icon_bus_3.png') left no-repeat;
}

.location dd .bus-1, .location dd .bus-2 {
    margin-bottom: 6px;
}


/*------------------------------------------------------------------
[20. Print]
------------------------------------------------------------------*/
@media print {
    .header,
    .overlay {
        display: none;
    }

    .ka-container {
        padding-left: 0;
    }

    .ka-content-wrapper .content {
        border-top: 0;
    }

    .ka-content-wrapper .content .card {
        border: none;
    }

    .ka-content-wrapper .content .card .card-body {
        padding: 0;
    }

    [class^='padding-'],
    [class*='padding-'],
    .table tbody tr td {
        padding: 10px;
    }
}

p, a, h1, h2, h3, h4, h5, h6, span {
    -webkit-transform: skew(-0.1deg);
    -ms-transform: skew(-0.1deg);
    transform: skew(-0.1deg);
}

body.modal-open {
    padding: 0 !important;
}

.modal.fade.slide-up {
    padding: 0 !important;
}

.modal.fade.show {
    padding-right: 0 !important;
}

/*12월8일 추가*/
/*상단영역디자인*/
.row {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.subtop-common.subtop-bn {
    height:auto;
    overflow:visible;
}
.subtop-bn {
    overflow: hidden;
    position: relative;
    height: 200px;
    z-index: 30;
}
.subtop-bn .subtop{height:100%}


/*메이저 경매*/
.subtop-bn.b1 .subtop {
    background: url(../img/bg/major.png) no-repeat center 45%;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px;
}

/*메이저 경매 결과*/
.subtop-bn.b2 .subtop{
    background: url(../img/bg/major.png) no-repeat center 40%;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px;
}

/*프리미엄 경매*/
.subtop-bn.b3 .subtop{
    background: url(../img/bg/premium-olilne.png) no-repeat center 20%;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px;
}

/*위클리 경매*/
.subtop-bn.b4 .subtop{
    background: url(../img/bg/weekly-online.png) no-repeat center;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px;
}


/*프리미엄/위클리 경매결과*/
.subtop-bn.b5 {
    background: url(../img/bg/wp-result.png) no-repeat top 100% center;
    background-size: cover;
    background-attachment: fixed;
}


/*기업 컬렉션*/
.subtop-bn.b6 .subtop{
    background: url(../img/bg/k-collection.png) no-repeat center;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px
}

/*케이아트 스페이스*/
.subtop-bn.b8 .subtop{
    background: url(../img/bg/k-artspace.png) no-repeat center;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px
}

/*회사소개*/
.subtop-bn.b9 .subtop{
    background: url(../img/bg/k-intro.png) no-repeat center center;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px;
}


/*채용공고*/
.subtop-bn.b10 .subtop{
    background: url(../img/bg/k-recru.png) no-repeat center;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px;
}

/*언론보도*/
.subtop-bn.b11 .subtop{
    background: url(../img/bg/k-media.png) no-repeat center 30%;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px
}

/*공지사항*/
.subtop-bn.b12 .subtop{
    background: url(../img/bg/k-notice.png) no-repeat center;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px
}


/*케이옥션 주얼리*/
.subtop-bn.b13 {
    background: url(../img/bg/k-jewelry.png) no-repeat top left 20%;
    background-size: cover;
    background-attachment: fixed;
}


/*하우투 상단*/
.subtop-bn.b14 .subtop{
    background: url(../img/bg/k-intro.png) no-repeat center center;
    background-size: cover;
    /* background-attachment: fixed; */
    height:200px
}


@media (max-width: 768px) {
    .subtop-bn.b1, .subtop-bn.b2, .subtop-bn.b3, .subtop-bn.b4, .subtop-bn.b5, .subtop-bn.b6, .subtop-bn.b7, .subtop-bn.b8, .subtop-bn.b9, .subtop-bn.b10, .subtop-bn.b11, .subtop-bn.b12, .subtop-bn.b13, .subtop-bn.b14 {
        background-attachment: scroll;
    }
}

.subtop-bn > .container.subtop {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.subtop-desc {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 400;
}


.subtop-desc > h1 {
    text-align: center;
    word-break: keep-all;
    color: #fff;
    font-size: 20px;
    line-height: 1.4em;
    font-weight: 500;
}

.subtop-desc > p {
    text-align: center;
    margin-top: 6px;
    color: #fff;
    font-size: 14px;
    line-height: 22px;
}

.subtop-desc > p > strong {
    display: block;
    font-weight: 400;
    word-break: keep-all;
}

.subtop-desc > p > span {
    color: #fff;
    font-size: 14px;
    line-height: 22px;
    text-align: center;
    word-break: keep-all;
}

.subtop-desc > .subtop-btn {
    margin-top: 15px;
    height: 32px;
    border: 1px solid #ccc;
    -webkit-transition: all 0.3s ease !important;
    -o-transition: all 0.3s ease !important;
    transition: all 0.3s ease !important;
}

.subtop-desc > .subtop-btn:hover {
    background-color: #fff;
}

.subtop-desc > .subtop-btn:hover > a {
    color: #000;
}

.subtop-desc > .subtop-btn > a {
    width: 100%;
    height: 100%;
    padding: 0 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #fff;
    font-size: 14px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all 0.3s ease !important;
    -o-transition: all 0.3s ease !important;
    transition: all 0.3s ease !important;
}

.subtop-desc > span {
    display: block;
    font-size: 12px;
    color: #fff;
    margin-top: 6px;
}


/*미디어쿼리*/
@media (max-width: 1090px) {
    .subtop-bn {
        height: 210px;
    }

    .subtop-h {
        height: 165px;
    }

    .subtop-bn.b1 > .subtop > .subtop-desc > h1,
    .subtop-bn.b3 > .subtop > .subtop-desc > h1,
    .subtop-bn.b4 > .subtop > .subtop-desc > h1 {
        margin-top: 20px;
    }

    .subtop-desc > p {
        font-size: 12px;
        line-height: 1.4em;
    }

    .subtop-desc > p > span {
        font-size: 12px;
    }
}

@media (max-width: 768px) {
    .subtop-desc > p {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .subtop-desc > p.place {
        margin-bottom: 5px;
    }

    .subtop-desc > h1 {
        font-size: 18px;
    }

}

/*서비스(카테고리) 공통 css*/
.cl-tit {
    margin-top: 60px;
}

.cl-tit > h2 {
    margin-bottom: 30px;
    font-size: 16px;
    font-weight: 500;
}

.cl-tit > p {
    font-size: 14px;
    line-height: 1.8em;
    margin-bottom: 30px;
}

/*기업컬렉션 css*/
.collection-list {
    font-size: 0;
}

.collection-list li {
    width: 48.5%;
    height: 500px;
    display: inline-block;
    vertical-align: top;
    padding-left: 0;
    border: 1px solid #cbcbcb;
}

.collection-list > li:nth-child(1),
.collection-list > li:nth-child(2) {
    margin-bottom: 40px;
}

.collection-list > li:nth-child(1),
.collection-list > li:nth-child(3) {
    margin-right: 3%;
}

.collection-list > li > .collection-img {
    width: 100%;
    height: 180px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.collection-list > li > .collection-img > img {
    max-width: 110%;
    max-height: 110%;
}

.collection-list > li > div:last-child {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px 20px 0 20px;
}

.collection-list > li > div > h6 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 15px;
}

.collection-list > li > div > p {
    font-size: 14px;
    line-height: 1.8em;
}

.collection-list > li:nth-child(1) > div > p.fir {
    margin-bottom: 20px;
}

.collection-inq {
    margin-top: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.collection-inq > strong {
    font-size: 16px;
    margin-right: 30px;
}

.collection-inq > div > span {
    position: relative;
    display: inline-block;
    font-size: 14px;
    color: #0d0d0d;
    margin-right: 25px;
}

.collection-inq > div > span:after {
    position: absolute;
    top: 50%;
    right: -12px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 1.5px;
    height: 12px;
    background-color: #0d0d0d;
}

.collection-inq > div > span:last-child {
    margin-right: 0;
}

.collection-inq > div > span:last-child:after {
    display: none;
}

/*기업컬렉션 미디어쿼리*/
@media (max-width: 1020px) {
    .cl-tit {
        margin-top: 20px;
    }

    .cl-tit > h2 {
        margin-bottom: 20px;
    }

    .collection-list li {
        width: 100%;
        margin-bottom: 40px;
    }

    .collection-list li {
        height: auto;
        margin-bottom: 30px;
    }

    .collection-list > li:nth-child(1),
    .collection-list > li:nth-child(2) {
        margin-bottom: 30px;
    }

    .collection-list > li > div:last-child {
        padding: 20px 15px;
    }

    .collection-list > li:nth-child(1),
    .collection-list > li:nth-child(3) {
        margin-right: 0;
    }

    .collection-inq {
        margin-top: 0;
    }

}

@media (max-width: 650px) {
    .collection-list > li > .collection-img {
        height: 150px;
    }

    .collection-list > li:nth-child(1) > div > p.fir {
        margin-bottom: 8px;
    }
}

@media (max-width: 585px) {
    .collection-list > li > .collection-img {
        height: 130px;
    }

    .collection-inq {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .collection-inq > div > span {
        display: block;
        margin-right: 0;
    }

    .collection-inq > div > span:after {
        display: none;
    }

}

@media (max-width: 490px) {
    .collection-list > li > .collection-img > img {
        max-width: initial;
        max-height: 100%;
    }
}

@media (max-width: 435px) {
    .collection-inq {
        margin-top: 0;
    }
}


/*케이옥션 스트링 css*/
.string-list {
    font-size: 0;
}

.string-list > li {
    display: inline-block;
    padding-left: 0;
    vertical-align: top;
    width: 32%;
    height: 500px;
    border: 1px solid #cbcbcb;
    margin-right: 2%;
}

.string-list > li:last-child {
    margin-right: 0;
}

.string-list > li > .kstring-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 180px;
    overflow: hidden;
}

.string-list > li > .kstring-img > img {
    max-height: 200px;
}

.string-list > li > div:last-child {
    padding: 20px 20px 0 20px;
}

.string-list > li > div > h6 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 15px;
}

.string-list > li > div > p {
    font-size: 14px;
    line-height: 1.8em;
}

.string-list > li > div > p > span {
    display: block;
}

.string-table {
    width: 100%;
}

.string-table td {
    font-size: 14px;
    padding: 2px 0;
}

@media (max-width: 950px) {
    .string-list > li {
        width: 100%;
        height: auto;
        margin-right: 0;
        margin-bottom: 30px;
    }

    .string-list > li > div:last-child {
        padding: 20px 20px;
    }

    .string-list > li:last-child {
        margin-bottom: 0;
    }

    .string-list > li > .kstring-img > img {
        max-height: initial;
        width: 100%;
    }
}

@media (max-width: 490px) {
    .string-list > li > .kstring-img {
        height: 150px;
    }
}

@media (max-width: 400px) {
    .string-list > li > .kstring-img {
        height: 130px;
    }
}


/*케이아트스페이스 css*/
.kart {
    margin-bottom: 0;
}

.kartimg {
    width: 650px;
    height: 365px;
    margin: 0 auto;
    margin-bottom: 100px;
}

.kartimg > div {
    width: 575px;
    height: 100%;
    margin: 0 auto;
}

.kartimg img {
    max-width: 100%;
}

.kartimg > .slick-list > .slick-track {
    height: 100%;
}

.kartimg > .slick-list > .slick-track > .slick-slide > div {
    height: inherit;
}

.kartimg > .slick-list > .slick-track > .slick-slide > div > div {
    height: inherit;
}

.kartimg > .slick-dots {
    bottom: -12px;
}

.kartimg > .slick-dots li {
    width: auto;
    height: auto;
    margin: 0 7px;
}

.kartimg > .slick-dots li button:before {
    width: auto;
    height: auto;
    font-size: 8px;
    line-height: normal;
    color: #dcdcdc;
    opacity: 1;
}

.kartimg > .slick-dots li.slick-active button:before {
    color: #666666;
}

.kartimg > .slick-next:before {
    right: 0;
    width: 25px;
    height: 25px;
}

.kartimg > .slick-prev:before {
    left: 0;
    width: 25px;
    height: 25px;
}

.kart-list {
    font-size: 0;
}

.kart-list > li {
    display: inline-block;
    padding-left: 0;
    vertical-align: top;
    width: 32%;
    height: 500px;
    border: 1px solid #cbcbcb;
    margin-right: 2%;
    margin-bottom: 40px;
}

.kart-list > li:nth-child(3n) {
    margin-right: 0;
}

.kart-list > li > .kartsp-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 180px;
    overflow: hidden;
}

.kart-list > li > .kartsp-img > img {
    max-height: 200px;
}

.kart-list > li > div:last-child {
    padding: 20px 20px 0 20px;
}

.kart-list > li > div > h6 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 15px;
}

.kart-list > li > div > p {
    font-size: 14px;
    line-height: 1.8em;
}

.kart-bot > div > div > p {
    font-size: 14px;
}

.kart-bot > div {
    margin-bottom: 60px;
}

.kart-bot > div > h5 {
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 15px;
    border-bottom: 1px solid #cbcbcb;
}

.kart-bot > div > div {
    margin-top: 15px;
}

.kart-bot > div > div > h6 {
    font-size: 14px;
    font-weight: 500;
}

.mapall {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

#map1 {
    width: 450px;
    height: 230px;
    margin-right: 100px;
}

.mapall > .map-desc > p {
    font-size: 14px;
}

.mapall > .map-desc > div {
    margin-bottom: 15px;
}

.mapall > .map-desc > div:last-child {
    margin-bottom: 0;
}

.mapall > .map-desc > div > h6 {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 5px;
}

.mapall > .map-desc > div > p {
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 5px;
}

.mapall > .map-desc > div > p > img {
    max-width: 100%;
    margin-right: 5px;
}

/*케이아트스페이스 미디어쿼리*/
@media (max-width: 950px) {
    .kart-list > li {
        width: 49%;
    }

    .kart-list > li:nth-child(3) {
        margin-right: 2%;
    }

    .kart-list > li:nth-child(2n) {
        margin-right: 0;
    }

    #map1 {
        width: 100%;
        height: 300px;
        margin-right: 0;
    }

    .mapall {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .mapall > .map-desc {
        width: 100%;
        margin-top: 30px;
    }

}

@media (max-width: 768px) {
    .kartimg {
        width: 450px;
        height: auto;
        margin-bottom: 60px;
    }

    .kartimg > div {
        width: 400px;
    }

    .kart-list > li {
        width: 100%;
        height: auto;
        margin-right: 0;
    }

    .kart-list > li > div:last-child {
        padding: 20px 20px;
    }

    .kart-list > li > .kartsp-img > img {
        width: 120%;
        max-height: initial;
    }
}

@media (max-width: 700px) {
    .kartimg > .slick-dots li button:before {
        font-size: 8px !important;
    }
}

@media (max-width: 520px) {
    .kartimg {
        width: 100%;
    }

    .kartimg > div {
        width: 350px;
    }

    .kart-bot > div {
        margin-bottom: 30px;
    }
}

@media (max-width: 490px) {
    .kart-list > li {
        width: 100%;
        margin-right: 0;
    }
}

@media (max-width: 455px) {
    .kartimg > div {
        width: 280px;
    }

    .kartimg > .slick-next:before {
        width: 10px;
        height: 10px;
    }

    .kartimg > .slick-prev:before {
        width: 10px;
        height: 10px;
    }

    .kart-list > li > .kartsp-img > img {
        width: auto;
        max-height: 120%
    }
}

@media (max-width: 400px) {
    .kart-list > li > .kartsp-img {
        height: 130px;
    }
}

/*케이옥션 주얼리 css*/
.jew-list {
    font-size: 0;
}

.jew-list > li {
    display: inline-block;
    padding-left: 0;
    vertical-align: top;
    width: 32%;
    height: 500px;
    border: 1px solid #cbcbcb;
    margin-right: 2%;
    margin-bottom: 40px;
}

.jew-list > li:nth-child(3n) {
    margin-right: 0;
}

.jew-list > li > .jew-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 180px;
    overflow: hidden;
}

.jew-list > li > .jew-img > img {
    max-height: 200px;
}

.jew-list > li > div:last-child {
    padding: 20px 20px 0 20px;
}

.jew-list > li > div > h6 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 15px;
}

.jew-list > li > div > p {
    font-size: 14px;
}

.jew-bot > div > div > p {
    font-size: 14px;
}

.jew-bot > div {
    margin-bottom: 60px;
}

.jew-bot > div > h5 {
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 15px;
    border-bottom: 1px solid #cbcbcb;
}

.jew-bot > div > div {
    margin-top: 15px;
}

.jew-inq > strong {
    display: inline-block;
    margin-right: 25px;
}

/*케이옥션주얼리 미디어쿼리*/
@media (max-width: 950px) {
    .jew-list > li {
        width: 100%;
        height: auto;
        margin-right: 0;
        margin-bottom: 30px;
    }

    .jew-list > li > div:last-child {
        padding: 20px 15px;
    }

    .jew-list > li:last-child {
        margin-bottom: 0;
    }

    .jew-list > li > .jew-img > img {
        max-height: initial;
        width: 100%;
    }

    .jew-bot {
        margin-top: 30px;
    }
}

@media (max-width: 490px) {
    .jew-bot > div:last-child {
        margin-bottom: 0;
    }

    .jew-list > li > .jew-img {
        height: 150px;
    }
}

@media (max-width: 400px) {
    .jew-list > li > .jew-img {
        height: 130px;
    }
}

/*프라이빗세일 css*/
.pri-top {
    margin-top: 60px;
}

.pri-top > h3 {
    font-size: 20px !important;
    margin-bottom: 10px;
    color: #fff;
}

.pri-top > p {
    font-size: 14px !important;
    line-height: 1.8em;
    color: #fff;
}

.pri-desc {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.pri-desc > div {
    width: 50%;
    height: 215px;
    padding: 40px 28px 0 28px;
    background-color: rgba(255, 255, 255, 0.8);
}

.pri-desc > div:first-child {
    margin-right: 44px;
}

.pri-desc > div > h6 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 30px;
}

.pri-desc > div > p {
    font-size: 14px !important;
}

.pritext {
    margin-top: 60px;
}

.pritext > p {
    color: #fff;
    font-size: 14px !important;
    font-weight: 300;
}


/*프라이빗세일 미디어쿼리*/
@media (max-width: 900px) {
    .k-private-sale {
        padding: 0 40px !important;
    }

    .k-private-sale > div {
        padding: 0 !important;
    }

    .pri-desc {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .pri-desc > div {
        width: 100%;
        height: auto;
    }

    .pri-desc > div > p {
        margin-bottom: 0;
    }

    .pri-desc > div:first-child {
        margin-right: 0;
        margin-bottom: 30px;
    }

    .pritext {
        margin-top: 20px;
        padding-bottom: 60px;
    }

    .pri-desc > div {
        padding: 24px 20px;
    }

    .pri-desc > div > h6 {
        margin-bottom: 14px;
    }
}

@media (max-width: 768px) {

}


/*회사소개*/
.aboutk {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 60px;
}

.aboutk > div {
    width: 50%;
}

.aboutk > div:first-child {
    margin-right: 110px;
}

.aboutk > div:first-child > p {
    margin-bottom: 40px;
}

.aboutk > div:first-child > img {
    max-width: 100%;
}

.aboutk > div > h6 {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 35px;
}

.aboutk > div > p {
    font-size: 14px;
    line-height: 1.8em;
}

.aboutk > div:last-child > ul {
    position: relative;
    padding-left: 22px;
}

.aboutk > div:last-child > ul::before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 1px;
    height: 94%;
    background-color: #ccc;
}

.aboutk > div:last-child > ul > li {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-left: 0;
    margin-bottom: 20px;
}

.aboutk > div:last-child > ul > li > span {
    line-height: 1.4em;
}

.aboutk > div:last-child > ul > li > strong {
    position: relative;
    line-height: 1.4em;
    display: inline-block;
    margin-right: 40px;
}

.aboutk > div:last-child > ul > li > strong:before {
    position: absolute;
    top: 50%;
    left: -24px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 5px;
    background-color: #ccc;
}


#aboutk-bot {
    margin-top: 60px;
}

#aboutk-bot > h6 {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 20px;
}

.aboutk-list {
    font-size: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

/* .aboutk-list > li {
    display: inline-block;
    padding-left: 0;
    vertical-align: top;
    width: 32%;
    height: 535px;
    border: 1px solid #cbcbcb;
    margin-right: 2%;
    margin-bottom: 30px;
} */
.aboutk-list>li {
    padding-left: 0;
    vertical-align: top;
    width: 23.5%;
    border: 1px solid #cbcbcb;
    margin-right: 2%;
    margin-bottom: 30px;
}

.aboutk-list > li:nth-child(4n) {
    margin-right: 0;
}

.aboutk-list > li > .aboutk-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 180px;
    overflow: hidden;
}

.aboutk-list > li > .aboutk-img > img {
    max-height: 230px;
}

.aboutk-list > li > div:last-child {
    padding: 20px;
}

.aboutk-list > li > div > h6 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 15px;
}

.aboutk-list > li > div > p {
    font-size: 14px;
    line-height: 1.8em;
}


/*회사소개 미디어쿼리*/
@media (max-width: 1200px) {
    .aboutk-list > li {
        width: 49%;
        height: 535px;
    }

    .aboutk-list > li:nth-child(3) {
        margin-right: 2%;
    }

    .aboutk-list > li:nth-child(2n) {
        margin-right: 0;
    }

    .aboutk-list > li > .aboutk-img > img {
        max-width: 100%;
        max-height: initial;
    }
}

@media (max-width: 1110px) {
    .aboutk > div:first-child {
        margin-right: 50px;
    }
}

@media (max-width: 1050px) {
    .aboutk {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        margin-top: 20px;
    }

    .aboutk > div {
        width: 100%;
    }

    .aboutk > div:first-child {
        margin-right: 0;
        margin-bottom: 30px;
    }

    .aboutk > div > h6 {
        margin-bottom: 15px;
    }

    #aboutk-bot > h6 {
        margin-bottom: 15px;
    }
}

@media (max-width: 768px) {
    .aboutk-list > li {
        width: 100%;
        margin-right: 0;
        height: auto;
    }

    .aboutk-list > li:last-child {
        margin-bottom: 0;
    }

    .aboutk-list > li > div:last-child {
        padding: 20px 15px;
    }
}

@media (max-width: 490px) {
    .aboutk-list > li > .aboutk-img {
        height: 150px;
    }
}

@media (max-width: 400px) {
    .aboutk-list > li > .aboutk-img {
        height: 130px;
    }
}


/*경매결과 페이지 css*/
.card.auction.ca {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    height: 160px;
    border-radius: 0 !important;
    overflow: hidden;
    margin-bottom: 0;
}

.card.auction.ca > .auction-image {
    width: 38%;
    height: 100%;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--color-grey_100);
}

.card.auction.ca > .auction-image > img {
    max-height: 100% !important;
    max-width: -webkit-fit-content !important;
    max-width: -moz-fit-content !important;
    max-width: fit-content !important;
    border-radius: 0 !important;
    height: 100%;
}

.card.auction.ca > .auction-content {
    position: relative;
    width: 62%;
}

.card.auction.ca > .auction-content > .card-body {
    padding: 25px 15px 0 20px;
}

.card.auction.ca > .auction-content > .card-body > .card-text > div > h5 {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6em;
    margin-bottom: 25px;
}

.card.auction.ca > .auction-content > .card-body > .card-text > .list-inline {
    font-size: 0;
}

.card.auction.ca > .auction-content > .card-body > .card-text > .list-inline > li {
    line-height: 1.6em !important;
    margin: 0;
}

.listAll {
    width: 90%;
    position: absolute;
    left: 20px;
    bottom: auto;
}

.listAll > .list-inline {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.listAll > .list-inline > li {
    font-size: 12px !important;
}

.listAll > .list-inline > li:first-child {
    width: 30%;
    margin-right: 0;
}

.listAll > .list-inline > li:last-child {
    width: 70%;
}


@media (max-width: 645px) {
    .card.auction.ca {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto !important;
    }

    .card.auction.ca > .auction-image {
        width: 100%;
        height: 200px;
    }

    .card.auction.ca > .auction-content {
        width: 100%;
    }

    .card.auction.ca > .auction-content > .card-body {
        padding: 25px 25px 70px 25px;
    }

    #list > div > .card.auction.ca > .auction-content > .card-body {
        padding: 25px 25px 25px 25px;
    }

    .listAll {
        width: 100%;
        position: relative;
        left: auto;
        bottom: auto;
    }

    .card.auction.ca > .auction-content > .card-body > .card-text > div > h5 {
        margin-bottom: 15px;
    }

    .card.auction.ca > .auction-content > .card-body > .card-text > .list-inline > li {
        font-size: 12px;
    }
}

@media (max-width: 440px) {
    .card-text .list-more-btn > button {
        width: 100%;
    }
}


/*서면/전화 응찰신청*/
.signtop {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.signtop > div {
    width: 50%;
}

.signtop > div:first-child {
    margin-right: 45px;
}

.signtop > div:first-child > .c1 > div:last-child > div {
    margin-bottom: 0;
}

.t1 {
    padding: 0;
}

.r1 {
    margin: 0;
    -webkit-box-align: start !important;
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}

.c1 {
    padding: 0;
    margin-top: 20px;
}

.h1 {
    height: auto !important;
}

.card .card-body.c1 {
    padding: 0;
}

.top-tit {
    height: auto !important;
}

.topdesc {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
    padding: 0;
    margin-bottom: 10px;
    font-weight: 400;
    font-size: 16px !important;
}

.topdesc > strong {
    font-weight: 400;
}

.card-title.t1 {
    font-size: 20px !important;
}

.cardheader {
    padding: 20px 0 !important;
    border-bottom: 1px solid #ccc !important;
}

.cardheader:after {
    display: none;
}

.toptit {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.sign-info {
    margin-top: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.sign-info > .signimg {
    position: relative;
    display: inline-block;
    margin-right: 30px;
    width: 25%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
    overflow: hidden;
}

.sign-info > .signimg::after {
    content: '';
    display: block;
    padding-bottom: 100%;
}

.sign-info > .signimg > img {
    position: absolute;
    display: block;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto;
}

.sign-info > .card-body {
    width: 75%;
    padding: 0;
}

.info-tit {
    padding: 0;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 15%;
    flex: 0 0 15%;
    max-width: 15%;
    word-break: keep-all;
}

.info-tit > strong {
    font-weight: 400;
    font-size: 16px;
}

.toptit > .auc-choice > div {
    display: inline-block;
    margin-right: 5px;
}

.toptit > .auc-choice > div > label {
    margin-left: 3px;
    margin-bottom: 0;
}

.sign-info > .card-body > .row {
    margin: 0;
    height: auto !important;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 10px;
}

.sign-info > .card-body > .row > .col-sm-9 {
    font-size: 16px;
    padding: 0;
}

.sign-info > .card-body > .row > .col-sm-9 > label {
    font-size: 16px;
    margin-bottom: 0;
}

.sign-info > .card-body > .row > .kind > label {
    text-indent: 3px;
    margin-right: 20px;
}

.sign-info > .card-body > .row > .kind > label:last-child {
    margin-right: 0;
}

.sign-info > .card-body > .row > .signprice > select {
    width: 500px;
    padding: 5px 10px;
    font-family: inherit;
    background: url('../img/icons/schedule-img.png') no-repeat 98% 50%;
    border: 1px solid #999;
    border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-weight: 500;
}

.sign-info > .card-body > .row > .signprice > select option {
    font-weight: 500;
}

.sign-info > .card-body > .row > .signprice > div {
    margin-top: 12px;
    line-height: 1.6em;
    font-size: 14px;
    font-weight: 400;
}

.agree-body {
    padding: 0px 0 40px 0 !important;
}

.sign-agree {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 0 !important;
    background-color: #f9f9f9;
    border: 1px solid #cccccc;
    padding: 45px 25px !important;
}

.sign-agree > ul {
    width: 100%;
    margin-bottom: 60px;
}

.sign-agree > ul:last-child {
    margin-bottom: 0;
}

.sign-agree > ul > li {
    line-height: 26px;
}

.realchk {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 15px;
}

.realchk input[type="checkbox"] {
    display: none;
}

.realchk input[type="checkbox"] + label span {
    display: inline-block;
    width: 22px;
    height: 22px;
    margin: -2px 5px 0 0;
    vertical-align: middle;
    background: url(../img/icons/agree-checkico@1x.png) left bottom no-repeat;
    cursor: pointer;
}

.realchk input[type="checkbox"]:checked + label span {
    background: url(../img/icons/agree-checkico@1x.png) -22px bottom no-repeat;
}

.realchk > label {
    font-size: 14px;
    margin-bottom: 0;
    margin-left: 5px;
    font-weight: 400;
}

.agree-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #fff !important;
    border-top: none;
    padding: 0 !important;
    margin-bottom: 100px;
}

.agree-footer > button {
    width: 240px;
    height: 40px;
    background-color: #fff !important;
    font-size: 14px !important;
    color: #202020 !important;
    border: solid 1px #666666 !important;
    padding: 0;
}

.agree-footer > button:first-child {
    margin-right: 16px;
}

.agree-footer > button:last-child {
    color: #fff !important;
    background-color: #000000 !important;
    border-color: #000000 !important;
}

.all-agree-check {
    margin-top: 20px;
}

.all-agree-check > .realchk {
    margin-top: 0;
}

.all-agree-check > .realchk > label {
    font-size: 16px;
    font-weight: 500;
}

.all-agree-check > .realchk > label > span {
    margin: -5px 5px 0 0 !important;
}


/*온라인 라이브 응찰신청*/
.liveauc-applicant > div > div:first-child {
    -webkit-box-flex: initial !important;
    -ms-flex: initial !important;
    flex: initial !important;
    max-width: initial !important;
    width: 25%;
    margin-right: 5%;
}

.liveauc-applicant > div > div:last-child {
    padding: 0 !important;
    width: 70%;
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial;
    max-width: initial;
}

.live-aucapply > ul > li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.live-aucapply > ul > li > img {
    max-width: 100%;
}


@media (max-width: 1020px) {
    .agreepage {
        padding-left: 30px;
        padding-right: 30px;
    }

    .signtop {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .signtop > div {
        width: 100%;
    }

    .signtop > div:first-child {
        margin-right: 0;
    }

    .sign-info {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .sign-info > .signimg {
        width: 100%;
        height: 230px;
        margin-right: 0;
        margin-bottom: 10px;
    }

    .sign-info > .signimg > img {
        max-width: 300px;
    }

    .sign-info > .card-body {
        width: 100%;
    }

    .sign-info > .card-body > .row > .col-sm-9 {
        width: 75%;
    }


    .realchk {
        margin-top: 10px;
    }

    .info-tit {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
        margin-right: 5%;
        display: inherit;
    }

    .sign-info > .card-body > .row > .col-sm-9 {
        width: 70%;
        max-width: 70%;
    }

    .topdesc1 {
        width: 70%;
        max-width: 70%;
    }

    .agree-body {
        padding: 0px 0 30px 0 !important;
    }

    .live-aucapply {
        padding: 30px 30px 30px 15px !important;
    }

}

@media (max-width: 768px) {
    .default {
        margin-bottom: 35px;
    }

    .sign-info > .card-body > .row > .signprice > select {
        width: 100%;
    }

    .sign-info > .card-body > .row > .kind > label {
        margin-right: 10px;
    }

    .sign-agree {
        padding: 30px 30px !important;
    }

    .sign-agree > ul {
        margin-bottom: 25px;
    }

    .live-aucapply {
        padding: 30px 30px 30px 15px !important;
    }


}

@media (max-width: 590px) {
    .cardheader {
        padding: 10px 0 !important;
    }

    .card-title.t1 {
        font-size: 16px !important;
    }

    .topdesc {
        font-size: 12px !important;
    }

    .info-tit > strong {
        font-size: 12px !important;
    }

    .info-tit > strong > span {
        font-size: 10px !important;
    }

    .toptit > .auc-choice > div > input {
        vertical-align: middle;
        margin-top: -2px;
    }

    .toptit > .auc-choice > div > label {
        font-size: 12px;
    }

    .sign-info > .card-body > .row > .signprice > select {
        font-size: 12px;
    }

    .sign-info > .card-body > .row > .signprice > div {
        margin-top: 5px;
        font-size: 12px;
    }

    .c1.apply > div:nth-child(5) > div:last-child > span,
    .c1.apply > div:nth-child(6) > div:last-child > span,
    .c1.apply > div:nth-child(7) > div:last-child > span,
    .c1.apply > div:nth-child(8) > div:last-child > span {
        font-size: 10px !important;
        line-height: 1.4em;
    }

    .sign-info > .card-body > .row > .col-sm-9 {
        font-size: 12px;
    }

    .sign-info > .card-body > .row > .col-sm-9 > label {
        font-size: 12px;
    }

    .sign-agree > ul > li {
        font-size: 12px;
    }

    .all-agree-check > .realchk > label {
        font-size: 14px;
    }

    .agree-footer {
        margin-bottom: 50px;
    }
}

@media (max-width: 510px) {
    .info-tit.price {
        margin-bottom: -20px;
    }

    .sign-info > .card-body > .row > .kind > label {
        margin-right: 3px;
    }
}

@media (max-width: 400px) {
    .sign-info > .card-body > .row > .kind > label {
        margin-right: 3px;
    }
}


/*도록신청페이지*/
.apply-book {
    width: 100%;
}

.apply-book > h3 {
    text-align: center;
    color: #fff;
    font-size: 20px;
    margin-bottom: 40px;
}

.apply-book > .applybook-kind {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.apply-book > .applybook-kind > div {
    width: 378px;
    height: 230px;
    margin-right: 30px;
    background-color: rgba(255, 255, 255, 0.8);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 30px 20px;
}

.apply-book > .applybook-kind > div:last-child {
    margin-right: 0;
}

.apply-book > .applybook-kind > div > h6 {
    font-size: 16px;
    line-height: 1.5em;
    font-weight: 600;
    margin-bottom: 20px;
}

.apply-book > .applybook-kind > div > p {
    font-size: 14px;
    line-height: 1.6em;
}

.apply-book > .applybook-kind > div > p.beware {
    margin-top: 20px;
}

.apply-book > .apply-btn {
    margin-top: 40px;
    text-align: center;
    height: 40px;
}

.apply-book > .apply-btn > a {
    display: inline-block;
    line-height: 40px;
    font-size: 14px;
    color: #fff;
    padding: 0 40px;
    border: 1px solid #efefef;
}

.apply-book > .apply-btn:hover > a {
    background-color: #efefef;
    color: #000000;
}


/*도록신청페이지 미디어쿼리*/
@media (max-width: 1200px) {
    .apply-book {
        padding: 60px 60px;
    }

    .apply-book > h3 {
        margin-bottom: 30px;
    }

    .apply-book > .applybook-kind {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .apply-book > .applybook-kind > div {
        width: 100%;
        height: auto;
        margin-right: 0;
        margin-bottom: 30px;
        padding: 25px 20px;
    }

    .apply-book > .applybook-kind > div > h6 {
        margin-bottom: 15px;
    }

    .apply-book > .applybook-kind > div > p {
        margin-bottom: 0;
    }

    .apply-book > .apply-btn {
        margin-top: 0;
    }
}

@media (max-width: 768px) {
    .apply-book-top {
        padding: 0 40px !important;
    }
}

@media (max-width: 690px) {
    .apply-book {
        padding: 60px 0;
    }
}

@media (max-width: 490px) {
    .apply-book > .applybook-kind > div > h6 {
        margin-bottom: 10px;
    }
}


/*위탁신청페이지*/
.material-ch {
    width: 180px; /* 원하는 너비설정 */
    height: 32px;
    padding: 0.2em 0.2em;
    margin-right: 5px;
    font-family: inherit; /* 폰트 상속 */
    background: url(../img/icons/schedule-img.png) no-repeat 95% 50%;
    border: 1px solid rgb(185, 185, 185);
    border-radius: 0px; /* iOS 둥근모서리 제거 */
    -webkit-appearance: none; /* 네이티브 외형 감추기 */
    -moz-appearance: none;
    appearance: none;
}

.material-ch::-ms-expand {
    display: none;
}

.topdesc1 {
    padding: 0;
    font-size: 16px !important;
    margin-bottom: 10px
}

.c1.apply {
    margin-bottom: 25px;
}

.c1.apply > div:nth-child(4) > div > input:last-child {
    margin-bottom: 0;
}

.topdesc1.sizeinfo > div {
    position: relative;
    display: inline-block;
    font-size: 0;
}

.topdesc1.sizeinfo > div > label {
    position: absolute;
    top: 50%;
    left: 3px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #666666;
}


.c1.apply > div:nth-child(5) > div:last-child > span,
.c1.apply > div:nth-child(6) > div:last-child > span,
.c1.apply > div:nth-child(7) > div:last-child > span,
.c1.apply > div:nth-child(8) > div:last-child > span {
    font-size: 12px;
}

.c1.apply > div:nth-child(7) > div:last-child > span,
.c1.apply > div:nth-child(8) > div:last-child > span {
    display: inline-block;
    margin-bottom: 5px;

}

.c1.apply > div:nth-child(4) > .topdesc1 > span:not(:last-child) {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    display: inline-block;
    padding: 0 5px;
}

.c1.apply > div:nth-child(4) > .topdesc1 > input.size {
    width: 45px !important;
}

.uploader-box > form > div {
    background-color: #f9f9f9;
    border: 1px solid #B9B9B9;
    margin-bottom: 10px;
}

.uploader-msg > span {
    position: static !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
}

.drag-ico > img {
    max-width: 100%;
}

.tui-file-uploader .tui-upload-lst .tui-upload-item {
    margin-top: 0 !important;
    margin-bottom: 3px !important;
    padding-left: 10px !important;
}


#artist-area {
    position: relative;
}

#artist-area label {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 4px;
    cursor: text;
    color: #666666;
}

.conapply-text {
    width: 100%;
    height: 150px;
    overflow-y: scroll;
    resize: none;
    border: 1px solid rgb(185, 185, 185);
    border-radius: 0px; /* iOS 둥근모서리 제거 */
    -webkit-appearance: none; /* 네이티브 외형 감추기 */
    -moz-appearance: none;
    appearance: none;
}

.essential > strong {
    position: relative;
}

.essential > strong:after {
    position: absolute;
    top: 2px;
    right: -12px;
    content: "*";
    font-size: 16px;
    color: #D83C31;
}


@media (max-width: 935px) {
    .c1.apply > div:nth-child(5) > div:last-child > span,
    .c1.apply > div:nth-child(6) > div:last-child > span {
        display: block;
        margin-top: 3px;
    }

    .c1.apply > div:nth-child(7) > div:last-child > span,
    .c1.apply > div:nth-child(8) > div:last-child > span {
        display: block;
    }
}

@media (max-width: 843px) {
    .c1.apply > div:nth-child(4) > .topdesc1 > span:not(:last-child) {
        margin-bottom: 8px;
    }
}

@media (max-width: 590px) {
    .topdesc1 {
        font-size: 12px !important;
    }

    .material-ch {
        font-size: 12px;
    }

    .topdesc1.sizeinfo > div > label {
        font-size: 12px;
    }

    .agree-footer > button {
        font-size: 12px !important;
    }

    #artist-area label {
        font-size: 12px;
    }
}

@media (max-width: 508px) {
    .material-ch {
        margin-bottom: 10px;
    }
}


@media (max-width: 490px) {
    #material-ch {
        font-size: 12px !important;
        padding: 0.4em 0.4em;
    }
}


.bot-join {
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 33.333333% !important;
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
}

.bot-shearch {
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 66.666667% !important;
    flex: 0 0 66.666667% !important;
    max-width: 66.666667% !important;
}


/*응찰내역 모달창 css*/
#cur-sit {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 750px;
    height: auto;
    z-index: 1200;
    background-color: #fff;
}

.cursit-bg {
    display: none;
}

#cur-sit > svg {
    position: absolute;
    top: -20px;
    right: 0;
}

.cursit-tit {
    padding: 15px 25px 15px 25px;
    border: 1px solid #eee;
}

.cursit-tit > p {
    font-size: 16px;
    font-weight: 500;
    color: rgb(75, 74, 74);
    text-align: center;
}

.cursit-cont {
    padding: 25px 25px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 350px;
    overflow-y: scroll;
}

.cursit-desc > .cursit-tab {
    width: 100%;
    table-layout: fixed;
}

.cursit-desc > .cursit-tab th,
.cursit-desc > .cursit-tab td {
    padding: 10px 10px;
    border: 1px solid #e3e2e2;
}

.cursit-desc > .cursit-tab th {
    background-color: #093558;
    color: #fff;
    font-weight: 400;
}

.cursit-desc > .cursit-tab th:last-child {
    text-align: center;
}

.cursit-desc > .cursit-tab tr td {
    width: inherit;
    white-space: nowrap;
    color: #666666;
}

.cursit-desc > .cursit-tab tr td:last-child {
    text-align: center;
}

.cursit-desc > .cursit-tab tr th:nth-child(1),
.cursit-desc > .cursit-tab tr th:last-child {
    width: 20%;
}

.cursit-desc > .cursit-tab tr th:nth-child(2) {
    width: 25%;
}

.cursit-desc > .cursit-tab tr th:nth-child(3) {
    width: 35%;
}


.cursit-desc > .cursit-tab td strong {
    color: #f44e05;
}

.cursit-cont > ul {
    margin-top: 15px;
}

.cursit-cont > ul > li {
    position: relative;
    padding-left: 15px;
    color: #818181;
}

.cursit-cont > ul > li::before {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 3px;
    height: 3px;
    background-color: #818181;
    border-radius: 3px;
}

.cursit-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1100;
    background-color: rgba(0, 0, 0, 0.5);
}

/*응찰내역 모달창 미디어쿼리*/
@media (max-width: 800px) {
    #cur-sit {
        width: 600px;
    }
}


@media (max-width: 620px) {
    #cur-sit {
        width: 450px;
    }

    .cursit-cont {
        padding: 20px 25px 20px 25px;
    }

    .cursit-desc > .cursit-tab th,
    .cursit-desc > .cursit-tab td {
        font-size: 12px;
    }

    .cursit-cont > ul > li {
        font-size: 12px;
    }

    .cursit-cont > ul > li:first-child::before {
        top: 23%;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
}

@media (max-width: 500px) {
    #cur-sit {
        width: 360px;
    }

    .cursit-cont {
        padding: 15px 20px 15px 20px;
    }

    .cursit-desc > .cursit-tab th,
    .cursit-desc > .cursit-tab td {
        font-size: 10px;
    }

    .cursit-desc > .cursit-tab tr td:first-child {
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .cursit-desc > .cursit-tab tr th:nth-child(2) {
        width: 30%;
    }

    .cursit-desc > .cursit-tab tr th:nth-child(3) {
        width: 30%;
    }

    .cursit-desc > .cursit-tab td.date {
        white-space: normal;
        line-height: 1.2em;
    }

    .cursit-desc > .cursit-tab tr td:nth-child(3) {
        white-space: normal;
        line-height: 1.2em;
    }
}

@media (max-width: 420px) {
    #cur-sit {
        width: 345px;
    }
}

body {
    overflow-x: hidden !important;
}


/*정보수정페이지*/
.modify-tabbtn {
    margin-top: 70px;
    margin-bottom: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.modify-tabbtn > ul {
    width: 1200px;
    height: 51px !important;
    font-size: 0;
    border-bottom: 1px solid #B2B6B7;
}

.modify-tabbtn > ul > li {
    position: relative;
    display: inline-block;
    width: 25%;
    height: 50px;
    line-height: 50px;
    padding-left: 0;
    vertical-align: top !important;
    background-color: #FAFAFA;
    border: 1px solid #eee;
    border-bottom: 0;
}

.modify-tabbtn > ul > li:first-child {
    margin-left: 0;
}

.modify-tabbtn > ul > li > a {
    display: block;
    text-align: center;
    width: 100%;
    font-size: 14px;
    color: #B2B6B7;
    word-break: keep-all;
}

.modify-tabbtn > ul > li.active {
    border-color: #B2B6B7;
    height: 51px;
    background-color: #fff;
    border-bottom: none;
    z-index: 100;
}

.modify-tabbtn > ul > li.active > a {
    color: #f44e05;
}

.container.modify > .tab-content {
    margin-bottom: 50px;
}

/*탭1 비밀번호 변경 css*/
.tab {
    padding: 20px 0 !important;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

.tab > div > div {
    font-size: 20px !important;
}

.tab > div {
    font-weight: 500;
    font-size: 20px !important;
}

.tabbody {
    padding: 0 0 20px 0 !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.tabbody > .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 20px;
    margin-left: 0;
    margin-right: 0;
}

.tabbody > div:nth-child(3),
.tabbody > div:last-child {
    margin-bottom: 0 !important;
}

.tabbody > .row > .col-lg-3 {
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial;
    max-width: 15%;
}

.tabbody > .row > .col-lg-3 > label {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 0 !important;
}

.tabbody > .row > .col-lg-9 {
    width: 430px !important;
    -webkit-box-flex: none !important;
    -ms-flex: none !important;
    flex: none !important;
    max-width: initial !important;
}

.tabbody > .row > .col-lg-9 > .form-group-default {
    width: auto !important;
    padding: 0 !important;
    margin: 0 0 10px 0;
}

.tabbody > .row > .col-lg-9 > div > input {
    width: 430px;
    height: 35px;
    padding-left: 5px;
    margin: 0 !important;
    min-height: initial;
}

.card.card-default.tab1 {
    margin-bottom: 0;
}

.card.tab1btn > .card-body {
    padding: 0;
}

.card.tab1btn > .card-body > .row {
    padding: 0;
}

.form-group-default + .error.pad {
    margin: 0 !important;
}


/*정보수정 비밀번호변경 버튼 css*/
.col-lg-6.tab1btn {
    max-width: 100%;
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.col-lg-6.tab1btn > button {
    min-width: initial;
    min-height: initial;
    padding: 0 !important;
    font-size: 14px !important;
    width: 240px;
    height: 40px;
    background-color: #ff5d16;
    font-weight: 500;
}

.col-lg-6.tab1btn > button:hover {
    background-color: #f44e05;
}

.password-sub {
    margin-bottom: 40px;
}

.password-sub > p {
    font-size: 14px;
    text-align: center;
}


/*정보수정 회원 정보 변경 css*/
.tab2-desc {
    margin-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.tabbody2 {
    padding: 0 0 20px 0 !important;
}

.tab2-desc > li {
    padding-left: 0;
    color: #0d0d0d;
    opacity: 1 !important;
}

.authenticate {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: initial;
    flex-wrap: initial;
}

.authenticate > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 28px 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 49%;
    background-color: #f9f9f9;
}

.authenticate > div:first-child {
    margin-right: 2%;
}

.authenticate > div > img {
    display: block;
    max-width: 100%;
    margin-bottom: 5px;
}

.authenticate > div > p {
    font-size: 20px;
    color: #0d0d0d;
    font-weight: 500;
    margin-bottom: 12px;
}

.authenticate > div > span {
    display: inline-block;
    font-size: 12px;
    margin-bottom: 12px;
    font-weight: 400;
    color: #0d0d0d;
}

.authenticate > div > button {
    display: inline-block;
    font-weight: 500;
    padding: 0;
    margin: 0;
    min-width: initial;
    min-height: initial;
    width: auto;
    padding: 0 40px;
    height: 36px;
    background-color: #ff5d16;
    font-size: 14px !important;
}

.authenticate > div > button:hover {
    background-color: #f44e05 !important;
}

.ethics_sub-tab {
    padding: 20px 0 !important;
}


.tabbody2 {
    padding: 0 0 20px 0 !important;
}

/*주소관리 css*/
.tab2-desc.tab2desc2 {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding-bottom: 20px;
}

.address-table {
    margin-top: 0;
}

.address-table thead tr th {
    color: #0d0d0d;
    white-space: nowrap;
}

.address-table tbody tr td {
    color: #0d0d0d !important;
    white-space: nowrap;
}

.address-table tbody tr td:nth-child(4) {
    white-space: normal;
}

.add-btn {
    position: relative;
    margin: 0 !important;
    margin-top: 20px !important;
}

.addbtn1, .addbtn2 {
    width: initial;
    max-width: initial;
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial;
    padding: 0 !important;
}

.add-btn > .addbtn1 {
    position: absolute;
    top: 0;
    left: 0;
}

.add-btn > .addbtn2 {
    position: absolute;
    top: 0;
    right: 0;
}

.addbtn1 > a, .addbtn2 > a {
    color: #0d0d0d;
    padding: 5px 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 32px;
}

/*회원탈퇴 css*/
/* .tab.member {
  margin-bottom: 20px;
} */
.member-desc {
    margin-bottom: 15px;
}

.memberbody > .row {
    -webkit-box-align: start !important;
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}

@media (max-width: 900px) {
    .tabbody {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .tabbody > .row {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .tabbody.t1 > .row {
        width: initial;
    }

    .add-btn {
        -webkit-box-orient: initial;
        -webkit-box-direction: initial;
        -ms-flex-direction: initial;
        flex-direction: initial;
    }

    .tabbody > .row > .col-lg-3 {
        max-width: 100%;
        margin-bottom: 5px;
    }

    .authenticate {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .authenticate.center {
        -webkit-box-pack: center !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
        -webkit-box-align: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
    }

    .authenticate.center > i {
        margin-right: 0 !important;
        margin-bottom: 5px !important;
    }

    .authenticate > div {
        width: 100%;
    }

    .authenticate > div:first-child {
        margin-right: 0;
        margin-bottom: 20px;
    }

    .table-responsive {
        overflow-x: scroll;
    }

    .address-table {
        width: 1000px;
    }
}

@media (max-width: 768px) {
    .tab {
        display: none !important;
    }

    .modify-tabbtn {
        margin-top: 30px;
    }

    .modify-tabbtn > ul > li.active {
        height: 50px;
        border: 1px solid rgb(138, 137, 137);
        border-bottom: 1px solid rgb(138, 137, 137);
        background-color: rgb(138, 137, 137);
    }

    .modify-tabbtn > ul > li.active > a {
        color: #fff;
    }

    .modify-tabbtn > ul > li {
        width: 50%;
        margin-left: -1px;
        border-bottom: 1px solid #eee;
    }

    .modify-tabbtn > ul > li:nth-child(3),
    .modify-tabbtn > ul > li:last-child {
        margin-top: -1px;
    }

    .modify-tabbtn > ul > li:first-child,
    .modify-tabbtn > ul > li:nth-child(3) {
        margin-left: 0;
    }

    .modify-tabbtn > ul {
        border-bottom: 0;
    }


    .container.modify {
        padding: 0 15px;
    }

    .container.modify > .tab-content {
        padding: 50px 0 30px 0;
        margin-bottom: 0;
    }
}


@media (max-width: 560px) {
    .addbtn1 > a, .addbtn2 > a {
        padding: 5px 15px;
    }
}

@media (max-width: 495px) {
    .tabbody.t1 > .row {
        width: 100% !important;
    }

    .tabbody.t1 > .row > .col-lg-9 {
        width: 100% !important;
    }

    .tabbody.t1 > .row > .col-lg-9 > div > input {
        width: 100%;
    }
}

@media (max-width: 400px) {
    .addbtn1 > a, .addbtn2 > a {
        padding: 5px 10px;
    }
}


/*아이디/비밀번호찾기 페이지 css*/
.member-sh {
    margin-top: 100px;
}

.membersh-pad {
    padding: 0 !important;
}

.member-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 50px;
}

.member-btn > ul {
    font-size: 0;
    height: 51px;
    width: 800px;
    border-bottom: 1px solid #B2B6B7;
}

.member-btn > ul > li {
    width: 50%;
    height: 50px;
    line-height: 50px;
    display: inline-block;
    padding-left: 0;
    vertical-align: top;
    background-color: #FAFAFA;
}

.member-btn > ul > li.active {
    background-color: #fff;
    height: 51px;
    border: 1px solid #B2B6B7;
    border-bottom: none;
}

.member-btn > ul > li.active > a {
    color: #f44e05;
}

.member-btn > ul > li > a {
    display: block;
    font-size: 14px;
    color: #B2B6B7;
    text-align: center;
}

.membersh-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0 !important;
}

.membersh-row > div {
    max-width: initial;
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial;
    width: 100%;
    padding: 0 !important;
    margin-bottom: 85px;
}

.membersh-row > div > h4 > img {
    margin-right: 5px;
}

.membersh-row > div > h5 > img {
    margin-right: 5px;
}

.membersh-row > div > h4,
.membersh-row > div > h5 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 500;
    text-align: center;
    padding-bottom: 20px;
    /* border-bottom: 1px solid #ccc !important; */
    margin-bottom: 20px;
}

.membersh-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.membersh-form > div {
    width: 450px;
}

.membersh-form > button {
    width: auto;
    background-color: #ff5d16;
    padding: 0 40px !important;
    font-weight: 500;
    font-size: 14px;
    margin-top: 25px !important;
    margin-bottom: 0 !important;
}

.membersh-form > button:hover {
    background-color: #f44e05 !important;
}

@media (max-width: 768px) {

    .member-sh {
        margin-top: 30px;
        margin-bottom: 0;
    }

}


@media (max-width: 500px) {
    .membersh-form > div {
        width: 100%;
    }

    .member-sh {
        margin-bottom: 0;
    }

    .membersh-form > button {
        margin-top: 15px !important;
    }
}

/*오시는길 css*/
.directions {
    padding-bottom: 100px !important;
}

.directions > h2 {
    font-size: 20px !important;
    font-weight: 500 !important;
    padding-bottom: 0 !important;
}

.loc-desc > dl {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    padding: 20px 0;
    margin: 0;
}

.loc-desc > dl > dt {
    padding: 0 0 0 20px;
}

.loc-desc > dl > dd {
    margin-bottom: 0;
    padding: 0;
}

.loc-desc > dl > dd > p {
    font-weight: 400 !important;
}

.loc-desc > dl:nth-child(4) > dd > p:first-child,
.loc-desc > dl:nth-child(4) > dd > p:nth-child(3) {
    margin-bottom: 10px;
}


@media (max-width: 700px) {
    .loc-desc > dl {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
        -webkit-box-align: start !important;
        -ms-flex-align: start !important;
        align-items: flex-start !important;
    }

    .loc-desc > dl > dt {
        padding: 0;
        margin-bottom: 15px !important;
    }
}

@media (max-width: 490px) {
    .loc-desc > dl:last-child {
        padding: 20px 0 0 0 !important;
    }
}


#error-desc {
    width: 100%;
    height: 600px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;

}

#error-desc > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#error-desc > div > img {
    max-width: 100%;
    height: auto;
}

#error-desc > div > p {
    margin: 20px 0;
    font-size: 20px;
}

#error-desc > div > .error-btn {
    width: 120px;
    height: 30px;
    line-height: 30px;
    border: 1px solid #3079FF;
    border-radius: 3px;
}

#error-desc > div > .error-btn > a {
    display: block;
    text-align: center;
    font-size: 12px;
    color: #3079FF;
}

@media (max-width: 500px) {
    #error-desc > div > img {
        max-width: 120px;
    }

    #error-desc > div > p {
        margin: 14px 0;
        font-size: 16px;
    }
}


.select2-index {
    z-index: 200;
}


/*카드형식리스트디자인*/
.card-list {
    position: relative;
    width: 100%;
    height: 240px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    background-color: var(--color-grey_100);
    margin-bottom: 20px;
}

.wish_list .card-list{
    padding: 20px;
    padding-right: 0;
}

.card-list > .row-pad > .card-list-img img {
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.card-list:hover > .row-pad > .card-list-img img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.card-list > .row-pad > .card-list-img .bid-closed-desc {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 30.5%;
    height: 34px;
    line-height: 34px;
    /* background-color: rgba(16, 27, 77, 0.4); */
    background: #F0EFEF;
    text-align: center;
    color: #B3B3B3;
    font-size: 14px;
    font-weight: 300;
    border-radius: 4px;
}


.sh-none {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.card.artwork .description, .card.artwork .list-inline-item {
    font-size: 14px !important;
    line-height: 24px;
}

.row-pad {
    width: 100%;
    padding: 20px 20px !important;
    /* display: -ms-grid;
    display: grid;
    -ms-grid-columns: 300px auto 280px;
    grid-template-columns: 300px auto 280px; */
    height: 100%;
    display:flex;
    flex-direction:row;
    flex-flow:wrap;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

}

.row-pad > div {
    width:31.8%;
    margin-right:2.3%;
}

.row-pad > div:last-child {
    margin-right: 0;
}

.row-pad > .card-list-img {
    height: 200px !important;
    overflow: hidden;
    background-color: var(--color-grey_200);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
}

.row-pad > .card-list-img img {
    max-height: 100%;
    margin: 0 !important;
}

.row-pad .card-list-info > .card-sub-date-auction {
    font-size: 13px !important;
    line-height: 1.2em;
    margin-bottom: 5px;
}

.row-pad .card-list-info > .card-lot-num {
    font-family: 'Montserrat', sans-serif;
    margin-bottom: 4px;
    font-size: 14px !important;
    font-weight: 500;
    text-transform: uppercase;
}

.wish_list .row-pad .card-list-info > .card-lot-num{
    margin-bottom: 9px;
}

.row-pad .card-list-info > .card-writer{
    font-size: 18px !important;
    font-weight: 600;
    display: flex;
    flex-direction: column;
}

.row-pad .card-list-info > .card-writer font{
    font-family: 'Montserrat';
    font-weight: 400;
    color: #A3A3A3;
}

.row-pad .card-list-info > .card-writer span{
    display: flex;
    flex-direction: row;
    align-items: baseline;
}

.row-pad .card-list-info > .card-writer .follow{
    font-weight: 400;
    font-size: 11px;
    line-height: 16px;
    color: #C1C1C1;
    border: 1px solid #C1C1C1;
    display: flex!important;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    height: 20px;
    border-radius: 20px;
    margin-left: 5px;
    padding: 0 7px 0 5px;
}

.row-pad .card-list-info > .card-writer .follow b{
    font-weight: 400;
}

.row-pad .card-list-info > .card-writer .follow i{
    background: url(../img/icons/icon_follow.png)no-repeat center;
    width: 13px;
    height: 13px;
    background-size: cover;
}

.card-list:hover .row-pad .card-list-info > .card-writer .follow{
    color: #868686;
    border: 1px solid #868686;
}

.card-list:hover .row-pad .card-list-info > .card-writer .follow i{
    background: url(../img/icons/icon_follow_hover.png)no-repeat center;
    background-size: cover;
}

.card-list .row-pad .card-list-info > .card-writer .follow.on{
    border: 1px solid #F76E33;
    color: #F76E33;
}
.card-list .row-pad .card-list-info > .card-writer .follow.on i{
    background: url(../img/icons/icon_follow_on.png)no-repeat center;
    background-size: cover;
}

.row-pad .card-list-info > .card-subtitle-desc {
    font-size: 16px;
    line-height: 1.4em;
    color: var(--color-grey_700);
    margin-bottom: 38px;
    width: initial;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
}

.row-pad .card-list-info > .card-subtitle-infodesc {
    font-size: 14px !important;
    line-height: 1.4em;
    color: var(--color-grey_700);
}


.row-pad .card-price-info {
    position: static!important;
    height: 160px;
}


.row-pad .card-price-info > .card-price-list > ul {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.row-pad .card-price-info > .card-price-list > ul.wishlist-price-list{
    color: #000;
}

.row-pad .card-price-info > .card-price-list > ul.copy > li {
    width: 100% !important;
    text-align: left !important;
}

.row-pad .card-price-info > .card-price-list > ul > li {
    font-size: 14px !important;
    line-height: 1.4em !important;
    padding-left: 0;
}

.row-pad .card-price-info > .card-price-list > ul > li:not(:last-child) {
    margin-bottom: 2px;
}

.row-pad .card-price-info > .card-price-list > ul > li.current {
    color: var(--color-orange_500);
}

.row-pad .card-price-info > .card-price-list > ul > li.current{
    font-weight: 700;
}

.row-pad .card-price-info > .card-price-list > ul > li:first-child {
    width: 20%;
}

.row-pad .card-price-info > .card-price-list > ul > li:last-child {
    width: 80%;
    text-align: right;
}

.row-pad .card-price-info > .card-price-btn {
    width: 30.5%;
    height: 36px;
    position: absolute!important;
    right: 20px;
    bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.row-pad .card-price-info > .card-price-btn > a.lot-closed{
    background: #F0EFEF;
    cursor: default;
}

.row-pad .card-price-info > .card-price-btn > a.lot-closed > span{
    color: #B3B3B3;
    cursor: default;
}

.row-pad .card-price-info > .card-price-btn > a {
    width: 100%;
    height: 34px;
    border-radius: 4px;
    background-color: var(--color-blue_900);
    text-align: center;
    line-height: 34px;
    cursor: pointer;
}


.row-pad .card-price-info > .card-price-btn.open > a {
    width: 100% !important;
}

.row-pad .card-price-info > .card-price-btn > a > span {
    color: #ffffff;
}

.row-pad .card-list-img .heartic {
    width: 26px !important;
    height: 26px !important;
    line-height: 26px !important;
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #ffffff;
}

.row-pad .card-list-img .heartic > i {
    font-size: 14px !important;
}


@media (max-width: 910px) {
    .card-list {
        height: 590px;
    }

    .card-list > .row-pad {
        -ms-grid-columns: auto;
        grid-template-columns: auto;
    }

    .row-pad > div {
        margin-right: 0;
    }

    .row-pad > .card-list-img {
        width: 100%;
        height: 200px !important;
    }

    .row-pad > .card-list-info {
        width: 100%;
        margin-top: 10px;
    }

    [id*='collapse-'] .row-pad > .card-price-info > .card-price-btn{
        width: 95%!important;
        right: 50%!important;
        transform: translateX(50%)!important;
    }

    #search-integration-list .card-list > .row-pad > .card-list-img .bid-closed-desc,
    #search-integration-list .row-pad .card-price-info > .card-price-btn{
        width: calc(100% - 40px);
        width: -webkit-calc(100% - 40px);
        width: -moz-calc(100% - 40px);
        width: -o-calc(100% - 40px);
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }

    #search-integration-list .card-list > .row-pad{
        padding-bottom: 75px!important;
    }

    .card-list-info.work-cancel > div {
        position: static !important;
    }

    .row-pad > .card-list-info > .card-subtitle-infodesc {
        padding-bottom: 10px;
        border-bottom: 1px solid #cccccc;
    }

    .row-pad > div:last-child {
        width: 100%;
        height: 155px;
    }

    .row-pad .card-list-info > .card-subtitle-desc {
        margin-bottom: 15px;
    }
}

/*로그인하기 화면 height값 조정*/
.login-wrapper {
    height: initial !important;
}

/*가입완료페이지*/
.join-advertisement-agree {
    margin-bottom: 55px;
}

.join-advertisement-agree > p {
    font-size: 18px;
    text-align: center;
    margin-bottom: 15px;
}

.advertisement-agree-tb {
    width: 100%;
}

.advertisement-agree-tb tr:first-child {
    border-top: 1px solid #c1c1c1;
}

.advertisement-agree-tb tr:last-child {
    border-bottom: 1px solid #c1c1c1;
}

.advertisement-agree-tb tr:first-child {
    border-bottom: 1px solid #dedede;
}

.advertisement-agree-tb tr:first-child td {
    padding: 10px 5px;
    background-color: #eeeeee;
    color: #535353;
}


.advertisement-agree-tb td {
    width: 33.3334%;
    text-align: center;
    border-right: 1px solid #dedede;
    background-color: #ffffff;
    padding: 20px 5px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.advertisement-agree-tb td:last-child {
    border-right: 0;
}

.advertisement-agree-tb td > div > span {
    display: block;
    line-height: 1.2em;
    color: #535353;
}

.join-advertisement-agree > .cnt {
    color: #cccccc;
    padding-top: 10px;
}

.join-advertisement-agree > .cnt > span {
    color: #000000;
    text-decoration: underline;
}

.advertisement-agree-tb td div > a {
    display: inline-block;
    background-color: #707070 !important;
    color: #ffffff;
    padding: 4px 22px;
    border-radius: 6px;
    line-height: 1.2em;
    font-size: 13px;
    margin-top: 5px;
}


.join-complete {
    width: 100%;
    padding: 40px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.join-complete > img {
    max-width: 100%;
    margin-bottom: 12px;
}

.join-complete > h2 {
    font-size: 22px;
    margin-bottom: 15px;
    font-weight: 500;
}

.join-complete > p {
    width: 100%;
    text-align: center;
    font-size: 16px;
    word-break: keep-all;
    line-height: 1.8em;
    margin-bottom: 20px;
}

.join-complete > p > span {
    color: #f44e05;
}


.join-next {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 100px;
}

.join-next > div {
    position: relative;
    width: 32%;
    height: 240px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: 2%;
    border: solid 1px #efefef;
    background-color: #f9f9f9;
    padding: 30px 30px;
}

/*2월15일수정*/
.join-next > div:last-child {
    margin-right: 0;
}

.join-next > div > h4 {
    font-size: 16px;
    line-height: 1.6em;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}

.join-next > div > p {
    font-size: 14px;
}

.join-next > div > .joinnext-btn {
    position: absolute;
    bottom: 30px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 40px;
    line-height: 40px;
    border: 1px solid #666666;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.join-next > div > .joinnext-btn > a {
    width: 100%;
    height: 100%;
    display: block;
    padding: 0 40px;
    color: #000;
    text-align: center;
    white-space: nowrap;
}

.join-next > div > .joinnext-btn:hover {
    background-color: #000;
    border-color: #000;
}

.join-next > div > .joinnext-btn:hover > a {
    color: #fff;
}

.member-header {
    padding: 0 0 18px 0 !important;
    border-bottom: 1px solid #aaaaaa !important;
}

.card-title > div {
    font-size: 20px !important;
}

.cardbody {
    padding: 0 !important;
    margin-top: 20px;
}

.cardbody > div {
    margin: 0 !important;
}

.cardbody > div > div {
    padding: 0 !important;
    margin: 0 !important;
}

.cardbody > div:first-child > div > ul {
    margin-left: 0;
}

.cardbody > div:first-child > div > ul > li {
    position: relative;
    padding-left: 10px;
    line-height: 1.6em;
    margin-bottom: 10px;
}

.cardbody > div:first-child > div > ul > li:last-child {
    margin-bottom: 0;
}

.cardbody > div:first-child > div > ul > li::before {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 3px;
    height: 3px;
    background-color: #0d0d0d;
    border-radius: 3px;
}

.card-join > div:nth-child(2) {
    margin-bottom: 100px !important;
}

#etc-info-1 > .cardbody > div > div:first-child {
    padding-right: 20px !important;
}

.add-infobtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 40px 0 100px 0;
}

.add-infobtn > a {
    display: block;
    width: 240px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #666666;
    color: #000;
}


@media (max-width: 992px) {
    .join-next {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .join-next > div {
        width: 100%;
        margin-right: 0;
        margin-bottom: 30px;
    }

    .join-next > div:last-child {
        margin-bottom: 0;
    }

    .join-next > div > p {
        text-align: center;
    }

    #etc-info-1 > .cardbody > div > div:first-child {
        padding-right: 0 !important;
    }

    #company-address-btn-1 {
        margin-bottom: 10px !important;
    }

}

@media (max-width: 768px) {
    .join-complete {
        padding: 20px 0;
    }

    .join-next {
        margin-bottom: 50px;
    }

    .card-join > div:nth-child(2) {
        margin-bottom: 50px;
    }

    .add-infobtn {
        padding: 20px 0 50px 0;
    }

    .advertisement-agree-tb td,
    .advertisement-agree-tb td > div > span,
    .advertisement-agree-tb td,
    .advertisement-agree-tb td > div > strong {
        font-size: 13px;
    }

    .join-advertisement-agree > p {
        font-size: 16px;
    }

}


@media (max-width: 490px) {
    .join-complete > p {
        font-size: 14px;
    }

    .advertisement-agree-tb td div > a {
        padding: 3px 15px;
    }
}


/*회원가입페이지 css*/
.joinbody {
    padding: 0 0 20px 0 !important;
}

.joinbody > h3 {
    font-size: 20px !important;
    font-weight: 600 !important;
    margin-bottom: 8px;
}

.joinbody > p {
    font-size: 14px;
    opacity: 1 !important;
}


.authen > div:not(:first-child) {
    margin-top: 8px !important;
}

.authen > div > div > div > div > span {
    font-size: 14px !important;
}

.join-agreements > div:not(:first-child) {
    margin-top: 8px !important;
}

#form-registration > div:nth-child(2) {
    margin-top: 50px;
}

.join-btn {
    margin: 25px 0 50px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.join-btn > button {
    width: 240px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    background-color: #ff5d16;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.join-btn > button:hover {
    background-color: #f44e05;
}

@media (max-width: 530px) {
    .form-check label {
        margin-right: 17px;
    }
}


/*정보수정페이지 수정 css*/
.not-pad > div {
    padding: 0 !important;
    max-width: 49.5% !important;
}

.not-pad > div:first-child {
    margin-right: 1%;
}

@media (max-width: 900px) {
    .not-pad > div {
        max-width: 100% !important;
    }

    .not-pad > div:first-child {
        margin-right: 0;
    }
}


/*margin-bottom값 없애주기*/
.not-mg {
    margin-bottom: 5px !important;
}


/*위시리스트 보관안내*/
.wishlistguide-content {
    padding: 20px 30px;
    background-color: #f9f9f9;
}

.wishlistguide-content > h4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: #666666;

}

.wishlistguide-content > h4 > img {
    max-width: 100%;
    margin-right: 5px;
}

.wishlistguide-content > ul > li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-left: 0;
}

.wishlistguide-content > ul > li > .ellipse {
    width: 4px !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 20px;
    margin-right: 8px;
}

.wishlistguide-content > ul > li > .ellipse > img {
    max-width: 100%;
    opacity: 0.7;
}

.wishlistguide-content > ul > li > p {
    font-size: 12px;
    line-height: 1.6em;
    color: #666666;
}

@media (max-width: 595px) {
    .wishlistguide-content > ul > li {
        margin-bottom: 3px;
    }
}


/*모달팝업 css*/
.modal-popup-employees {
    z-index: 457;
}

.modal-popup-employees > div > div {
    position: relative;
    width: 450px;
    padding: 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 1611;
}

.modal-popup-employees > div > div > .modal-employees-close {
    position: absolute;
    top: 12px;
    right: 12px;
    max-width: 100%;
    cursor: pointer;
}

.modal-popup-employees > div > div > .img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 10px;
}

.modal-popup-employees > div > div > h2 {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6em;
    color: #666666;
    margin-bottom: 20px;
}

.modal-popup-employees > div > div > p {
    font-size: 12px;
    line-height: 1.5em;
    padding-bottom: 10px;
    color: #666666;
}

.modal-popup-employees > div > div > .employees-number {
    margin: 0px 0 16px 0;
    padding: 12px 20px;
    background-color: #f9f9f9;
}

.modal-popup-employees > div > div > .employees-number > li {
    padding-left: 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.modal-popup-employees > div > div > .employees-number > li > .ellipse {
    width: 3px;
    height: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 6px;
}

.modal-popup-employees > div > div > .employees-number > li > .ellipse > img {
    max-width: 100%;
}

.modal-popup-employees > div > div > .employees-number > li > span {
    color: #666666;
    line-height: 1.5em;
    font-size: 12px;
}

.modal-popup-employees > div > div > .modal-btn {
    margin-top: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.modal-popup-employees > div > div > .modal-btn > a {
    width: 150px;
    height: 40px;
    line-height: 40px;
    text-align: center;
}

.modal-popup-employees > div > div > .modal-btn > a:first-child {
    border: 1px solid #cccccc;
    color: #000000;
    margin-right: 8px;
}

.modal-popup-employees > div > div > .modal-btn > a:last-child {
    background-color: #000;
    color: #fff;
}

@media (max-width: 500px) {
    .modal-popup-employees > div > div {
        width: 400px;
    }
}

@media (max-width: 430px) {
    .modal-popup-employees > div > div {
        width: 350px;
    }
}

@media (max-width: 380px) {
    .modal-popup-employees > div > div {
        width: 330px;
    }
}


#modal-login > div > .modal-content {
    padding: 0 !important;
}

.modal.show .modal-dialog {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.modal.fade {
    padding: 0 !important;
}

.modal.fade > div > div {
    /* width: 450px;*/
    width: 100%;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 30px;
}

.modal.fade .modal-content > div {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.modal.fade .modal-content > div > img {
    max-width: 100%;
    margin-bottom: 5px;
}

.modal.fade .modal-content > div > h2 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
}

.modal.fade .modal-content > div > .modal-cnt {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.modal.fade .modal-content > div > .modal-cnt > span {
    display: inline-block;
    width: 100%;
    font-size: 14px;
    line-height: 1.5em;
    color: #666666;
    text-align: center;
}

.modal.fade .modal-content > div > .modal-change-cnt {
    width: 100%;
    padding: 12px 20px;
    background-color: #f9f9f9;
    margin-top: 16px;
}

.modal.fade .modal-content > div > .modal-change-cnt > ul > li {
    position: relative;
    font-size: 12px;
    color: #666666;
    line-height: 1.7em;
    padding-left: 9px;
}

.modal.fade .modal-content > div > .modal-change-cnt > ul > li::after {
    position: absolute;
    content: '';
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 3px;
    height: 3px;
    background-color: #666666;
    border-radius: 3px;
}

.modal.fade .modal-content > div > .modal-btn {
    margin-top: 20px;
    height: 40px;
    line-height: 40px;
}

.modal.fade .modal-content > div > .modal-btn > a {
    display: block;
    padding: 0 40px;
    color: #Fff;
    border-radius: 5px;
    background-color: #000000;
}

.modal.fade .modal-content > div > .modal-section-btn {
    margin-top: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.modal.fade .modal-content > div > .modal-section-btn > a {
    width: 150px;
    height: 40px;
    line-height: 40px;
    text-align: center;
}

.modal.fade .modal-content > div > .modal-section-btn > a:first-child {
    border: 1px solid #cccccc;
    color: #000000;
    margin-right: 8px;
}

.modal.fade .modal-content > div > .modal-section-btn > a:last-child {
    background-color: #000;
    color: #fff;
}

.modal.fade > div > div > .modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    max-width: 100%;
    cursor: pointer;
}

@media (max-width: 400px) {
    .modal.fade .modal-content > div > .modal-section-btn > a {
        width: 130px;
    }
}


@media only screen and (min-width: 1200px) {
    form .row {
        margin-left: 0;
        margin-right: 0;
    }
}


/* 4월15일수정 */
.delivery-addr-info .collect-info-modal.show{
    background: none;
}
.delivery-addr-info input[type='text'],
.delivery-addr-info input[type='number']{
    border: 1px solid rgba(33, 33, 33, 0.14)!important;
}

#modal-address {
    padding: 0 !important;
}

.delivery-addr-info .close{
    top: 15px;
}

#modal-address .modal-content {
    position: relative;
}

#modal-address .address_modal_tit {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 56px;
    border-bottom: 1px solid #eeeeee;
    font-size: 16px;
    font-weight: 700;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 24px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#modal-address > div {
    height: 100%;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#modal-address .address_modal_cnt {
    width: 100%;
    margin-top: 42px;
}

#modal-address .address_modal_cnt .list {
    width: 100%;
    margin-bottom: 12px;
}

#modal-address .address_modal_cnt .list .address_name_ch > div {
    margin-right: 10px;
}

#modal-address .address_modal_cnt .list > p {
    font-size: 14px;
    margin-bottom: 5px;
}

#modal-address .address_modal_cnt .list input {
    width: 100%;
    height: 40px;
}

#modal-address .address_modal_cnt .delivery-addr input::placeholder{
    color: #ccc;
} 

#modal-address .address_modal_cnt .list .addr-input{
    margin-top: 5px;
    width: 100%;
    
}
#modal-address .address_modal_cnt .list.address_num .addr-detail{
    padding-right: 0;
}

#modal-address .address_modal_cnt .list select {
    width: 100%;
    height: 40px;
    background: url(../img/icons/schedule-img.png) no-repeat 98% 50%;
}

#modal-address .address_modal_cnt .list.address_num > div {
    position: relative;
    padding-right: 160px;
}

#modal-address .address_modal_cnt .list.address_num > div > button {
    width: 150px;
    height: 100%;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 5px;
    color: var(--color-grey_600);
}

#modal-address .list.check-address-agree .join-conditions + label > div{
    justify-content: start;
    width: auto;
}

#modal-address .list.check-address-agree .join-conditions + label > strong{
    width: auto;
    margin-left: 5px;
}

#modal-address .address_modal_cnt .list.check-address-agree{
    margin-bottom: 3px;
}

#modal-address .address_modal_cnt .list.check-address-agree strong{
    display: block;
}

#modal-address .address_modal_cnt .list.check-address-agree strong span{
    text-decoration: underline;
    color: #F76E33;
}

#modal-address .address_modal_cnt .list.check-address-agree .text-tooltip{
    color: #636363;
    font-size: 12px;
    padding-left: 21px;
}

#modal-address .address_modal_cnt .list.check-address-agree .text-tooltip br{
    display: none;
}
#modal-address .address_modal_cnt .list.check-address-agree .text-tooltip span{
    color: #f55753;
}

.list.check-address-agree label > div > span{
    width: 16px;
    height: 16px;
}

.list.check-address-agree label > div > span i{
    font-size: 10px;
}

#modal-address .join-conditions:checked + .text-tooltip{
    display: none;
}

#address_modify_btn_wrap {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 0;
    margin-top: 15px;
}

#address_modify_btn_wrap > button {
    width: 49%;
    height: 45px;
    background-color: #F0F3F7;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 5px;
    color: #9E9E9E;
}

#address_modify_btn_wrap > button.submit {
    color: #ffffff;
    background-color: #151A43;
}


#modal-address > div > .modal-content > .modal-body {
    padding: 0 !important;
}

#modal-address > div > .modal-content > .modal-body > .close {
    top: -10px;
    right: -10px;
}

#modal-address > div > .modal-content > .modal-body h3 {
    font-size: 24px;
    font-weight: 400 !important;
}

#modal-address > div > .modal-content > .modal-body .row {
    width: 100% !important;
    -webkit-box-align: start !important;
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}

#modal-address > div > .modal-content > .modal-body .row > div {
    padding: 0 !important;
}

#modal-address > div > .modal-content > .modal-body .row.search-address > div {
    max-width: 49%;
}

#modal-address > div > .modal-content > .modal-body .row.search-address > div:first-child {
    margin-right: 2%;
    margin-bottom: 0;
}

#modal-address > div > .modal-content > .modal-body .row.search-address > div:last-child {
    margin-bottom: 10px;
}

#modal-address > div > .modal-content > .modal-body .row.address-button > div {
    max-width: 49%;
}

#modal-address > div > .modal-content > .modal-body .row.address-button > div:first-child {
    margin-right: 2%;
}

#modal-address > div > .modal-content > .modal-body .row.address-button > div > .btn {
    border: 1px solid rgba(33, 33, 33, 0.17);
}

#major-apply-modal .modal-dialog {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}

#major-apply-modal .modal-content {
    position: relative;
    width: 500px !important;
}

.major-apply-modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    cursor: pointer;
}

#major-apply-modal h2 {
    font-size: 20px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 20px;
}

#major-apply-modal .major-apply-modal-cnt {
    padding: 15px;
    background-color: #f9f9f9;
    border: 1px solid #dedede;
}

#major-apply-modal .major-apply-modal-cnt > ul > li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 5px;
}

#major-apply-modal .major-apply-modal-cnt > ul > li > span {
    display: inline-block;
    width: 4%;
    height: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#major-apply-modal .major-apply-modal-cnt > ul > li > p {
    display: inline-block;
    width: 96%;
    font-size: 14px;
    line-height: 1.4em;
    color: #484848;
}

#major-apply-modal .major-apply-modal-cnt > ul > li:last-child > p {
    color: #173b7d;
}

#major-apply-modal .major-apply-modal-cnt > ul > li:last-child > p > span {
    text-decoration: underline;
    font-weight: 500;
}

.major-apply-modal-check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 15px 0 10px 0;
}

.major-apply-modal-check > input {
    display: none;
}

.major-apply-modal-checkbox + label {
    position: relative;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0;
}

.major-apply-modal-checkbox + label > div {
    width: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0;
}

.major-apply-modal-checkbox + label > strong {
    width: auto !important;
    display: inline-block;
    font-weight: 400;
    line-height: 1.2em;
}

.major-apply-modal-checkbox + label > div > span {
    display: inline-block;
    vertical-align: text-top;
    width: 18px;
    height: 18px;
    background: #ffffff;
    border: 1px solid #9d9d9d;
}

.major-apply-modal-checkbox:checked + label > div > span:after {
    content: '';
    position: absolute;
    left: 3px;
    top: 7px;
    background: #000000;
    width: 2px;
    height: 2px;
    -webkit-box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.major-apply-modal-checkbox:checked + label strong {
    color: #000000;
}

.major-apply-modal-checkbox:checked + label > div > span {
    border-color: #000000;
}

.major-apply-modal-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
}

.major-apply-modal-btn > button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 40px;
    width: 160px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #000000;
    color: #ffffff;
    font-weight: 500;
}

.major-apply-modal-btn > button:first-child {
    margin-right: 10px;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    color: #000000;
}


@media (max-width: 530px) {
    #major-apply-modal .modal-content {
        width: 400px !important;
    }
}

@media (max-width: 530px) {
    #major-apply-modal .modal-content {
        width: 350px !important;
    }
}


/*작품 리스트 섹션 정렬*/
.nav > .nav-item {
    padding-left: 0;
}

@media (max-width: 768px) {
    .modal.show .modal-dialog{
        margin: auto;
        padding: 0 20px;
    }

    .section-align > div:first-child {
        width: 100% !important;
        padding-right: 0;
    }

    .btn-group.list-btn-wrap {
        position: relative;
        top: 0;
        left: 0;
        z-index: 90;
        width: 100%;
        overflow-x: auto;
    }

    /* 11월3일수정 */
    .row.section-align {
        position: absolute;
        left: 0;
        width: 100%;
    }

    .card-default-search-area {
        padding-top: 100px;
    }

    .btn-group.list-btn-wrap > ul {
        -ms-flex-wrap: initial;
        flex-wrap: initial;
        white-space: nowrap;
        padding: 0 5px 5px 21px;
    }

    .list-btn-wrap > ul > li > a {
        font-size: 14px;
    }
}


/*위시리스트 하트 크기 조절*/
.heartic.ic {
    width: 24px;
    height: 24px;
}

.heartic.ic > i {
    font-size: 14px;
}
.heartic.ic > i.fas{
    color: #F76E33;
}

/*3월30일수정*/
/*모달팝업*/
.modal-show-popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

/*파일선택시 모달창*/
#modal-document-evidence {
    display: none;
}

.modal .modal-dialog.resize{
    max-width: 690px;
    width: 95%;
}

.modal-show-popup > div {
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
}


.modal-show-popup > div > div {
    background-color: #fff;
}

.modal-bid-noti-desc > ul > li {
    padding-left: 0;
}


.modal-gradient-arrow {
    display: none;
    position: absolute;
    top: 61px;
    right: 0px;
    width: 38px;
    height: 90px;
    background: -webkit-gradient(linear, right top, left top, from(white), color-stop(70%), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, white, 70%, rgba(255, 255, 255, 0));
    background: linear-gradient(to left, white, 70%, rgba(255, 255, 255, 0));
    z-index: 93;
}

.modal-gradient-arrow > i {
    position: absolute;
    top: 50%;
    right: 3px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #666666;
}


@media (max-width: 750px) {
    .modal-document-evidence .modal_wrap{
        margin: 0 auto;
    }

    #modal-bid-noti > div > div{
        width: 550px !important;
    }

    .modal-bid-noti-table {
        width: 100%;
        margin-top: 20px !important;
        overflow-x: scroll;
    }

    .modal-bid-noti-desc {
        padding: 0 !important;
        margin: 20px 0 !important;
    }
}

@media (max-width: 595px) {
    #modal-bid-noti > div > div{
        width: 450px !important;
    }

    .modal-bid-noti-desc > ul > li {
        font-size: 10px !important;
        line-height: 1.8em !important;
    }
}

@media (max-width: 390px) {
    #modal-bid-noti > div > div,
    #modal-document-evidence > div > div {
        width: 340px !important;
    }
}


/*공지사항. 언론보도, 채용공고 테이블*/
.data-table {
    width: 100% !important;
}

.data-table thead th:nth-child(1),
.data-table tbody td:nth-child(1) {
    text-align: center;
    white-space: nowrap;
}


/*3월30일수정*/
.on {
    display: block !important;
}

.block {
    display: block;
}

.yhidden {
    overflow-y: hidden !important;
    height: 100% !important;
    min-height: 100%;
    touch-action: none !important;
    -ms-touch-action: none !important;
}

.dc-evidence {
    position: relative;
    cursor: pointer;
}

.dc-evidence:hover > div {
    display: block;
}

.dc-evidence > div {
    display: none;
    position: absolute;
    left: 0;
    bottom: 35px;
    background-color: #fff;
    -webkit-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 1px 7px;
    box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 1px 7px;
    padding: 15px 20px;
    z-index: 15;
}

.dc-evidence > div:after {
    content: "";
    position: absolute;
    bottom: -17px;
    left: 50%;
    -webkit-box-shadow: rgb(0 0 0 / 15%) 3px 4px 5px;
    box-shadow: rgb(0 0 0 / 15%) 3px 4px 5px;
    -moz-transform: rotate(45deg) translateX(-50%);
    -webkit-transform: rotate(45deg) translateX(-50%);
    border-width: 10px;
    border-style: solid;
    border-color: transparent #FFF #FFF transparent;
}

.dc-evidence > div > h5 {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4em;
    color: #666666;
    margin-bottom: 15px;
}

.dc-evidence > div > p {
    font-size: 14px;
    line-height: 1.4em;
    color: #666666;
}

.dc-evidence > div > ul {
    margin: 10px 0;
}

.dc-evidence > div > ul > li {
    font-size: 12px;
    line-height: 1.4em;
    color: #666666;
}

.dc-evidence > div > span {
    display: inline-block;
    font-size: 14px;
    line-height: 1.4em;
    color: #666666;
    margin-bottom: 10px;
}


@media (max-width: 498px) {
    .dc-evidence > div {
        bottom: 55px;
    }
}


/*낙찰결과통보 CSS*/
.bid-result-notice {
    padding: 15px 20px 15px 20px !important;
}

.bid-result-notice > .card-title {
    margin-bottom: 5px !important;
}

.bid-result-notice > .card-title > label {
    margin-bottom: 0;
}

.bid-result-notice > ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    position: relative;
}

.bid-result-notice > ul > li {
    line-height: initial;
}

.bid-result-notice > ul > li:last-child {
    position: absolute;
    right: 0;
    bottom: 0;
}

.bid-result-notice > ul > li:last-child > a {
    padding: 10px 40px !important;
}

@media (max-width: 590px) {
    .bid-result-notice > ul {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .bid-result-notice > ul > li:first-child {
        margin-bottom: 10px;
        font-size: 12px !important;
    }

    .bid-result-notice > ul > li:last-child {
        position: relative;
    }
}


/*점검페이지 CSS*/
#inspection {
    width: 100vw;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    background: url("../img/bg/major.png") no-repeat center center;
    background-size: cover;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px;
}

#inspection > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#inspection > div > h2 {
    font-size: 30px;
    color: #fff;
}

#inspection > div > h1 {
    font-size: 40px;
    margin-bottom: 60px;
}

#inspection > div > p {
    font-size: 14px;
    text-align: center;
    font-weight: 300;
    margin-bottom: 40px;
    word-break: keep-all;
}

#inspection > div > div {
    padding: 20px 40px;
    background-color: rgba(255, 255, 255, 0.2);
    margin-bottom: 20px;
}

#inspection > div > div > p {
    font-size: 16px;
    line-height: 1.8em;
}

#inspection > div > div > p > span {
    display: inline-block;
    margin-right: 20px;
}

@media (max-width: 590px) {
    #inspection > div > h1 {
        font-size: 35px;
        margin-bottom: 40px;
    }

    #inspection > div > h2 {
        font-size: 25px;
    }

    #inspection > div > div > p {
        font-size: 14px;
    }

    #inspection > div > div {
        padding: 20px 30px;
    }
}

@media (max-width: 420px) {
    #inspection > div > h1 {
        font-size: 30px;
        margin-bottom: 40px;
    }

    #inspection > div > h2 {
        font-size: 20px;
    }
}

@media (min-width: 1200px) {
    .nav-dropmenu-item {
        border: none !important;
    }
}


.row.not-pad {
    margin-left: 0;
    margin-right: 0;
}

.zChanege {
    z-index: 440;
}


/*로딩 애니메이션*/
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#loader-1 {
    -webkit-animation: spin 0.8s infinite linear;
    animation: spin 0.8s infinite linear;
}


/*리스트페이지 스크롤 상하버튼*/
#list-scrollbtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 9px;
    z-index: 93;
    cursor: pointer;
}

#list-scrollbtn > img {
    display: block;
    max-width: 100%;
}


@media (max-width: 768px) {
    #list-scrollbtn {
        right: 15px;
    }

    #list-scrollbtn > img {
        width: 36px;
        height: auto;
    }
}

.notice-fix {
    display: inline-block;
    background-color: #f44e05;
    font-size: 11px;
    color: #fff;
    padding: 2px 5px;
    border-radius: 3px;
}


/*이미지 뷰어*/
.viewer-list {
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important;
}

.viewer-navbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}


/*마스킹처리 관련 모달팝업*/
.modal-document-evidence .modal-dialog{
    max-width: 690px;
}

#modal-document-evidence > div > div {
    position: relative;
    padding: 24px 30px 30px;
    background-color: #fff;
    width: 450px;
    box-sizing: border-box;
    border-radius: 5px;
}

.modal-document-evidence > div > div > .modal-evidence-close {
    position: absolute;
    top: 30px;
    right: 30px;
    cursor: pointer;
    z-index: 1;
}

.modal-document-evidence .modal-content h5{
    color: #252525;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.66px;
    margin-bottom: 24px;
}

.modal-document-evidence .modal-content .top-title{
    position: relative;
}

.modal-document-evidence .modal-content .close{
    width: 24px;
    height: 24px;
    background: url(../img/icons/icon_close_black.png)no-repeat center;
    background-size: cover;
    opacity: 1;
    right: 0;
    top: 6px;
}

#modal-document-evidence .masking-cnt{
    display: block;
}

#modal-document-evidence .masking-cnt p{
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #000;
    margin-bottom: 20px;
}

#modal-document-evidence .masking-cnt p font{
    color: #FF4C00;
}

.modal-document-evidence .masking-tapbtn ul {
    display: block;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 51px;
    border-bottom: 1px solid #efefef;
    padding: 0 5px;
    font-size: 0;
}

#modal-document-evidence .masking-tapbtn ul > li {
    position: relative;
    z-index: 100;
    display: inline-block;
    background-color: #efefef;
    width: 50%;
    height: 50px;
    padding-left: 0;
    border: 1px solid #efefef;
    border-bottom: 0;
    vertical-align: top;
}

#modal-document-evidence .masking-tapbtn ul > li:last-child {
    margin-left: -1px;
}

#modal-document-evidence .masking-tapbtn ul > li > a {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 12px;
    color: #cccccc;
    font-weight: 600;
    word-break: keep-all;
    text-align: center;
    line-height: normal;
}

#modal-document-evidence .masking-tapbtn ul > li.active {
    height: 51px;
    background-color: #ffffff;
    border-bottom: none;
}

#modal-document-evidence .masking-tapbtn ul > li.active > a {
    color: #ff5d16;
}

#modal-document-evidence .masking-desc {
    margin-top: 10px;
    position: relative;
}

#modal-document-evidence .masking-desc > div {
    display: none;
}

#modal-document-evidence .masking-desc > div.active {
    display: block;
}

.modal-document-evidence .masking-desc > div > .masking-desc-01{
    padding: 0 30px;
}

.modal-document-evidence .masking-desc > div > .masking-desc-01 > div > p {
    text-align: center;
    line-height: 1.4em;
    font-weight: 600;
    margin-top: 8px;
}

#modal-document-evidence .masking-desc .masking-desc-01 .img-area{
    max-width: 289px;
}

#modal-document-evidence .masking-desc .masking-desc-01 .img-area a{
    display: block;
}

#modal-document-evidence .masking-desc .masking-desc-01 .img-area img{
    width: 100%;
}

#modal-document-evidence .masking-desc .masking-desc-01 .img-area:hover .scale{
    z-index: 0;
    opacity: 1;
    transition: all 0.5s;
}

#modal-document-evidence .masking-desc > div > .masking-desc-01 > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

#modal-document-evidence .masking-desc .masking-desc-01 .driver-licence-img{
    display: none;
}

#modal-document-evidence .masking-desc .masking-desc-01 li{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0;
    text-align: center;
    position: relative;
}

#modal-document-evidence .masking-desc .masking-desc-01 li:first-child{
    margin-bottom: 48.13px;
}

#modal-document-evidence .masking-desc .masking-desc-01 li label{
    margin-bottom: 6px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    text-align: center;
    color: #000000;
    cursor: pointer;
}

#modal-document-evidence .masking-desc .masking-desc-01 li input{
    width: 15.34px;
    height: 15.34px;
    border-radius: 100%;
    appearance: none;
    border: 1px solid #aeaeb2;
    position: relative;
    cursor: pointer;
}

#modal-document-evidence .masking-desc .masking-desc-01 li input:checked {
    background: #0A7AFF;
    border: none;
    position: relative;
}

#modal-document-evidence .masking-desc .masking-desc-01 li input:checked::after{
    content:'✔';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -49%);
    font-size: 10px;
    text-align: center;
    color: #fff;
  }

#modal-document-evidence .document-evidence-noti li{
    font-size: 13px;
    line-height: 16px;
    color: #000000;
    position: relative;
    padding-left: 13px;
}

.modal-document-evidence .document-evidence-noti{
    padding-left: 30px;
}

#modal-document-evidence .document-evidence-noti li:first-child{
    margin-top: 13px;
    margin-bottom: 5px;
}

#modal-document-evidence .document-evidence-noti li::after{
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 3px;
    height: 3px;
    border-radius: 100%;
    background: #000;
}

.modal-document-evidence .document-evidence-btn{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
}

.modal-document-evidence .document-evidence-btn > a{
    width: 150px;
    background-color: #000;
    color: #fff;
    height: 40px;
    text-align: center;
    line-height: 40px;
    display: block!important;

}

#modal-document-evidence .document-evidence-btn > a img{
    width: 15.5px;
    margin-right: 5px;
}

#modal-document-evidence .document-evidence-btn span{
    font-weight: 400;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    color: #505050;
    display: block;
    margin-top: 8px;
}

#modal-document-evidence .masking-desc > div > .masking-desc-02{
    text-align: center;
    max-width: 289px;
    position: relative;
    margin: auto

}

#modal-document-evidence .masking-desc > div > .masking-desc-02 img{
    width: 100%;
}

#modal-document-evidence .masking-desc > div > .masking-desc-02:hover .scale{
    opacity: 1;
    z-index: 0;
    transition: all 0.5s;
}

#modal-document-evidence .masking-desc .scale{
    position: absolute;
    bottom: 10px;
    right: 7px;
    width: 37px!important;
    opacity: 0;
    z-index: -1;
    transition: all 0.5s;
}

#modal-document-evidence .masking-desc .scale img{
    width: 100%;
}

.modal-document-evidence .masking .masking-noti{
    border-radius: 6px;
    background: #FCF2EE;
    padding: 15px 24px;
    position: relative;
    margin-bottom: 15px;
}

.modal-document-evidence .masking p{
    padding-left: 20px;
    color: #4E4E4E;
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.42px;
    width: 100%;
}

.modal-document-evidence .masking p:first-child{
    margin-bottom: 3px;
}

.modal-document-evidence .masking p::after{
    content: '!';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 16px;
    height: 16px;
    line-height: 16px;
    border-radius: 100%;
    background: #F76E33;
    text-align: center;
    color: #fff;
}

.modal-document-evidence .masking font{
    color: #FF4C00;
}

.modal-document-evidence .masking-tool{
    width: 100%;
    padding: 15px 0;
}

.modal-document-evidence .masking-tool li{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.modal-document-evidence .masking-tool li > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
}

.modal-document-evidence .masking-tool div a{
    color: #868686;
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.42px;
}

.modal-document-evidence .masking-tool .icon{
    display: inline-block;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    vertical-align: middle;
    margin-left: 5px;
}

.modal-document-evidence .masking-tool .sample-btn .icon{
    background-image: url(../img/icons/icon_see.png);
}

.modal-document-evidence .masking-tool .sample-btn.on{
    color: #FF5912;
}

.modal-document-evidence .masking-tool .sample-btn.on i{
    background-image: url(../img/icons/icon_see_on.png) 
}

.modal-document-evidence .masking-tool .sample-btn.on{
    color: #FF5912;
}

.modal-document-evidence .masking-tool .sample-btn.on i{
    background-image: url(../img/icons/icon_see_on.png) 
}

.modal-document-evidence .masking-tool .file-select{
    margin-left: 30px;
}

.modal-document-evidence .masking-tool .file-select .icon{
    background-image: url(../img/icons/icon_upload.png);
}

.modal-document-evidence .masking-tool .file-select:hover{
    color: #FF5912;
}

.modal-document-evidence .masking-tool .file-select:hover .icon{
    color: #FF5912;
    background-image: url(../img/icons/icon_upload_on.png);
}

.modal-document-evidence .masking-tool a.reset{
    padding: 0 15px;
    width: 54px;
    height: 32px;
    line-height: 32px;
    border-radius: 4px;
    background-image: url(../img/icons/icon_reset.png);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
}

.modal-document-evidence .masking-tool a.reset:hover{
    background-color: #F3F3F3;
    /* background-image: url(../img/icons/icon_reset_on.png); */
}

.modal-document-evidence .masking-tool .editor_btn {
    padding: 4px 15px;
    border-radius: 4px;
    margin-left: 5px;
}

.modal-document-evidence .masking-tool .editor_btn img{
    width: 24px;
}

.modal-document-evidence .masking-tool .editor_btn:hover{
    background: #F3F3F3;
}

.modal-document-evidence .masking-tool .editor_btn.on{
    background: #F76E33;
}

.modal-document-evidence .masking-tool .editor_btn.on img{
    -webkit-filter: brightness(0) invert(1); 
    filter: brightness(0) invert(1);
}

.modal-document-evidence .tooltip{
    top: -60px;
    left: 60px;
    width: 152px;
    position: absolute;
    background-color: #7a7a7a;
    color: #fff;
    font-size: 12px;
    padding: 8px 10px;
    border-radius: 6px;
    line-height: 1.4;
    opacity: 1;
    animation: hideElement 3s linear forwards;
}

.modal-document-evidence .tooltip::after{
    content: "";
    width: 0px;
    height: 0px;
    display: block;
    position: absolute;
    left: 10%;
    bottom: -14px;
    border-bottom: 7px solid #7a7a7a;
    border-right: 7px solid rgba(0, 0, 0, 0);
    border-left: 7px solid rgba(0, 0, 0, 0);
    border-top: 7px solid rgba(0, 0, 0, 0);
    transform: rotate(-180deg);
} 

@keyframes hideElement {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        display: none;
    }
}

.modal-document-evidence .img-wrap{
    position: relative;
    border-radius: 10px;
    border: 1px solid #EAEAEA;
    background: #F9F9F9;
    overflow: hidden;
    width: 100%;
}

.modal-document-evidence .masking-tool .reset img{
    width: 24px;
}

.modal-document-evidence .upload-img{
    width: 100%;
    height: 470px;
    position: relative;
}

.modal-document-evidence .upload-img > div{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-document-evidence .masking-wrap{
    display: inline-block;
    text-align: center;
    position: relative;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    /* z-index: 2; */

}

.modal-document-evidence .masking-wrap img{
    max-width: 100%;
    max-height: 100%;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
}

.modal-document-evidence .upload-img > img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 100%;
    max-height: 100%;
}

.modal-document-evidence .img-wrap ul{
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    height: 100%;
    overflow-y: auto;
    padding: 10px 0;
}

.modal-document-evidence .img-wrap li{
    color: #868686;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.48px;
    padding: 0 40px 0 55px;
    margin-bottom: 15px;
    text-indent: -15px;
    font-size: 16px;
}

.modal-document-evidence .img-wrap li i{
    display: inline-block;
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    vertical-align: middle;
}

.modal-document-evidence .img-wrap li:nth-child(2) i{
    background-image: url(../img/icons/icon_editor.png);
}

.modal-document-evidence .img-wrap li:nth-child(3) i{
    background-image: url(../img/icons/icon_reset.png);
}

.modal-document-evidence .img-wrap li:nth-child(4){
    margin-bottom: 0;
}

.modal-document-evidence .img-wrap li:last-child{
    margin-top: 20px;
    margin-bottom: 0;
    padding: 0;
    text-indent: 0;
    position: relative;
}

.modal-document-evidence .img-wrap li:last-child a{
    display: block;
    background: #eaeaea;
    width: 160px;
    height: 52px;
    line-height: 50px;
    text-align: center;
    border-radius: 4px;
    color: #4e4e4e;
    margin: auto;
}

.modal-document-evidence .img-wrap li:last-child a:hover{
    background: #D7D7D7;
}

.modal-document-evidence .img-wrap li img{
    width: 24px;
}

.modal-document-evidence .upload-img .sample-img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%, -50%);
    max-width: 100%;
    max-height: 100%;
    display: none;
}

.modal-document-evidence .upload-img.on::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f9f9f9;
    z-index: 1;
}

.modal-document-evidence .upload-img.on .sample-img{
    display: block;
    z-index: 2;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
}

.modal-document-evidence .upload-img .icon{
    width: 24px;
}

.modal-document-evidence .upload-img span{
    display: block;
    text-align: center;
}

.modal-document-evidence .upload-img i{
    display: block;
    font-style: normal;
    color: #252525;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.48px;
}

.modal-document-evidence .upload-img a {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
}

.modal-document-evidence .highlighter {
  background-color: #F76E33;
  position: absolute;
}

.modal-document-evidence .document-evidence-btn{
    width: 100%;
}

.modal-document-evidence .document-evidence-btn .submit-btn{
    border-radius: 4px;
    background-color: #EAEAEA;
    height: 56px;
    line-height: 55px;
    pointer-events: none;
    font-weight: 600;
    width: 100%;
}

.modal-document-evidence .document-evidence-btn .submit-btn.on{
    background: #101B4D;
    pointer-events: auto;
}

#modal-document-evidence > div > div{
    width: 690px;
}

.modal-document-evidence .img-wrap.biz .upload-img{
    height: 850px;
}

/* 마스킹 팝업 PC */
.self-auth-popup > .modal_wrap{
    max-width: 1200px;
    width: 100%;
}

.self-auth-popup #modal-document-evidence .modal-dialog{
    align-items: start;
}

.self-auth-popup.modal .modal-content{
    height: calc(100% - 120px);
    height: -webkit-calc(100% - 120px);
    height: -moz-calc(100% - 120px);
    height: -o-calc(100% - 120px);
    padding: 0;
}

#modal-document-evidence.mask-pc > div > div.modal-content{
    max-width: 1200px;
    width: 100%;
    height: calc(100% - 120px);
    height: -webkit-calc(100% - 120px);
    height: -moz-calc(100% - 120px);
    height: -o-calc(100% - 120px);
    padding: 0;
}

.self-auth-popup #modal-document-evidence.mask-pc > div > div.modal-content{
    height: 100%;
}

.modal-document-evidence.mask-pc .modal-dialog{
    max-width: 1200px;
}

.mask-pc.modal.fade .modal-content > div.masking{
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: space-between;
    height: 100%;
}

.mask-pc .masking > div{
    display: flex;
    align-items: start;
    height: 100%;
}

.mask-pc .masking .mo{
    display: none!important;
}

.mask-pc .masking .pc.img-wrap{
    height: 100%;
    width: 62%;
    overflow: auto;
}

.mask-pc .img-wrap{
    position: static;
    border-radius: 0;
    border: none;
    background: none;
    overflow: inherit;
}

.mask-pc .upload-img.on::after{
    display: none;
}

.mask-pc .upload-img.on .sample-img{
    position: static;
    transform: translate(0);
    display: block!important;
}

.modal-document-evidence.mask-pc .upload-img .sample-img{
    display: block!important;
    border-radius: 4px;
}

.mask-pc .masking ul{
    position: static;
    transform: translate(0)!important;
    display: block!important;
    padding-top: 20px;
    padding-bottom: 0;
}

.mask-pc .document-evidence-btn{
    margin-top: 0;
}

.mask-pc .upload-img{
    width: 100%;
    height: 100%!important;
    padding: 0;
}

.mask-pc .upload-img .masking-wrap{
    top: 0%;
    transform: translate(-50%, 0%);
    border-radius: 4px;
    background: #F9F9F9;
    align-items: start;
    height: auto;
}

.mask-pc .mask-info{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    width: calc(100% - 62%);
    width: -webkit-calc(100% - 62%);
    width: -moz-calc(100% - 62%);
    width: -o-calc(100% - 62%);
    padding: 20px 30px 30px;
}

.mask-pc .masking .text-area{
    overflow: hidden;
    overflow-y: auto;
}

.mask-pc .masking .masking-noti{
    padding: 11px 12px 11px 12px!important;
    margin-top: 8px;
    margin-bottom: 10px;
    border-radius: 4px;
}

.mask-pc .modal-content h5{
    text-align: left;
    margin-bottom: 20px;
    position: relative;
}

.mask-pc .mask-info .sample-img{
    width: 100%;
    position: static;
    transform: translate(0);
}

.mask-pc .mask-info li{
    padding-left: 0;
    color: #868686;
    font-size: 14px;
    line-height: normal;
    letter-spacing: -0.42px;
    margin-bottom: 6px;
    text-indent: 0;
}

.mask-pc .mask-info li i {
    display: inline-block;
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    vertical-align: middle;
}

.mask-pc .mask-info li:nth-child(2) i {
    background-image: url(../img/icons/icon_editor.png);
}

.mask-pc .mask-info li:nth-child(3) i {
    background-image: url(../img/icons/icon_reset.png);
}

.mask-pc .masking-tool{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 10px 0;
}

.mask-pc .masking-tool a{
    display: flex;
    align-items: center;
    justify-content: center;
    color: #252525;
    text-align: center;
    font-family: "Noto Sans KR";
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.48px;
    border-radius: 4px;
    border: 1px solid #EAEAEA;
    background: #FFF;
}

.mask-pc .masking-tool a:hover{
    border: 1px solid #4E4E4E;
}

.mask-pc .masking-tool i{
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left center;
    margin-right: 6px;
}

.mask-pc .masking-tool .file-select{
    width: 31.8%;
    padding: 0 0;
    height: 46px;
    background-image: none;
    margin-left: 0;   
}

.mask-pc .masking-tool .file-select:hover{
    color: #252525;
}

.mask-pc .masking-tool a.reset{
    width: 31.8%;
    padding: 0 ;
    height: 46px;
    background-image: none;
}

.mask-pc .masking-tool a.reset:hover{
    background-color: transparent;
}

.mask-pc .masking-tool .editor_btn{
    width: 31.8%;
    height: 46px;
    margin-left: 0px;
    margin-right: 0;
}

.mask-pc .masking-tool a.editor_btn:hover{
    background-color: transparent;
}

.mask-pc .document-evidence-btn .submit-btn{
    width: 100%;
    font-size: 16px;
    height: 52px;
    line-height: 51px;
}

.mask-pc .masking-tool .file-select .icon{
    background-image: url(../img/icons/icon_file_bk.png);
}

.mask-pc .masking-tool .file-select:hover .icon{
    background-image: url(../img/icons/icon_file_bk.png);
}

.mask-pc .masking-tool .reset i{
    background-image: url(../img/icons/icon_reset_bk.png);
}

.mask-pc .masking-tool .editor_btn i{
    background-image: url(../img/icons/icon_editor_bk.png);
}

.mask-pc .masking-tool .editor_btn.on{
    background-color: transparent;
    border-radius: 4px;
    border: 2px solid #F76E33;
    color: #F76E33;
    display: flex!important;
}

.mask-pc .masking-tool .editor_btn.on i{
    background-image: url(../img/icons/icon_editor_orange.png);
}

.mask-pc .upload-img > div:last-child{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
}

.mask-pc .upload-img span{
    color: #868686;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.48px;
}

.mask-pc .upload-img .file-select{
    width: 160px;
    height: auto;
    border-radius: 4px;
    background: #EAEAEA;
    height: 52px;
    padding: 5px 16px;
    color: #4E4E4E;
    text-align: center;
    font-family: "Noto Sans KR";
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.48px;
    margin-top: 20px;
}

@media (max-width: 450px) {
    #modal-document-evidence h5 {
        font-size: 16px !important;
        margin-bottom: 15px;
        line-height: 20px;
    }

    #modal-document-evidence > div > div > p {
        font-size: 12px !important;
    }

    #modal-document-evidence .masking-desc > div > .masking-desc-01 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    #modal-document-evidence .document-evidence-noti li{
        padding-left: 10px;
    }

    #modal-document-evidence .document-evidence-noti li::after{
        left: 2px;
    }

    #modal-document-evidence .masking-desc > div > .masking-desc-01 > div:first-child {
        margin-right: 0;
        margin-bottom: 12px;
    }

    #modal-document-evidence .masking-desc .masking-desc-01 .img-area{
        max-width: 210px;
    }

    #modal-document-evidence .masking-desc .masking-desc-01 li:first-child{
        margin-bottom: 28px;
    }

    .modal-document-evidence .upload-img{
        height: 290px!important;
    }

    .modal-document-evidence .img-wrap li{
        margin-bottom: 5px;
        font-size: 12px!important;
        padding-left: 25px!important;
        text-indent: -15px!important;
        padding-right: 10px!important;
    }

    .modal-document-evidence .img-wrap li:nth-child(4){
        margin-bottom: 15px;
    }

    .modal-document-evidence .img-wrap li:last-child a{
        width: 100px;
        height: 30px;
        line-height: 30px;
    }

    .modal-document-evidence .img-wrap li:last-child{
        text-indent: 0!important;
        padding: 0!important;
    }

    .modal-document-evidence .img-wrap.biz .upload-img {
        height: 100%!important;
    }
}


/*신청서 css*/
.applyform {
    position: relative;
    height: 120px;
    background-color: #f9f9f9 !important;
    margin-bottom: 40px;
}

.applyform > h1 {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 20px;
    font-weight: 700;
    color: #333333;
    white-space: nowrap;
}

.written-call-apply {
    width: 835px;
    margin: 0 auto;
}

.written-call-apply > div {
    margin-bottom: 80px;
}

.written-call-apply > div > h5 {
    font-size: 16px;
    color: #333333;
    font-weight: 600;
    line-height: 1.4em;
    margin-bottom: 12px;
}

.apply-table {
    width: 100%;
    border-collapse: collapse;
}

.apply-table tr:first-child {
    border-top: 1px solid #666666;
}

.apply-table tr > td:first-child {
    width: 25%;
    padding: 10px 10px 10px 30px;
    background-color: #f9f9f9;
    color: #333333;
}

.apply-table tr > td:last-child {
    width: 75%;
    padding: 10px 30px;
    color: #666666;
}

.apply-table tr > td {
    border-bottom: 1px solid #efefef;
}


.apply-table tr > td > .write-info-img {
    width: 100%;
    height: 248px;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #f9f9f9;
}

.apply-table tr > td > .write-info-img > img {
    max-height: 100%;
    max-width: 100%;
}

.apply-table tr > td > div > p {
    color: #666666;
    line-height: 1.4em;
}

.apply-table tr > td > div > span {
    font-size: 12px;
}

#price_bid {
    width: 100%;
    padding: 5px 10px;
    font-family: inherit;
    background: url('../img/icons/schedule-img.png') no-repeat 98% 50%;
    border: 1px solid #999;
    border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-weight: 500;
}

#price_bid option {
    font-weight: 500;
}

.apply-btn {
    margin-top: 60px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.apply-btn > a {
    display: block;
    width: 215px;
    height: 48px;
    line-height: 48px;
    text-align: center;
}

.apply-btn > a:first-child {
    margin-right: 20px;
    border: 1px solid #666666;
    background-color: #ffffff;
    color: #000000;
}

.apply-btn > a:last-child {
    background-color: #333333;
    color: #ffffff;
}

#price_bid {
    width: 100%;
    padding: 5px 10px;
    font-family: inherit;
    background: url('../img/icons/schedule-img.png') no-repeat 98% 50%;
    border: 1px solid #999;
    border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-weight: 500;
    color: #666666;
}

#price_bid option {
    font-weight: 500;
}


#artist-label {
    position: relative;
}

#artist-label label {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 4px;
    cursor: text;
    color: #c4c4c4;
}

.sizeinfo > div {
    position: relative;
    display: inline-block;
    font-size: 0;
    margin-bottom: 5px;
}

.sizeinfo > div > label {
    position: absolute;
    top: 50%;
    left: 3px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #c4c4c4;
}

.sizeinfo > span {
    display: inline-block;
    padding: 0 5px;
    color: #c4c4c4;
}

.sizeinfo > .size {
    width: 60px;
}

.sign-agree > ul > li {
    margin-bottom: 10px;
    color: #333333;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.sign-agree > ul > li > div:first-child {
    margin-right: 10px;
}

.sign-agree {
    border: none;
    border-top: 1px solid #666666;
}

.all-agree-check > .realchk > label {
    color: #333333;
}

.all-agree-check > .realchk > label {
    font-weight: 400;
}

.realchk > label {
    color: #333333;
}

.conapply-text {
    padding: 5px;
}

/* IE10 이상을 위한 css */
.conapply-text::-webkit-input-placeholder {
    color: #c4c4c4;
    opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */
}

.conapply-text::-moz-placeholder {
    color: #c4c4c4;
    opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */
}

.conapply-text:-ms-input-placeholder {
    color: #c4c4c4;
    opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */
}

.conapply-text::-ms-input-placeholder {
    color: #c4c4c4;
    opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */
}

.conapply-text::placeholder {
    color: #c4c4c4;
    opacity: 1; /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */
}

.conapply-text::-webkit-input-placeholder,
.conapply-text:-ms-input-placeholder,
.conapply-text:-mos-input-placeholder {
    color: #c4c4c4;
}

td > .auc-choice > div {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 6px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

td > .auc-choice > div > input {
    margin-right: 3px;
}

td > .auc-choice > div > label {
    margin-bottom: 0;
}


@media (max-width: 950px) {
    .written-call-apply {
        width: 100%;
    }
}


@media (max-width: 768px) {
    .written-call-apply {
        width: 100%;
    }

    .applyform > h1 {
        font-size: 18px;
        margin-top: 10px;
    }

    .apply-table tr > td {
        font-size: 12px;
        word-break: keep-all;
    }

    .apply-table tr > td:first-child {
        width: 30%;
        padding: 10px 10px 10px 15px;
    }

    .apply-table tr > td:last-child {
        width: 70%;
    }

    .apply-table tr > td:last-child {
        padding: 10px 15px;
    }

    .apply-table tr > td > .write-info-img {
        height: 200px;
    }

    #price_bid {
        font-size: 12px;
    }

    .sign-agree > ul > li {
        font-size: 12px;
        line-height: 1.8em;
    }

    .all-agree-check > .realchk > label {
        font-size: 14px;
    }

    .all-agree-check > .realchk > label > span {
        margin: -6px 5px 0 0 !important;
    }

    #artist-label label,
    .material-ch,
    .sizeinfo > div > label,
    .conapply-text {
        font-size: 12px;
    }

    .breadcrumb .breadcrumb-item {
        font-size: 10px;
    }

    td > .auc-choice > div > label {
        font-size: 12px;
    }
}


.essential > span {
    position: relative;
}

.essential > span:after {
    position: absolute;
    top: 2px;
    right: -12px;
    content: "*";
    font-size: 16px;
    color: #D83C31;
}


.board-container {
    margin-top: 100px;
    margin-bottom: 100px;
}

.notice-table {
    width: 100% !important;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #cccccc;
}

.board-wrap {
    position: relative;
    padding-top: 30px;
}

.tatalarea {
    font-size: 15px;
    position: absolute;
    top: 0;
    left: 15px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
}

#DataTables_Table_0_info {
    display: none !important;
}

.tatalarea > span {
    font-size: 15px;
    color: #173B70;
    font-weight: 700;
}

.notice-table th,
.notice-table td {
    padding: 16px 0;
}

.notice-table th {
    text-align: center;
    font-weight: 400;
}

.notice-table td {
    border-top: 1px solid #cccccc;
    color: #555555;
    text-align: center;
}

.notice-table td.td_title {
    text-align: left;
}

.notice-table td.td_title > div {
    display: none;
}

.notice-table td > a {
    color: #555555;
}

.notice-table td .tddate,
.notice-table td .mediaCompany {
    font-size: 12px;
}

.notice-table td .tddate > i,
.notice-table td .mediaCompany > i {
    margin-right: 6px;
}

.notice-table td .mediaCompany {
    margin-right: 12px;
}


@media (max-width: 768px) {
    .board-container {
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .notice-table td.td_title > div {
        display: inline-block;
    }

    .tatalarea {
        left: 25px;
    }

    .notice-table th:last-child,
    .notice-table td:last-child {
        display: none;
    }

    .notice-table th:first-child,
    .notice-table td:first-child {
        width: 100px;
    }

    /*6월23일수정*/
    .notice-table td > a {
        display: inline-block;
        width: 98%;
        overflow: hidden;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    td.media-company-cnt,
    th.media-company {
        display: none;
    }
}


@media (max-width: 540px) {

    .data-table thead th:nth-child(1),
    .data-table tbody td:nth-child(1) {
        padding: 16px 16px;
    }

    .notice-table td > a {
        width: 280px;
    }
}


@media (max-width: 445px) {
    .notice-table td > a {
        width: 240px;
    }
}

@media (max-width: 400px) {
    .notice-table td > a {
        width: 200px;
    }
}


/* 6월23일수정 */
/*게시판 세부페이지 css*/
.board-view-tit {
    padding: 20px 20px;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #eeeeee;
    background-color: #f9f9f9;
}

.board-view-tit > h3 {
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 10px;
    word-break: keep-all;
    line-height: 1.4em;
    text-align: center;
}

.board-view-tit > p {
    font-size: 14px;
    color: #666666;
    text-align: center;
}

.board-view-tit > p > span {
    display: inline-block;
    font-weight: 500;
    margin-right: 10px;
}

.board-view-desc {
    padding: 40px 20px;
}

.board-view-desc > p {
    font-size: 16px;
    color: #666666;
    line-height: 1.8em;
}

.MsoNormal > span {
    word-break: break-all
}

.board-view-btn > div {
    padding-top: 40px;
    border-top: 1px solid #eeeeee;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.board-view-btn > div > button {
    height: 40px;
    padding: 0 20px;
    background-color: #ffffff !important;
    color: #333333;
}

.board-view-desc > table.table-bordered {
    width: 100% !important;
}

.board-view-desc > table.table-bordered td:first-child {
    white-space: nowrap;
}

@media (max-width: 768px) {
    .board-view {
        margin-top: 50px !important;
        margin-bottom: 50px !important;
    }

    .board-view-desc {
        padding: 20px;
    }

    .board-view-btn > div {
        padding-top: 20px;
    }
}

@media (max-width: 590px) {
    .board-view-tit > h3 {
        font-size: 20px;
        margin-bottom: 0;
    }

    .board-view-tit > p {
        font-size: 12px;
    }
}


/*로그인창수정하기*/
#modal-login > div > .modal-content > .modal-body > .text-center > h3 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 26px;
    margin-top: 15px;
}

.login-form {
    margin-top: 35px;
}

.loginForm-wrap {
    margin: 0 15px !important;
}

.loginForm-wrap > div {
    width: 100%;
}

.login-form input {
    width: 100%;
    height: 45px;
    line-height: normal;
    font-family: inherit;
    border: 1px solid #cccccc;
    border-radius: 0;
    outline-style: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 1em 1em;
}

.loginForm-bottom {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.loginForm-bottom > div > label,
.loginForm-bottom > div > a {
    font-size: 12px;
    color: #666666 !important;
}

.loginForm-bottom > div > a {
    display: inline-block;
}

.loginForm-bottom > div > a:first-child {
    position: relative;
    padding-right: 20px;
}

.loginForm-bottom > div > a:first-child:after {
    position: absolute;
    top: 50%;
    right: 7px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    width: 1px;
    height: 10px;
    background-color: #666666;
}

.loginForm-bottom > div:first-child > input {
    width: auto !important;
    height: auto !important;
    top: auto;
}

.loginForm-bottom > div:last-child {
    position: absolute;
    top: auto;
    right: 0;
}

.loginForm-wrap > button {
    background-color: #000000 !important;
    margin: 0 !important;
    height: 45px;
}

.loginForm-wrap > button:hover {
    background-color: #000000 !important;
}

.bottom-join {
    margin: 45px 0 !important;
}

.bottom-join > p {
    font-size: 12px;
    color: #666666 !important;
}

.bottom-join > p > a {
    display: inline-block;
    margin-left: 10px;
    color: #333333 !important;
    text-decoration: underline;
}

#modal-login > div > .modal-content > .modal-body > .text-center {
    margin: 18px 0 0 0 !important;
}


/*아이디/비밀번호찾기 css*/
.memberSearch {
    width: 450px;
    padding: 130px 0 150px 0;
    margin: 0 auto;
}

.memberSearch.psSearch {
    padding: 100px 0 120px 0;
}

.memberSearch > h2 {
    font-size: 28px;
    line-height: 1.4em;
    text-align: center;
    padding-bottom: 20px;
    border-bottom: 2px solid #000000;
}


.memberSearch-radiobtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 32px 0 42px 0;
}

.memberSearch-radiobtn > div:first-child {
    margin-right: 30px;
}

.memberSearch-radiobtn > div > label {
    position: relative;
    font-size: 14px;
    margin-bottom: 0;
    padding-left: 30px;
    cursor: pointer;
}

.memberSearch-radiobtn > div > label > span {
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    display: inline-block;
    width: 25px;
    height: 25px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #eeeeee;
    border-radius: 25px;
    cursor: pointer;
}

.memberSearch-radiobtn > div > label > span::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 11px;
    height: 11px;
    border-radius: 11px;
    background-color: #eeeeee;

}

.memberSearch-radiobtn > div input[type=radio]:checked + label span {
    border: 7px solid #000000;
    border-color: #000000;
}

.memberSearch-radiobtn > div input[type=radio]:checked + label span::after {
    display: none;
}

.memberSearch-radiobtn > div.active input[type=radio]
.memberSearch-radiobtn > div:first-child {
    margin-right: 50px;
}

.memberSearch-radiobtn > div input[type=radio] {
    position: absolute;
    visibility: hidden;
}


/*아이디찾기*/
.memberSearch-desc > div {
    display: none;
}

.memberSearch-desc > div.active {
    display: block;
}

.memberSearch-desc input[type="text"],
.memberSearch-password input[type="text"] {
    width: 100%;
    height: 45px;
    line-height: normal;
    font-family: inherit;
    border: 1px solid #cccccc;
    border-radius: 0;
    outline-style: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 1em 1em;
}

.memberSearch-password input[type="tel"] {
    width: 100%;
    height: 45px;
    line-height: normal;
    font-family: inherit;
    border: 1px solid #cccccc;
    border-radius: 0;
    outline-style: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 1em 1em;
}

.memberSearch-password input[type="tel"]::-webkit-input-placeholder {
    color: #ccc;
}

.memberSearch-password input[type="tel"]::-webkit-input-placeholder,
.memberSearch-password input[type="tel"]::placeholder {
    color: #ccc;
}

.formControl:focus {
    border-color: unset;
    background-color: #fff;
    border: 1px solid #F47104 !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: 0 !important;
}


.memberSearch-desc > div > form,
.memberSearch-password > div > form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.memberSearch-desc input[type="text"]::-webkit-input-placeholder, .memberSearch-password input[type="text"]::-webkit-input-placeholder {
    color: #cccccc;
}

.memberSearch-desc input[type="text"]::-moz-placeholder, .memberSearch-password input[type="text"]::-moz-placeholder {
    color: #cccccc;
}

.memberSearch-desc input[type="text"]:-ms-input-placeholder, .memberSearch-password input[type="text"]:-ms-input-placeholder {
    color: #cccccc;
}

.memberSearch-desc input[type="text"]::-ms-input-placeholder, .memberSearch-password input[type="text"]::-ms-input-placeholder {
    color: #cccccc;
}

.memberSearch-desc input[type="text"]::placeholder,
.memberSearch-password input[type="text"]::placeholder {
    color: #cccccc;
}

.memberSearch-desc > div > form > div:first-child {
    margin-bottom: 10px;
}

.memberSearch-desc > div > form > div:last-child {
    margin-top: 35px;
}

.memberSearch-desc > div > form > div button,
.memberSearch-password > div > form > div button {
    width: 100%;
    height: 45px;
    line-height: 45px;
    background-color: #000000;
    color: #ffffff;
}

#phonenum-desc > form > div:nth-child(2),
#password-phonenum-search > form > div:nth-child(3) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.memberSearch form > div .form-cellphone {
    width: 28%; /* 원하는 너비설정 */
    margin-right: 2%;
    font-size: 14px;
    height: 45px;
    border: 1px solid #cccccc;
    padding: 0 0 0 10px;
    border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(../img/icons/schedule-img.png) no-repeat 90% 50%;
}

.memberSearch form > div > input.phonenumBack {
    width: 70%;
    height: 45px;
    line-height: normal;
    font-family: inherit;
    border: 1px solid #cccccc;
    border-radius: 0;
    outline-style: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 1em 1em;
}

#phonenum-desc > form > div:nth-child(2) > input[type="text"]::-webkit-input-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="text"]::-moz-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="text"]:-ms-input-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="text"]::-ms-input-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="text"]::placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="tel"]::-webkit-input-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="tel"]::-moz-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="tel"]:-ms-input-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="tel"]::-ms-input-placeholder {
    color: #cccccc;
}

#phonenum-desc > form > div:nth-child(2) > input[type="tel"]::placeholder {
    color: #cccccc;
}

.memberSearch > .memberSearch-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10px;
}

.memberSearch > .memberSearch-link > p {
    font-size: 12px;
    color: #333333;
    margin-right: 15px;
}

.memberSearch > .memberSearch-link > span {
    font-size: 12px;
}

.memberSearch > .memberSearch-link > span > a {
    text-decoration: underline;
}

/*비밀번호찾기 css*/
.memberSearch-password > div {
    display: none;
}

.memberSearch-password > div.active {
    display: block;
}

.memberSearch-password > div > p {
    font-size: 14px;
    text-align: center;
    word-break: keep-all;
    margin-bottom: 30px;
}

.memberSearch-password > div > form > div:not(last-child) {
    margin-bottom: 10px;
}


@media (max-width: 580px) {
    .memberSearch {
        width: 400px;
    }
}

@media (max-width: 460px) {
    .memberSearch {
        width: 350px;
    }

    .memberSearch > h2 {
        font-size: 26px;
        margin-bottom: 15px;
    }

    .memberSearch-radiobtn {
        margin: 22px 0 32px 0;
    }
}

@media (max-width: 420px) {
    .memberSearch {
        width: 320px;
    }
}

@media (max-width: 385px) {
    .memberSearch {
        width: 300px;
    }
}


/* 경매결과 CSS */
.resulttap {
    margin-top: 15px;
}

.resulttap > ul > li {
    display: inline-block;
    height: 40px;
    line-height: 40px;
}

.resulttap > ul > li:first-child {
    margin-right: 10px;
}

.resulttap > ul > li.active {
    border-bottom: 1px solid #f47104;
}

.resulttap > ul > li.active > a {
    color: #f47104;
}

.resulttap > ul > li > a {
    color: #0d0d0d;
}

/*상세보기버튼노출*/
.card.auction.ca > .auction-content > .card-body > .card-text > div > h5 {
    margin-bottom: 20px;
}

.card-text .list-more-btn {
    height: 30px;
    line-height: 30px;
    margin-top: 5px;
}

.card-text .list-more-btn > button {
    position: relative;
    padding: 0 30px;
    font-size: 12px;
    height: 100%;
    text-align: center;
    background-color: #9D9D9D;
    color: #ffffff;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    overflow: hidden;
    z-index: 1;
}

.card-text .list-more-btn > button:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #444444;
    z-index: -2;
}

.card-text .list-more-btn > button:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background-color: #2b2b2b;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    z-index: -1;
}

.card-text .list-more-btn > button:hover {
    color: #fff;
}

.card-text .list-more-btn > button:hover:before {
    width: 100%;
}

.card-text .list-more-btn > button > span {
    font-size: 12px;
}

.card-text .list-more-btn > button > i {
    font-size: 10px;
    margin-left: 5px;
}


/*경매리스트페이지 load more 버튼*/
.auction-list-loadmore {
    width: 100%;
    height: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 50px;
}

.auction-list-loadmore::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
    height: 1px;
    background-color: #e5e5e5;
    z-index: 1;
}

.auction-list-loadmore > div {
    position: relative;
    padding: 9px 35px;
    border: 1px solid #e2e2e2;
    background-color: #ffffff;
    cursor: pointer;
    z-index: 2;
}

.auction-list-loadmore > div > span {
    color: #000000;
    font-size: 12px;
}


/* moblie bottom menu */
#mobile-bottom-menu {
    display: none;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 117;
    width: 100%;
    background-color: #ffffff;
    -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.5);
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.5);
}

#mobile-bottom-menu > ul {
    font-size: 0;
    width: 100%;
    height: 100%;
}

#mobile-bottom-menu > ul > li {
    display: inline-block;
    vertical-align: top;
    width: 20%;
    height: 100%;
    padding-left: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
}

#mobile-bottom-menu > ul > li > a {
    position: relative;
    width: 100%;
    height: 100%;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 25px;
}

#mobile-bottom-menu > ul > li > a img {
    opacity: 0.5;
}

#mobile-bottom-menu > ul > li.liston > a img {
    opacity: 1;
}

#mobile-bottom-menu > ul > li.active > a img {
    opacity: 1;
}

#mobile-bottom-menu > ul > li > a > .mobileBottomImg {
    position: relative;
    width: 60%;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#mobile-bottom-menu > ul > li > a > .mobileBottomImg.on > .auction-new {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 14px;
    height: 14px;
    border-radius: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #Ff5d16;
}

#mobile-bottom-menu > ul > li > a > .mobileBottomImg.on > .auction-new > span {
    display: inline-block;
    font-size: 6px;
    color: #ffffff;
    font-weight: 400 !important;
}


#mobile-bottom-menu > ul > li > a > span {
    font-size: 10px;
    line-height: 1.3em;
    color: #777777;
}

#mobile-bottom-menu > ul > li.liston > a > span {
    color: #000000;
}


/* 9월7일수정 */
/* mobile bottom auction */
#mobile-bottom-auction {
    -webkit-transform: translateY(470px);
    -ms-transform: translateY(470px);
    transform: translateY(470px);
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 20px 16px 72px 16px;
    background-color: #ffffff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.5);
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.5);
    z-index: 116;
    -webkit-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.mobileDim {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 93;
}


#mobile-bottom-auction:after {
    position: absolute;

}

.mobile-bottom-auction-bar {
    position: absolute;
    top: -10px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    display: none;
    width: 70px;
    height: 4px;
    border-radius: 20px;
    background-color: #dedede;
}

#mobile-bottom-auction > div > div {
    position: relative;
    width: 100%;
    height: 110px;
    padding: 10px 39px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #efefef;
    margin-bottom: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.25);
    box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.25);
}

#mobile-bottom-auction > div > div > img {
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.mobile-bottom-auction-major {
    background-image: -webkit-image-set(url("../img/mobile/major_01.png") 1x, url("../img/mobile/major_02.png") 2x, url("../img/mobile/major_03.png") 3x);
    background-image: image-set(url("../img/mobile/major_01.png") 1x, url("../img/mobile/major_02.png") 2x, url("../img/mobile/major_03.png") 3x);
}

.mobile-bottom-auction-premium {
    background-image: -webkit-image-set(url("../img/mobile/premium_01.png") 1x, url("../img/mobile/premium_02.png") 2x, url("../img/mobile/premium_03.png") 3x);
    background-image: image-set(url("../img/mobile/premium_01.png") 1x, url("../img/mobile/premium_02.png") 2x, url("../img/mobile/premium_03.png") 3x);
}

.mobile-bottom-auction-weekly {
    background-image: -webkit-image-set(url("../img/mobile/weekly_01.png") 1x, url("../img/mobile/weekly_02.png") 2x, url("../img/mobile/weekly_03.png") 3x);
    background-image: image-set(url("../img/mobile/weekly_01.png") 1x, url("../img/mobile/weekly_02.png") 2x, url("../img/mobile/weekly_03.png") 3x);
}

#mobile-bottom-auction .bot-auc-tit {
    font-size: 16px;
    color: #ffffff;
    font-weight: 600;
    line-height: 1.4em;
    text-align: center;
    word-break: keep-all;
    margin-bottom: 5px;
}

#mobile-bottom-auction > div > div > p {
    font-size: 10px;
    text-align: center;
    line-height: 1.4em;
    color: #ffffff;
}

#mobile-bottom-auction > div > div > a,
#mobile-bottom-auction > div > div > span {
    font-size: 12px;
    color: #666666;
}


/* 카운트다운 css */
.countdown-wrap {
    width: 100%;
    height: 60vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
}

.countdown-wrap > h1 {
    font-size: 22px;
    line-height: 1.2em;
    color: #898989;
    margin-bottom: 15px;
    margin-top: 50px;
}

.previwe-countdown {
    line-height: initial;
}

.previwe-countdown > span {
    font-family: 'Montserrat', sans-serif;
    font-size: 50px;
    font-weight: 700;
}

.countdown-wrap > ul > li {
    display: inline-block;
    font-size: 18px;
    padding: 0 20px;
}

.countdown-wrap > ul > li:nth-child(2) {
    padding: 0 40px 0 30px;
}

.countdown-wrap > p {
    font-size: 22px;
    line-height: 1.4em;
    text-align: center;
    margin-top: 60px;
}

.countdown-wrap > p > span {
    color: #ff7c02;
    font-weight: 600;
}

.countdown-wrap > button {
    padding: 8px 45px;
    margin-top: 30px;
    background-color: #ffffff;
    border: 1px solid #000000;
    border-radius: 5px;
}

@media (max-width: 768px) {
    .countdown-wrap > p {
        font-size: 16px;
        margin-top: 30px;
        word-break: keep-all;
    }

    .countdown-wrap > button {
        margin-top: 15px;
    }

    .countdown-wrap > h1 {
        margin-top: 30px;
        font-size: 18px;
    }
}


/* 10월15일수정 */
/* 검색패널작업 */
#search-pannel {
    position: relative;
    width: 300px;
    height: 100%;
    max-height: 100%;
    overflow-y: hidden;
    position: fixed;
    top: 0;
    left: -300px;
    /* top: 0; left: 0; */
    background-color: #ffffff;
    z-index: 1000;
    border-right: 1px solid #d9d9d9;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    transition: ease 0.3s;
}

#search-pannel.show {
    left: 0px;
    transition: ease 0.3s;
}

.search-pannel-mb-btn {
    display: none;
    position: fixed;
    bottom: 0;
    left: -300px;
    width: 300px;
    z-index: 1001;
    padding: 20px 26px;
    background-color: #ffffff;
    border-top: 1px solid #eeeeee;
    border-right: 1px solid #d9d9d9;
}

.search-pannel-mb-btn.show {
    left: 0px;
    transition: ease 0.3s;
}


.search-pannel-close-btn {
    position: absolute;
    top: 20px;
    right: 15px;
    display: none;
    font-size: 0;
    z-index: 1;
    line-height: initial;
    cursor: pointer;
}

.search-integration-close-btn {
    position: absolute;
    top: 15px;
    right: 10px;
    display: none;
    font-size: 0;
    z-index: 1;
    line-height: initial;
    cursor: pointer;
}

.search-pannel-close-btn > i,
.search-integration-close-btn > i {
    font-size: 18px;
    font-weight: 300;
    color: #666666;
}


@media (max-width: 450px) {
    .search-pannel-close-btn,
    .search-integration-close-btn {
        display: block;
    }
}


/* 검색패널 제외 영역 */
.search-pannel-dim {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    z-index: 97;
}

.search-pannel-dim.show {
    display: block;
}


.search-pannel-cnt-wrap {
    max-height: 89vh;
    overflow-y: scroll;
}

.search-pannel-cnt-wrap.mobile {
    max-height: initial;
    overflow-y: hidden;
}

.search-pannel-cnt-wrap > h2 {
    padding: 0 18px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    font-weight: 700;
}

.panel-heading {
    position: relative;
    width: 100%;
    height: 50px;
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-top: 1px solid #9d9d9d;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 25px;
    cursor: pointer;
}

#search-integration-pannel .panel-heading {
    height: 48px;
}

.panel-heading > h3 {
    font-size: 16px!important;
    font-weight: 700;
}

#search-integration-pannel .panel-heading > h3 {
    font-size: 14px;
}

.panel-heading > i {
    position: absolute;
    font-size: 16px;
    font-weight: 300;
    top: 50%;
    right: 25px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #000000;
}

#search-integration-pannel .panel-heading > i {
    color: #9d9d9d;
}

.panel-tit-writer-search {
    text-align: right;
    padding: 0 25px;
}

.panel-tit-writer-search > ul > li {
    position: relative;
    display: inline-block;
    padding-left: 0;
}

.panel-tit-writer-search > ul > li:first-child {
    margin-right: 15px;
}

.panel-tit-writer-search > ul > li:first-child::after {
    position: absolute;
    display: inline-block;
    content: '';
    width: 1px;
    height: 12px;
    background-color: #dadada;
    top: 50%;
    right: -9px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.panel-tit-writer-search > ul > li > a {
    color: #9d9d9d;
}

.panel-tit-writer-search > ul > li.active > a {
    color: #000000;
}

.panel-body-writer-search {
    height: 350px !important;
    margin-right: 5px;
    overflow-y: auto;
}

.panel-body-writer-search.over {
    overflow-y: scroll !important;
    height: 350px !important;
}


.panel-body-writer-search::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 5px;
}

.panel-body-writer-search::-webkit-scrollbar-button {
    background-color: #ffffff;
    width: 10px;
    height: 10px;
}

.panel-body-writer-search::-webkit-scrollbar-thumb {
    border-radius: 15px;
    background-color: #dadada;
    margin: 5px 0;
}

.panel-body-writer-search > ul > li {
    width: 100%;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 25px;
    background-color: #ffffff;
}

.panel-body-writer-search > ul > li:hover {
    background-color: #f8f8f8;
}

.panel-body-writer-search > ul > li label {
    margin-bottom: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    color: #9d9d9d;
}

.panel-body-writer-search > ul > li.on {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    background-color: #f8f8f8;
}

.panel-body-writer-search > ul > li:last-child {
    border-bottom: none;
}

.panel-body-writer-search > ul > li input {
    display: none;
}

.search-auction01 + label {
    position: relative;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.search-auction01 + label > div {
    width: 20%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0;
}

.search-auction01 + label > strong {
    width: 80%;
    display: inline-block;
    font-weight: 400;
    line-height: 1.2em;
}

.search-auction01 + label > div > span {
    display: inline-block;
    vertical-align: text-top;
    width: 18px;
    height: 18px;
    background: #ffffff;
    border: 1px solid #9d9d9d;
}

.search-auction01:checked + label > div > span:after {
    content: '';
    position: absolute;
    left: 3px;
    top: 7px;
    background: #000000;
    width: 2px;
    height: 2px;
    -webkit-box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.search-auction01:checked + label strong {
    color: #000000;
}

.search-auction01:checked + label > div > span {
    border-color: #000000;
}

#search-integration-pannel #search-pannel-accordian > div:last-child {
    margin-bottom: 0;
}


/* 검색결과 없을경우 */
#loading {
    z-index: 100;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 550px;
    background-color: #f9f9f9;
    margin-top: -57px;
}

@-webkit-keyframes spinLoadingAni {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinLoadingAni {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/* 데스크탑 아이콘 */
.search-loading-ani_01 {
    width: 55px;
    height: auto;
}

/* 모바일 아이콘 */
.loading-ani {
    display: none;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    border: 0.5em solid rgba(255, 255, 255, 1);
    border-top-color: #091938;
    -webkit-animation: spinLoadingAni 0.6s infinite linear;
    animation: spinLoadingAni 0.6s infinite linear;
}


.search-not-result {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.search-not-result > div.search-not-result-icon_02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 25px;
}

.search-not-result > div.search-not-result-icon_01 {
    width: 106px;
    height: 106px;
    border-radius: 106px;
    border: 1px solid #dadada;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 40px;
}

.search-not-result > div > span {
    font-family: 'Montserrat' sans-serif;
    font-size: 75px;
    font-weight: 700;
    color: #dadada;
}

.search-not-result > p {
    font-size: 14px;
    color: #000000;
    line-height: 1.3em;
    text-align: center;
    word-break: keep-all;
}

.search-not-result > p > span {
    display: block;
}

.search-not-result > span {
    font-size: 20px;
    text-align: center;
    color: #000000;
    line-height: 1.2em;
    word-break: keep-all;
}

#empty .search-not-result p {
    color: #000000;
    font-size: 16px;
    font-weight: 400;
}


@media (max-width: 590px) {
    .search-not-result {
        padding: 0 20px;
    }

    #loading {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        margin-top: 0;
    }

    .search-not-result-icon_02 .search-loading-ani_01 {
        display: none;
    }

    .loading-ani {
        display: block;
        width: 40px;
        height: 40px;
        border: 0.4em solid #cccccc;
        border-top-color: #ffffff;
    }

    #loading > .search-not-result {
        height: 100%;
    }

    .search-not-result > div > span {
        font-size: 60px;
    }

    .search-not-result > p {
        font-size: 12px;
        color: #ffffff;
    }

    .search-not-result > span {
        font-size: 14px;
        color: #ffffff;
    }
}


/* 가격대범위 CSS */
.panel-body-price-filter > ul > li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    height: 100px;
    padding: 0 25px;
}

.panel-body-price-filter > ul > li.high-price{
    height: 83px;
}

.panel-body-price-filter > ul > li > div {
    width: 100%;
}

.panel-body-price-filter > ul > li.on {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    background-color: #f8f8f8;
}

.panel-body-price-filter > ul > li > .price-range-top {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
    margin-top: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.panel-body-price-filter > ul > li > .price-range-bottom > p.input-price{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-top: 17px;
    margin-bottom: 6px;
    flex-wrap: wrap
}

.panel-body-price-filter > ul > li > .price-range-bottom > p.input-price .from_01{
    width: 46%;
}

.panel-body-price-filter > ul > li > .price-range-bottom > p.input-price .to_01{
    width: 46%;
}

.panel-body-price-filter > ul > li > .price-range-bottom > p.input-price span input{
    width: 100%;
    border: 1px solid #aaa;
    text-align: right;
    padding: 0.1em 0.5em;
}

.search-price-range-check {
    display: none;
}

.search-price-range-check + label {
    position: relative;
    width: 100%;
    cursor: pointer;
    margin-bottom: 0;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.search-price-range-check + label > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 8px;
}

.search-price-range-check + label > div > span {
    display: inline-block;
    vertical-align: text-top;
    width: 18px;
    height: 18px;
    background: #ffffff;
    border: 1px solid #9d9d9d;
}

.search-price-range-check:checked + label > div > span:after {
    content: '';
    position: absolute;
    left: 15%;
    bottom: 6px;
    background: #000000;
    width: 2px;
    height: 2px;
    -webkit-box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


.search-price-range-check + label > strong {
    font-size: 12px;
    font-weight: 400;
    color: #9d9d9d;
}

.search-price-range-check:checked + label > strong {
    color: #000000;
}

.search-price-range-check:checked + label::before {
    border-color: #000000;
}

.price-range-bottom {
    position: relative;
    margin-top: -8px;
}

.price-range-bottom > div:first-child {
    text-align: right;
    color: #dadada;
}

.price-range-bottom > div:first-child > span {
    display: inline-block;
    color: #000000;
}

.price-range-bottom > div:first-child > span:first-child {
    padding-right: 18px;
}

.price-range-bottom > div:first-child > span:last-child {
    padding-left: 18px;
}

.price-range-wrapper .slider.slider-horizontal .slider-track {
    height: 2px !important;
    -webkit-transform: translateY(-50%) !important;
    -ms-transform: translateY(-50%) !important;
    transform: translateY(-50%) !important;
    margin-top: 0 !important;
}

.price-range-wrapper .slider.slider-horizontal {
    width: 100% !important;
    height: 12px !important;
}

.price-range-wrapper .slider-handle {
    width: 5px !important;
    height: 5px !important;
    background-color: #dadada !important;
    background-image: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    top: -3px !important;
    margin-left: 0 !important;
}

.price-range-wrapper .slider-handle.min-slider-handle {
    position: relative;
    margin-left: -5px !important;
}

.price-range-wrapper .slider-handle.min-slider-handle:after {
    position: absolute;
    bottom: -5px;
    left: 0;
    content: '';
    width: 0;
    height: 0;
    border-top: 5px solid #dadada;
    border-left: 5px solid transparent;
}

.price-range-wrapper .slider-handle.max-slider-handle {
    position: relative;
    top: -8px !important;
}

.price-range-wrapper .slider-handle.max-slider-handle:after {
    position: absolute;
    bottom: -5px;
    left: 0;
    content: '';
    width: 0;
    height: 0;
    border-top: 5px solid #dadada;
    border-right: 5px solid transparent;
}

.price-range-wrapper .slider-selection {
    background: #dadada !important;
}

.panel-body-price-filter > ul > li.on .price-range-wrapper .slider-handle {
    background-color: #000000 !important;
}

.panel-body-price-filter > ul > li.on .price-range-wrapper .slider-handle.min-slider-handle:after,
.panel-body-price-filter > ul > li.on .price-range-wrapper .slider-handle.max-slider-handle:after {
    border-top: 5px solid #000000 !important;
}

.panel-body-price-filter > ul > li.on .price-range-wrapper .slider-selection {
    background-color: #091938 !important;
}

.price-range-wrapper .slider-handle.round {
    border-radius: 0 !important;
}

.tooltip-inner {
    max-width: 200px;
    padding: 3px 8px;
    color: #bdbdbd !important;
    text-align: center;
    background-color: transparent !important;
    border-radius: 4px;
}

.tooltip.top .tooltip-arrow {
    display: none !important;
}

.slider .tooltip.top {
    margin-top: -36px !important;
}

.well {
    background: transparent !important;
    border: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    width: 100% !important;
    padding: 0;
}


/* 작품재료 CSS */

.material-search-wrap {
    padding: 18px 25px 18px 25px;
    margin-bottom: 18px;
}

.material-search {
    position: relative;
    width: 100%;
    height: 40px;
}

.material-search input[type=search] {
    width: 100%;
    height: 100%;
    border: none;
    border: 1px solid #9d9d9d;
    padding: 0.3em 0.6em;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 3px;
    font-size: 14px;
    color: #9d9d9d;
}

.material-search input[type=search]::-webkit-input-placeholder {
    color: #dadada;
}

.material-search input[type=search]::-moz-placeholder {
    color: #dadada;
}

.material-search input[type=search]:-ms-input-placeholder {
    color: #dadada;
}

.material-search input[type=search]::-ms-input-placeholder {
    color: #dadada;
}

.material-search input[type=search]::placeholder {
    color: #dadada;
}

.material-search input[type=search]::-webkit-search-decoration,
.material-search input[type=search]::-webkit-search-cancel-button,
.material-search input[type=search]::-webkit-search-results-button,
.material-search input[type=search]::-webkit-search-results-decoration {
    display: none;
}

.material-search > button {
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: none;
}

.material-search > button > i {
    color: #9d9d9d;
    font-size: 15px;
    font-weight: 500;
}

.search-pannel-btn-wrap {
    position: absolute;
    width: 100%;
    bottom: 0px;
    left: 0px;
    padding: 20px 26px;
    background-color: #ffffff;
    z-index: 2;
    border-top: 1px solid #eeeeee;
}

.search-pannel-btn-wrap.mobile {
    position: relative;
}

.mobile-padding {
    display: none;
    width: 100%;
    height: 90px;
    background-color: #ffffff;
}

.search-pannel-btn-wrap .search-pannel-btn,
.search-pannel-mb-btn .search-pannel-btn {
    width: 100%;
    height: 40px;
    font-weight: 500;
    background-color: #0b1737;
    border-radius: 3px;
    color: #ffffff;
}


#search-pannel-btn {
    position: fixed;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(-10%);
    -ms-transform: translateY(-50%) translateX(-10%);
    transform: translateY(-50%) translateX(-10%);
    width: 45px;
    height: 60px;
    background-color: #091938;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    cursor: pointer;
    transition: ease 0.3s;
    z-index: 92;
}

#search-pannel-btn.active{
    left: -100%;
}

#search-pannel-btn.show {
    margin-left: 300px;
    -webkit-transform: translateY(-50%) translateX(-10%);
    -ms-transform: translateY(-50%) translateX(-10%);
    transform: translateY(-50%) translateX(-10%);
    transition: ease 0.3s;
}

#search-pannel-btn:hover {
    -webkit-transform: translateY(-50%) translateX(0%);
    -ms-transform: translateY(-50%) translateX(0%);
    transform: translateY(-50%) translateX(0%);
}

#search-pannel-btn > i {
    color: #ffffff;
    font-size: 18px;
    position: absolute;
    top: 50%;
    right: 15px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.price-range-wrapper .slider.slider-horizontal .tooltip {
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important;
}

.price-range-wrapper .tooltip.tooltip-min.top {
    left: 85px !important;
    opacity: 1 !important;
    text-align: right;
}

.price-range-wrapper .tooltip.tooltip-max.top {
    left: auto !important;
    right: 0;
    opacity: 1 !important;
    text-align: right;
}

/* 리스트페이지 list */

.list-btn-wrap > ul > li > a {
    font-size: 16px;
    font-weight: 600;
    padding: .5rem .8rem;
}

.list-btn-wrap > ul > li > a:hover {
    color: #000000;
    border-bottom: none;
}

.list-btn-wrap > ul > li > a.active {
    border-bottom: 2px solid #f47104;
    color: #f47104;
}

.card-default-search-area {
    margin-bottom: 0;
}

.card-default-search-area > .card-body {
    position: relative;
    padding: 20px 15px;
}

/* 검색영역 area */
.card-default-search-area-wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.card-default-search-area-wrap > .card-body {
    position: relative;
}

.card-default-lot-search {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.card-default-lot-search .lot-search-wrap {
    width: 60px;
    height: 34px;
    margin-right: 15px;
    border: 1px solid #dadada;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #ffffff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.card-default-my-auto .input-group #search {
    border-radius: 0;
}

.card-default-lot-search .lot-search-wrap > span {
    font-size: 14px;
    color: #9d9d9d;
}

.card-default-lot-search .lot-dropdown .searchBox input {
    max-width: 85px !important;
}

.card-default-lot-search .lot-dropdown .lot-btn i {
    font-weight: 500 !important;
}

.card-default-lot-search > span {
    font-weight: 700;
}

.card-default-my-auto {
    margin-left: 25px;
}

.card-default-my-auto .input-group #search {
    width: 250px;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
}

.card-default-search-area .text-right {
    position: absolute;
    top: 50%;
    right: 15px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 10;
}

.search-dropdown-toggle-wrap {
    display: inline-block;
}

.search-dropdown-toggle-wrap > button {
    position: relative;
    height: 28px;
    min-height: 28px;
    padding: 0;
}

.search-dropdown-toggle-wrap > button:hover {
    background: transparent !important;
}

.search-dropdown-toggle-wrap.menu_01 > button {
    min-width: 140px;
}

.search-dropdown-toggle-wrap.menu_02 > button {
    min-width: 95px;
}

.search-dropdown-toggle-wrap.menu_03 > button {
    min-width: 133px;
}


.search-dropdown-toggle-wrap > button.open {
    background-color: #ffffff;
    -webkit-box-shadow: rgb(15 15 15 / 5%) 0px 0px 0px 0px, rgb(15 15 15 / 10%) 0px 6px 2px, rgb(15 15 15 / 20%) 0px 16px 13px;
    box-shadow: rgb(15 15 15 / 5%) 0px 0px 0px 0px, rgb(15 15 15 / 10%) 0px 6px 2px, rgb(15 15 15 / 20%) 0px 16px 13px;
}

.btn-group > div:not(:last-child) {
    margin-right: 10px;
}


.search-dropdown-toggle-wrap > button > span {
    text-align: left;
    margin-left: 5px;
    font-size: 14px;
}

.search-dropdown-toggle-wrap > button > i {
    font-size: 12px;
    position: absolute;
    top: 50%;
    right: 5px;
    left: auto;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.search-dropdown-toggle-wrap > button:hover {
    background-color: #ffffff !important;
}

.search-dropdown-button::after {
    display: none !important;
}

.search-dropdown-list-wrap.show {
    border-radius: 0;
    margin-top: 0;
    padding: 0;
}

.search-dropdown-list-wrap > a {
    font-size: 14px;
}

.search-dropdown-list-wrap > a:hover {
    background-color: #f1f1f1 !important;
}


.selected-search-option-wrap {
    position: relative;
    padding: 13px 0 16px 0;
    margin-bottom: 20px;
    background-color: #f9f9f9;
    border-top: 1px solid #dadada;
    border-bottom: 1px solid #dadada;
}

.selected-search-option-wrap > .selected-search-option-area {
    padding: 0 15px;
    font-size: 0;
    line-height: initial;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.selected-search-option-wrap > .selected-search-option-area > div:first-child {
    width: 10%;
    margin-right: 1%;
}

.selected-search-option-wrap > .selected-search-option-area > div:last-child {
    width: 89%;
}

.selected-search-option-wrap > .selected-search-option-area > div:first-child > p {
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    margin-right: 16px;
    word-break: keep-all;
}

.selected-search-option-total {
    font-size: 14px;
    text-align: right;
    margin-bottom: 12px;
    padding-right: 14px;
}

.selected-search-list {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 3px 20px 3px 8px;
    border: 1px solid #dadada;
    border-radius: 22px;
    font-size: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 8px;
    margin-top: 3px;
}

.selected-search-list > span,
.selected-list-clearall > span {
    font-size: 12px;
    line-height: 1.2em;
    color: #505050;
}

.selected-search-list > button,
.selected-list-clearall > button {
    background-color: transparent;
    width: 16px;
    position: absolute;
    top: 50%;
    right: 2px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.selected-search-list i,
.selected-list-clearall i {
    font-size: 12px;
    line-height: inherit;
    font-weight: 400;
}

.selected-list-clearall {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 0 8px;
    height: 22px;
    margin-top: 3px;
    border-radius: 10px;
    font-size: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
}

.card-default-lot-search .lot-dropdown {
    top: 0;
    left: 0;
    z-index: 100;
}

.row.section-align {
    margin: 50px 0 30px 0 !important;
}


@media (max-width: 890px) {
    .row.section-align {
        margin: 30px 0 15px 0 !important;
    }

    .card-default-search-area-wrap {
        margin-bottom: 15px;
    }

    .card-default-search-area > .card-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 20px 0;
    }

    .card-default-search-area .text-right {
        position: relative;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        text-align: left !important;
    }
}


@media (max-width: 768px) {
    .selected-search-option-wrap > .selected-search-option-area {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .selected-search-option-wrap > .selected-search-option-area > div:first-child {
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }

    .selected-search-option-wrap > .selected-search-option-area > div:last-child {
        width: 100%;
    }
}

@media (max-width: 510px) {
    .card-default-my-auto {
        width: 100%;
    }

    .card-default-my-auto .input-group #search {
        width: 240px;
    }

    .card-default-my-auto .input-group-append {
        width: 15%;
    }

    .card-default-my-auto .input-group-append > button {
        width: 100%;
    }

    .row.section-align {
        margin: 30px 0 5px 0 !important;
    }

    .card-default-my-auto > .input-group {
        -ms-flex-wrap: initial;
        flex-wrap: initial;
    }
}


@media (max-width: 432px) {
    .card-default-search-area-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .card-default-lot-search {
        margin-bottom: 15px;
    }

    .card-default-my-auto {
        margin-left: 0;
    }
}


@media (max-width: 450px) {
    .search-dropdown-toggle-wrap > button > span,
    .search-dropdown-list-wrap > .dropdown-item {
        font-size: 12px;
    }

    .search-dropdown-toggle-wrap.menu_01 > button {
        min-width: 118px;
    }

    .search-dropdown-list-wrap {
        width: 118px !important;
    }

    .search-dropdown-toggle-wrap.menu_02 > button {
        min-width: 75px;
    }

    .search-dropdown-toggle-wrap.menu_02 > .search-dropdown-list-wrap {
        width: 75px !important;
    }

    .btn-group > div:not(:last-child) {
        margin-right: 5px;
    }

    .search-dropdown-toggle-wrap.menu_03 > button {
        min-width: 116px;
    }

    .search-dropdown-toggle-wrap.menu_03 > .search-dropdown-list-wrap {
        width: 116px !important;
    }
}

/* 10월29일수정 */
.btn-group.list-btn-wrap {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.btn-group.list-btn-wrap::-webkit-scrollbar {
    -webkit-appearance: none;
}

.btn-group.list-btn-wrap::-webkit-scrollbar:horizontal {
    height: 11px;
}

.btn-group.list-btn-wrap::-webkit-scrollbar-thumb {
    border-radius: 15px;
    border: 4px solid transparent;
    background-clip: padding-box;
    background-color: transparent;
}

.btn-group.list-btn-wrap::-webkit-scrollbar-button {
    display: none;
}


.card-default-search-area .btn-group {
    position: relative;
    font-size: 0;
}

@media (max-width: 370px) {
    .card-default-search-area .btn-group {
        display: block;
    }

    .btn-group > div:not(:last-child) {
        margin-bottom: 6px;
    }
}


.search-page-cnt-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin: 15px 0 60px 0;
}

.search-page-cnt-area > div:first-child {
    width: 260px;
    height: 1100px;
    margin-right: 1%;
}

.search-page-cnt-area > div:last-child {
    width: 78%;
}

#search-integration-pannel > .search-pannel-cnt-wrap {
    overflow: hidden;
    max-height: initial;
}

#search-integration-pannel .search-pannel-btn-wrap {
    position: relative;
    bottom: auto;
    left: auto;
}

#search-integration-pannel .panel-heading {
    border-top: 1px solid #dadada;
}

#search-integration-pannel h2 {
    height: 48px;
    padding: 0 20px;
    line-height: 48px;
    border-top: 1px solid #dadada
}


.search-auction-range-list > li > input {
    display: none;
}

.search-auction-range-list > li {
    width: 100%;
    height: 48px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 25px;
    background-color: #ffffff;
}

.search-auction-range-list > li label {
    width: 100%;
    margin-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    color: #9d9d9d;
}

.search-auction-range-list > li.on {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    background-color: #f8f8f8;
}

#search-integration-list .selected-search-option-wrap > .selected-search-option-area > div:first-child {
    width: 13%;
}

#search-integration-list .selected-search-option-wrap > .selected-search-option-area > div:last-child {
    width: 86%;
}

#search-integration-list .search-sort-wrap{
    display: inline-block;
    width: 100%;
    padding-bottom: 20px;
}


#search-pannel-btn.active {
    display: block !important;
}

@media (max-width: 1030px) {
    #search-integration-list {
        width: 100%;
    }

    #search-integration-pannel {
        position: fixed;
        top: 0;
        left: -300px;
        z-index: 500;
        background-color: #ffffff;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 300px;
        height: 100%;
        margin-right: 0;
        border-right: 1px solid #9d9d9d;
        -webkit-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
    }

    #search-integration-pannel.show {
        left: 0px;
        -webkit-transition: all .6s ease-in-out;
        -o-transition: all .6s ease-in-out;
        transition: all .6s ease-in-out;
    }

    #search-integration-pannel .search-pannel-cnt-wrap {
        overflow-y: scroll;
        max-height: 89vh;
    }

    .search-pannel-cnt-wrap.mobile {
        overflow-y: hidden !important;
        max-height: initial !important;
    }


    #search-integration-pannel .search-pannel-btn-wrap {
        position: absolute;
        width: 100%;
        bottom: 0px;
        left: 0px;
    }

    #search-integration-pannel .search-pannel-btn-wrap.mobile {
        position: relative;
    }

    #search-integration-pannel h2 {
        border-top: none;
    }


}


@media (max-width: 768px) {
    #search-integration-list .selected-search-option-wrap > .selected-search-option-area > div:first-child,
    #search-integration-list .selected-search-option-wrap > .selected-search-option-area > div:last-child {
        width: 100%;
    }
}

#search-desktop-popup.active {
    display: block;
}

#search-desktop-popup {
    display: none;
    position: absolute;
    top: 65px;
    right: 0;
    width: 235px;
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 40px 15px 15px 15px;
    text-align: left;
    -webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    border: 1px solid #dadada;
    z-index: 100;
}

#search-desktop-popup:after {
    display: block;
    position: absolute;
    content: '';
    top: 0px;
    -webkit-transform: translate(50%, -50%) rotate(-135deg) translateZ(0);
    transform: translate(50%, -50%) rotate(-135deg) translateZ(0);
    right: 25px;
    height: 10px;
    width: 10px;
    background: -o-linear-gradient(135deg, #ffffff 52%, transparent 0);
    background: linear-gradient(-45deg, #ffffff 52%, transparent 0);
    border: inherit;
    border-width: 0 1px 1px 0;
    border-radius: 0 0 2px 0;
}


.search-desktop-popup-input {
    position: relative;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #9d9d9d;
    margin-bottom: 23px;
}

.search-desktop-popup-input > input {
    border: none;
    width: 153px;
    height: 100%;
    color: #666666;
    font-size: 14px;
    font-weight: 400;
}

.search-desktop-popup-input > .btnClear,
.search-mobile-popup-input > .btnClear {
    position: absolute;
    right: 25px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 100%;
    width: 23px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
}

.btnClear > .search_line {
    position: absolute;
    display: block;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px;
    height: 12px;
    background-color: #dadada;
}

#search-mobile-popup .search-mobile-popup-input > .btnClear {
    display: none;
}

.search-desktop-popup-btn {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.search-desktop-popup-btn > button > i {
    color: #9d9d9d;
    font-weight: 500;
}

.search-desktop-popup-input.on .search-desktop-popup-btn button i {
    color: #000000;
}

.search-desktop-popup-latest,
.search-desktop-popup-recommend {
    position: relative;
    font-size: 0;
    margin-bottom: 20px;
}

.search-desktop-popup-latest.remove {
    display: none !important;
}

.search-desktop-popup-latest > span {
    font-size: 12px;
    line-height: 1.3em;
    position: absolute;
    top: 4px;
    right: 0;
    cursor: pointer;
    z-index: 10;
    color: #666666;
}

.search-mobile-popup-latest > span {
    font-size: 12px;
}


.search-desktop-popup-latest > p,
.search-desktop-popup-recommend > p {
    display: inline-block;
    font-size: 14px;
    line-height: 1.2em;
    font-weight: 700;
    margin-bottom: 14px;
}

.search-desktop-total-btn {
    width: 100%;
    height: 28px;
    background-color: #091938;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 3px;
}

.search-desktop-total-btn > button {
    color: #ffffff;
    font-size: 12px;
    width: 100%;
}

#search-history-cont {
    font-size: 0;
}

.search-desktop-popup-recommend > div {
    font-size: 0;
}

.search-desktop-popup-latest > div > div,
.search-desktop-popup-recommend > div > div {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 3px 20px 3px 8px;
    font-size: 0;
    border-radius: 25px;
    border: 1px solid #dadada;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 3px;
    margin-top: 3px;
}

.search-desktop-popup-latest > div > div.history-empty-cnt {
    border: none;
    padding: 0;
}

.search-desktop-popup-recommend > div > div {
    padding: 3px 8px 3px 8px;
}

.search-desktop-popup-latest > div > div.empty-history-area,
.search-desktop-popup-recommend > div > div.empty-history-area {
    border: none;
    padding: 0;
}


.search-desktop-popup-latest > div > div > span,
.search-desktop-popup-recommend > div > div > span {
    font-size: 12px;
    line-height: 1.2em;
    font-weight: 400;
    color: #505050;
}

.search-desktop-popup-latest > div > div i,
.search-desktop-popup-recommend > div > div i {
    font-size: 10px;
    line-height: 1em;
    font-weight: 400;
    line-height: initial;
}

.search-desktop-popup-latest > div > div button,
.search-desktop-popup-recommend > div > div button {
    background-color: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 9px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#search-mobile-popup {
    -webkit-transform: translateY(110%);
    -ms-transform: translateY(110%);
    transform: translateY(110%);
    /* transform: translateY(0%); */
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 82%;
    background-color: #ffffff;
    z-index: 116;
    padding: 90px 28px 0 28px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

#search-mobile-popup.active {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}


#search-mobile-popup > .mobile-bottom-search-bar {
    position: absolute;
    top: -10px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    display: none;
    width: 70px;
    height: 4px;
    border-radius: 20px;
    background-color: #dedede;
}


.fadeIn {
    -webkit-animation: fadeIn .5s cubic-bezier(0.165, 0.840, 0.440, 1.000) forwards;
    animation: fadeIn .5s cubic-bezier(0.165, 0.840, 0.440, 1.000) forwards;
}

.fadeOut {
    -webkit-animation: fadeOut .5s cubic-bezier(0.165, 0.840, 0.440, 1.000) forwards;
    animation: fadeOut .5s cubic-bezier(0.165, 0.840, 0.440, 1.000) forwards;
}


.slideUp {
    -webkit-animation: slideUp 0.5s ease forwards;
    animation: slideUp 0.5s ease forwards;
}

.slideDown {
    -webkit-animation: slideDown 0.5s linear forwards;
    animation: slideDown 0.5s linear forwards;
}


@keyframes fadeIn {
    0% {
        background: rgba(0, 0, 0, .0);
    }
    100% {
        background: rgba(0, 0, 0, .7);
    }
}

@-webkit-keyframes fadeIn {
    0% {
        background: rgba(0, 0, 0, .0);
    }
    100% {
        background: rgba(0, 0, 0, .7);
    }
}


@keyframes fadeOut {
    0% {
        background: rgba(0, 0, 0, .7);
    }
    100% {
        background: rgba(0, 0, 0, .0);
    }
}

@-webkit-keyframes fadeOut {
    0% {
        background: rgba(0, 0, 0, .7);
    }
    100% {
        background: rgba(0, 0, 0, .0);
    }
}

@keyframes slideUp {
    0% {
        -webkit-transform: translateY(110%);
        transform: translateY(110%);
    }
    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@-webkit-keyframes slideUp {
    0% {
        -webkit-transform: translateY(110%);
    }
    100% {
        -webkit-transform: translateY(0%);
    }
}

@keyframes slideDown {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
    100% {
        -webkit-transform: translateY(110%);
        transform: translateY(110%);
    }
}

@-webkit-keyframes slideDown {
    0% {
        -webkit-transform: translateY(0%);
    }
    100% {
        -webkit-transform: translateY(110%);
    }
}

#search-mobile-popup .search-mobile-popup-input {
    position: relative;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #9d9d9d;
    margin-bottom: 23px;
}

#search-mobile-popup .search-mobile-popup-input > input {
    border: none;
    font-size: 18px;
    width: 83%;
    height: 100%;
    color: #666666;
    font-weight: 400;
}

.search-mobile-popup-input > .btnClear {
    position: absolute;
    right: 25px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 100%;
    width: 23px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
}

.search-mobile-popup-btn {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#search-mobile-popup .search-mobile-popup-input > input::-webkit-input-placeholder {
    font-size: 18px;
    font-weight: 400;
}

#search-mobile-popup .search-mobile-popup-input > input::-moz-placeholder {
    font-size: 18px;
    font-weight: 400;
}

#search-mobile-popup .search-mobile-popup-input > input:-ms-input-placeholder {
    font-size: 18px;
    font-weight: 400;
}

#search-mobile-popup .search-mobile-popup-input > input::-ms-input-placeholder {
    font-size: 18px;
    font-weight: 400;
}

#search-mobile-popup .search-mobile-popup-input > input::placeholder {
    font-size: 18px;
    font-weight: 400;
}

#search-mobile-popup .search-mobile-popup-input button {
    background-color: #ffffff !important;
}

#search-mobile-popup .search-mobile-popup-input button i {
    font-size: 15px;
    font-weight: 300;
}

#search-mobile-popup .search-mobile-popup-latest > p,
#search-mobile-popup .search-mobile-popup-recommend > p {
    display: inline-block;
    font-size: 16px;
    line-height: 1.2em;
    font-weight: 700;
    margin-bottom: 10px;
}


.search-mobile-popup-latest > div > div,
.search-mobile-popup-recommend > div > div {
    position: relative;
    padding: 3px 22px 3px 8px;
    border: 1px solid #dadada;
    border-radius: 22px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 8px;
    margin-top: 6px;
}

.search-mobile-popup-recommend > div > div {
    padding: 3px 8px 3px 8px;
}

.search-mobile-popup-latest > div > div.history-empty-cnt {
    border: none;
    padding: 0;
}


.search-mobile-popup-latest > div > div > span,
.search-mobile-popup-recommend > div > div > span {
    font-size: 14px;
    line-height: 1.2em;
    font-weight: 400;
    color: #505050;
}

.search-mobile-popup-latest > div > div i,
.search-mobile-popup-recommend > div > div i {
    font-size: 10px;
    line-height: 1em;
    font-weight: 400;
    line-height: initial;
}

.search-mobile-popup-latest > div > div button,
.search-mobile-popup-recommend > div > div button {
    width: 16px;
    position: absolute;
    top: 50%;
    right: 2px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
}

#search-mobile-popup .search-mobile-popup-latest > div > div > span:hover {
    text-decoration: underline;
}

#search-mobile-popup .search-mobile-popup-recommend > div > div > span:hover {
    text-decoration: underline;
}

#search-mobile-popup i {
    font-size: 14px;
    line-height: 1em;
}

.search-mobile-popup-latest,
.search-mobile-popup-recommend {
    position: relative;
}

#search-mobile-popup .search-mobile-popup-latest {
    margin-bottom: 60px;
}

.search-mobile-popup-latest > span {
    font-size: 12px;
    line-height: 1.3em;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    z-index: 10;
    color: #666666;
}

.search-mobile-popup-close {
    position: absolute;
    top: 20px;
    right: 20px;
    background-color: #ffffff;
    line-height: initial;
}

.search-mobile-popup-close i {
    font-size: 18px !important;
    font-weight: 400;
}

.price-range-bottom > p {
    text-align: right;
    color: #9d9d9d;
}

@media (max-width: 1200px) {
    #search-desktop-popup {
        display: none;
    }
}

.btn-mobile-search_02 {
    display: none;
}


@media (max-width: 768px) {
    .btn-mobile-search_01 {
        display: none;
    }

    .btn-mobile-search_02 {
        display: block;
    }
}

.modify-receivead-way > div > div {
    padding: 20px 20px !important;
    border: 1px solid #dddddd;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.modify-receivead-way > div > div > p {
    display: inline-block;
    text-decoration: underline;
    color: #666666;
    margin-right: 40px;
}

.modify-receivead-way > div > div > ul {
    font-size: 0;
}

.modify-receivead-way > div > div > ul > li {
    display: inline-block;
    margin-right: 25px;
    padding-left: 0;
}


/* 정보수신방법 체크박스 */
.ad-chkbox,
.ad-period-chkbox {
    display: none;
}

.ad-chkbox + label,
.ad-period-chkbox + label {
    margin-bottom: 0;
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.ad-chkbox + label > span,
.ad-period-chkbox + label > span {
    position: relative;
    display: inline-block;
    margin-right: 5px;
    width: 18px;
    height: 18px;
    cursor: pointer;
    border: 1px solid #9d9d9d;
}

.ad-chkbox:checked + label > span::before,
.ad-period-chkbox:checked + label > span::before {
    content: '';
    position: absolute;
    top: 45%;
    left: 10%;
    background: #000000;
    width: 2px;
    height: 2px;
    -webkit-box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    box-shadow: 2px 0 0 #000000, 4px 0 0 #000000, 4px -2px 0 #000000, 4px -4px 0 #000000, 4px -6px 0 #000000, 4px -8px 0 #000000;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


/* 휴면계정 활성화 전환안내 페이지 css */
.dormant-account-wrap {
    padding-top: 60px;
}

.dormant-account-wrap > h1 {
    font-size: 24px;
    line-height: 1.2em;
    margin-bottom: 30px;
}

.dormant-account-cnt-box {
    padding: 32px 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #F9F9F9;
    border-top: 1px solid #000000;
    margin-bottom: 60px;
}

.dormant-account-cnt-box > p {
    color: #666666;
    font-size: 14px;
    line-height: 1.6em;
}

.dormant-account-chk-wrap > div {
    width: 100%;
    height: 55px;
    border: 1px solid #cccccc;
    margin-bottom: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.dormant-account-chk-wrap > div input {
    margin-right: 10px;
}

.dormant-account-chk-wrap > div label {
    font-size: 16px;
    margin-bottom: 0;
    line-height: 1.2em;
}

.dormant-account-chk-wrap > div span {
    font-size: 14px;
    color: #FF5D16;
    margin-left: 10px;
    line-height: 1.2em;
}

.dormant-account-chk-btn {
    margin: 30px 0 150px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.dormant-account-chk-btn > button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 45px;
    padding: 0 100px;
    background-color: #000000;
    color: #ffffff;
}

#dormant-account-modal .modal-content {
    width: 400px;
}

#dormant-account-modal .modal-body h4 {
    font-size: 16px;
    line-height: 1.6em;
    font-weight: 600;
    margin-bottom: 10px;
}

#dormant-account-modal .modal-body p {
    font-size: 14px;
    line-height: 1.6em;
    margin-bottom: 15px;
}

#dormant-account-modal .dormant-account-modal-list div {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 40px;
    border: 1px solid #dddddd;
    margin-bottom: 5px;
    padding: 0 10px;
}

#dormant-account-modal .dormant-account-modal-list div label {
    margin-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#dormant-account-modal .dormant-account-modal-list div label > span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 10px;
    width: 16px;
    height: 16px;
    border: 1px solid #cccccc;
    border-radius: 16px;
}

#dormant-account-modal .dormant-account-modal-list div label > span i {
    font-size: 10px;
    color: #ffffff;
}

#dormant-account-modal .dormant-account-modal-list div input:checked + label > span {
    border: 2px solid #FF5D16;
}

#dormant-account-modal .dormant-account-modal-list div input:checked + label > span i {
    color: #FF5D16;
}

#dormant-account-modal .dormant-account-modal-list div input {
    display: none;
}

#dormant-account-modal .dormant-account-modal-list div > span {
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #cccccc;
}

#dormant-account-modal .dormant-account-modal-btn {
    margin-top: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#dormant-account-modal .dormant-account-modal-btn button {
    background-color: #000000;
    color: #ffffff;
    font-size: 14px;
    height: 40px;
    padding: 0 50px;
    border-radius: 5px;
}


@media (max-width: 490px) {
    .dormant-account-wrap > h1 {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .dormant-account-cnt-box {
        padding: 25px 30px;
        margin-bottom: 30px;
    }

    .dormant-account-chk-wrap > div label {
        font-size: 14px;
    }

    .dormant-account-chk-wrap > div {
        padding: 0 20px;
    }

    .dormant-account-chk-btn {
        margin: 30px 0 100px 0;
    }
}

#btn-sort {
    font-size: 12px;
}

#btn-sort i {
    font-size: 12px;
}


/* 섹션정렬 css */
@media (max-width: 768px) {
    .section-align-left {
        width: 70% !important;
        max-width: inherit;
        -webkit-box-flex: unset !important;
        -ms-flex: unset !important;
        flex: unset !important;
    }

    .section-align-right {
        width: 30% !important;
        max-width: inherit;
        -webkit-box-flex: unset !important;
        -ms-flex: unset !important;
        flex: unset !important;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
}

@media (max-width: 540px) {
    .section-align-left {
        width: 100% !important;
        margin-bottom: 10px;
        padding-right: 0;
    }
}

.price-range-bottom .irs-min,
.price-range-bottom .irs-max,
.price-range-bottom .irs-from,
.price-range-bottom .irs-to {
    display: none;
}

.price-range-bottom .irs--big .irs-bar {
    top: 18px;
    height: 2px;
    background: #dadada !important;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.panel-body-price-filter > ul > li.on .irs--big .irs-bar {
    background: #767f91 !important
}

.price-range-bottom .irs--big .irs-handle {
    top: 6px;
    width: 8px;
    height: 8px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    background: #dadada !important;
}

.panel-body-price-filter > ul > li.on .irs--big .irs-handle {
    background: #071839 !important;
}

.panel-body-price-filter > ul > li .irs--big .irs-handle::before {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 16px;
    height: 16px;
    background-color: transparent;
}


.panel-body-price-filter > ul > li > .price-range-bottom > p {
    line-height: 1.2em;
}

.panel-body-price-filter > ul > li.on > .price-range-bottom > p {
    color: #000000;
}

.panel-body-price-filter > ul > li > .price-range-bottom > .irs {
    height: 36px !important;
}

#search-integration-pannel .panel-body-price-filter > ul > li > .price-range-bottom > .irs {
    height: 36px !important;
}

.price-range-bottom .irs-handle.from {
    margin-left: -3px;
}

.price-range-bottom .irs-handle.from:after {
    position: absolute;
    bottom: -5px;
    left: 0;
    content: '';
    width: 0;
    height: 0;
    border-top: 5px solid #dadada;
    border-left: 8px solid transparent;
}

.panel-body-price-filter > ul > li.on .irs-handle.from:after {
    border-top: 5px solid #071839;
}

.price-range-bottom .irs-handle.to {
    margin-left: 3px;
}

.price-range-bottom .irs-handle.to:after {
    position: absolute;
    bottom: -5px;
    left: 0;
    content: '';
    width: 0;
    height: 0;
    border-top: 5px solid #dadada;
    border-right: 8px solid transparent;
}

.panel-body-price-filter > ul > li.on .irs-handle.to:after {
    border-top: 5px solid #071839;
}

.price-range-bottom .irs--big .irs-line {
    top: 18px;
    height: 2px;
    border-radius: 0;
    background: #d8d8d8;
    border: none;
}

.price-range-bottom .irs-single {
    display: none;
}


@media (max-width: 480px) {
    .loginForm-wrap > div {
        display: block;
    }

    .loginForm-bottom > div:last-child {
        position: relative;
        text-align: right;
    }
}


/* 11월22일수정 */
.list-gradient-arrow {
    display: none;
    position: absolute;
    top: 0;
    right: 0px;
    width: 38px;
    height: 45px;
    background: -webkit-gradient(linear, right top, left top, from(white), color-stop(80%), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, white, 80%, rgba(255, 255, 255, 0));
    background: linear-gradient(to left, white, 80%, rgba(255, 255, 255, 0));
    z-index: 93;
}

.list-gradient-arrow > i {
    position: absolute;
    top: 50%;
    right: 3px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #666666;
}

.mobile-search-padding {
    display: none;
    width: 100%;
    height: 90px;
    background-color: #ffffff;
}

.search-pannel-integrated-mb-btn {
    display: none;
    position: fixed;
    bottom: 0;
    left: -300px;
    width: 300px;
    z-index: 1001;
    padding: 20px 26px;
    background-color: #ffffff;
    border-top: 1px solid #eeeeee;
    border-right: 1px solid #d9d9d9;
}

.search-pannel-integrated-mb-btn.show {
    left: 0px;
    -webkit-transition: all .6s ease-in-out;
    -o-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out;
}

.search-pannel-integrated-mb-btn .search-pannel-btn {
    width: 100%;
    height: 40px;
    font-weight: 500;
    background-color: #0b1737;
    border-radius: 3px;
    color: #ffffff;
}

@media (max-width: 768px) {
    .search-pannel-dim {
        background-color: rgba(0, 0, 0, 0.5);
    }

    .mobile-padding,
    .mobile-search-padding {
        display: inline-block;
    }

    #search-pannel .search-pannel-btn-wrap,
    #search-integration-pannel .search-pannel-btn-wrap {
        display: none;
    }

    .search-pannel-mb-btn,
    .search-pannel-integrated-mb-btn {
        display: block;
    }

}

.footer-padding {
    width: 100%;
    height: 50px;
}

@media (max-width: 768px) {
    .footer-padding {
        height: 80px;
    }
}

@media (max-width: 590px) {
    .footer-padding {
        height: 100px;
    }
}


@media (max-width: 540px) {
    .footer-padding {
        height: 140px;
    }
}


@media (max-width: 425px) {
    .footer-padding {
        height: 180px;
    }
}


@media (max-width: 370px) {
    .footer-padding {
        height: 210px;
    }
}


/*위시리스트 보관안내*/
#consign-request-guide {
    margin-bottom: 30px;
}

.consignguide-content {
    padding: 20px 30px;
    background-color: #f9f9f9;
}

.consignguide-content > h4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
    color: #666666;

}

.consignguide-content > h4 > img {
    max-width: 100%;
    margin-right: 5px;
}

.consignguide-content > ul > li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-left: 3px;
}

.consignguide-content > ul > li > .ellipse {
    width: 4px !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    height: 17px;
    margin-right: 8px;
}

.consignguide-content > ul > li > .ellipse > span {
    display: inline-block;
    line-height: initial;
    font-size: 10px;
    color: #666666;
}

.consignguide-content > ul > li > p {
    display: inline-block;
    font-size: 12px;
    line-height: 1.6em;
    color: #666666;
}

@media (max-width: 595px) {
    .consignguide-content {
        padding: 20px 20px;
    }

    .consignguide-content > ul > li {
        margin-bottom: 3px;
    }
}


#empty,
#writer_empty {
    margin-top: -57px;
    width: 100%;
    height: 550px;
    background-color: #f9f9f9;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.result-empty-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.result-empty-wrap > p {
    text-align: center;
    line-height: 1.2em;
    font-size: 14px;
    margin-top: 25px;
    word-break: keep-all;
}

#writer_empty > .result-empty-wrap > .title {
    font-size: 17px;
    color: var(--color-grey_1000);
    font-weight: 700;
    margin-top: 23px;
    text-align: center;
    word-break: keep-all;
}

#writer_empty > .result-empty-wrap > p {
    font-size: 13px;
    line-height: 1.4em;
    color: var(--color-grey_500);
    margin-top: 15px;
}


/* 검색기능을 이렇게 활용하세요. */
#search-empty-cnt {
    margin-top: -57px;
    width: 100%;
    height: 550px;
    background-color: #f9f9f9;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.empty-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.empty-wrap .empty-cnt-tit {
    position: relative;
    padding-bottom: 17px;
    margin-bottom: 50px;
}

.empty-wrap .empty-cnt-tit::after {
    position: absolute;
    content: '';
    left: 50%;
    bottom: 0;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    display: inline-block;
    width: 60px;
    height: 1px;
    background-color: #c0c0c0;
}

.empty-wrap .empty-cnt-tit p {
    font-size: 14px;
}

.empty-wrap .empty-cnt-tit img {
    position: absolute;
    top: -9px;
    left: -19px;
}

.empty-wrap .empty-cnt-desc {
    width: 280px;
}

.empty-wrap .empty-cnt-desc > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 40px;
}

.empty-wrap .empty-cnt-desc > div:last-child {
    margin-bottom: 0px;
}

.empty-wrap .empty-cnt-desc > div > div:nth-child(1) {
    width: 15%;
    padding-top: 10px;
}

.empty-wrap .empty-cnt-desc > div > div:nth-child(1) > span {
    font-size: 12px;
    color: #9d9d9d;
}

.empty-wrap .empty-cnt-desc > div > div:nth-child(2) {
    width: 85%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.empty-wrap .empty-cnt-desc > div > div:nth-child(2) > p {
    line-height: 1.3em;
    color: #4f4f4f;
    padding-top: 10px;
    margin-left: 10px;
}

.bidnoti-table {
    width: 100%;
}


/* skr */
.topbox1 .bidnoti-table tr:first-child th:nth-child(1) {
    width: 7% !important;
}

.topbox1 .bidnoti-table tr:first-child th:nth-child(2) {
    width: 24% !important;
}

.topbox1 .bidnoti-table tr:first-child th:nth-child(3) {
    width: 12% !important;
}

.topbox1 .bidnoti-table tr:first-child th:nth-child(4) {
    width: 12% !important;
}

.topbox1 .bidnoti-table tr:first-child th:nth-child(5) {
    width: 12% !important;
}

.topbox1 .bidnoti-table th:nth-child(6) {
    width: 33% !important;
}

.topbox1.pad {
    padding-right: 12px !important;
}

.modal-bid-noti-btn {
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.modal-bid-noti-btn > button {
    padding: 4px 16px;
    margin-top: 10px;
    font-size: 12px;
    background-color: #071839;
    border-radius: 6px;
    color: #ffffff;
}

.bidnoti-table th,
.bidnoti-table td {
    line-height: 1.3em;
    padding: 6px 4px !important;
    overflow: hidden;
}


@media (max-width: 750px) {
    .modal-bid-noti-btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .modal-gradient-arrow {
        display: block;
    }

    .topbox1 {
        width: 560px;
        background-color: #f5f5f5;
        padding-right: 12px;
    }

    .topbox2 {
        width: 560px;
        height: 100px;
        overflow-y: scroll;
    }
}


.join-container {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0 auto;
}

.join-wrap {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.join_step01 {
    position: relative;
    width: 540px;
}

.join-title {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 15px;
    margin-top: 35px;
    margin-bottom: 60px;
}

.join-title > p {
    font-size: 20px;
    line-height: 1.15em;
}


.join_cnt_wrap {
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 50px 50px;
    border-radius: 10px;
}

.join_cnt_wrap > p {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

.join-accordion-menu .join-accordion-head {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 0;
}

#join-accordion > div:last-child > .join-accordion-head {
    border-bottom: none;
}

.join-accordion-menu .join-accordion-head > span {
    position: absolute;
    top: 50%;
    right: 0px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 13px;
    color: #939393;
    cursor: pointer;
}

.join-accordion-menu .join-accordion-head > div {
    width: 390px;
}

.join-accordion-menu .join-accordion-head > div input {
    display: none;
}

.join-conditions + label {
    position: relative;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 0;
}

.join-conditions + label > div {
    width: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 0;
    margin-right: 15px;
}

.join-conditions + label > strong {
    width: 92%;
    display: inline-block;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.4em;
}

.join-accordion-menu .join-accordion-head .join-conditions + label > strong {
    color: #7d7d7d;
}

.join-conditions + label > div > span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #ffffff;
    border-radius: 20px;
    border: 1px solid #D1D1D1;
}

.join-conditions + label > div > span i {
    font-size: 12px;
    font-weight: 500;
    color: #d1d1d1;
}

.join-conditions:checked + label > div > span {
    background: #173b7d;
    border: 1px solid #173b7d;
}

.join-conditions:checked + label > div > span i {
    color: #ffffff;
}

.join-conditions:checked + label > div > span:after {
    background: #ffffff;
    -webkit-box-shadow: 2px 0 0 #ffffff, 4px 0 0 #ffffff, 4px -2px 0 #ffffff, 4px -4px 0 #ffffff, 4px -6px 0 #ffffff, 4px -8px 0 #ffffff;
    box-shadow: 2px 0 0 #ffffff, 4px 0 0 #ffffff, 4px -2px 0 #ffffff, 4px -4px 0 #ffffff, 4px -6px 0 #ffffff, 4px -8px 0 #ffffff;
}

.join-accordion-menu .join-accordion-head .join-conditions:checked + label > strong {
    color: #000000;
}

.join-accordion-menu .join-accordion-desc {
    width: 450px;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.6s cubic-bezier(.3, .2, .08, 1);
    -o-transition: all 0.6s cubic-bezier(.3, .2, .08, 1);
    transition: all 0.6s cubic-bezier(.3, .2, .08, 1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 20px;
}

.join-accordion-menu .join-accordion-desc.show {
    height: 100px;
    padding: 10px 20px;
    overflow: auto;
}

.join-accordion-menu .join-accordion-desc > p {
    margin-bottom: 0;
    font-size: 12px;
}

.join-all-agree-wrap {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-bottom: 15px;
    border-bottom: 1px solid #dedede;
}

.join-all-agree-wrap > p {
    font-size: 12px;
    line-height: 1.2em;
    color: #636363;
    width: 100%;
    margin-left: 38px;
}

.join-all-agree-cnt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.join-all-agree-cnt input {
    display: none;
}

.join-all-agree-cnt > label {
    width: 100%;
}

.join-all-agree-cnt > label > div > span,
.join-all-agree-cnt > label > .check > span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.join-all-agree-cnt > label > div > span i,
.join-all-agree-cnt > label > div.check > span i {
    font-size: 14px;
    font-weight: 500;
    color: #d1d1d1;
}

.join-all-agree-cnt input:checked + label > div.check > span i {
    color: #ffffff;
}


.join-all-agree-cnt.all-certified .join-conditions + label > div.text {
    width: 92%;
    display: inline-block;
    margin-right: 0;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.4em;
}

.join-all-agree-cnt.all-certified .join-conditions + label > div.text > strong {
    font-family: "Noto Sans", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.2em;
    color: #000000;
}

.join-all-agree-wrap .text > p {
    font-family: "Noto Sans", sans-serif;
    font-size: 12px;
    line-height: 1.2em;
    color: #636363;
}


.join-all-agree-cnt > label > strong {
    /* width: 89%; */
    font-size: 16px;
    line-height: 1.2em;
}


.join-all-agree-cnt > label > div > span:after {
    display: none !important;
}


.join_footer_wrap {
    width: 100%;
    text-align: center;
    padding: 15px 15px 60px 15px;
}

.join_footer_wrap ul {
    font-size: 0;
}

.join_footer_wrap ul li {
    position: relative;
    display: inline-block;
    line-height: initial;
    padding: 0 8px;
}

.join_footer_wrap ul li:last-child::after {
    display: none;
}

.join_footer_wrap ul li::after {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    display: inline-block;
    width: 1px;
    height: 10px;
    background-color: #888888;
}

.join_footer_wrap ul li a {
    font-size: 14px;
    font-weight: 400;
    color: #888888;
}

.join_footer_wrap ul li a.PrivacyClause {
    font-weight: 500;
}

.join_footer_wrap ul li:hover a {
    text-decoration: underline;
}

.join_footer_wrap .copyright {
    margin-top: 3px;
}

.join_footer_wrap .copyright span,
.join_footer_wrap .copyright a {
    color: #888888;
}


.join-certified-dropdown {
    margin-bottom: 20px;
}

.join-certified {
    margin-top: 32px;
    border: 1px solid #dedede;
    background-color: #ffffff;
}

.join-certified-dropdown {
    padding-top: 21px;
    text-align: center;
    margin-bottom: 15px;
}

#join-certified-select {
    width: auto; /* 원하는 너비설정 */
    font-family: inherit; /* 폰트 상속 */
    font-size: 16px;
    padding: 5px 30px 5px 10px;
    border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-weight: 600;
    border: none;
    text-decoration: underline;
    background: none;
    /* background: url(../img/icons/schedule-img.png) no-repeat 95% 50%; */
}

.join-certified-dropdown > div {
    display: inline-block;
    position: relative;
}

.join-certified-dropdown > div > i {
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.join-input {
    width: 300px; /* 원하는 너비설정 */
    height: 50px;
    font-family: inherit; /* 폰트 상속 */
    font-size: 15px;
    border: none;
    padding: 10px 15px;
    border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: none;
}

.join-content {
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 50px 50px;
    border-radius: 10px;
}

.join-content > p {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

.join-content > .first_box > div > p > label {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 5px;
}

.join-certified-desc > div > .title > p {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
}

.join-certified-desc > div .certified-btn {
    width: 100%;
    font-size: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 16px;
}

.join-certified-desc > div .certified-btn > button {
    position: relative;
    font-size: 14px;
    line-height: 1.4em;
    width: auto;
    background-color: #ffffff;
    border: 1px solid #e7e7e7;
    border-radius: 6px;
    padding: 16px 33px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-shadow: 1px 2px 3px 1px rgba(235, 235, 235, 0.3);
    box-shadow: 1px 2px 3px 1px rgba(235, 235, 235, 0.3);
}

.join-certified-desc > div .certified-btn > button.on {
    z-index: 1;
}

.join-certified-desc > div .certified-btn > button:nth-child(1) {
    margin-right: 10px;
}

.join-certified-desc > div .certified-btn > button > span {
    display: inline-block;
    max-width: 100px;
    margin-top: 10px;
    font-size: 14px;
    text-decoration: underline;
    word-break: keep-all;
}


.overseas-member_input {
    padding: 18px 35px 28px 35px;
}

.join-input-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #e5e5e5;
}

.join-input-btn > input {
    padding: 10px 15px 10px 0;
}

/* 3월24일수정 */
.overseas-member_input > div {
    border: none;
}

.overseas-member_input > div > .usernumber_input {
    position: relative;
    width: 100%;
}

.overseas-member_input > div > .usernumber_input > input {
    width: 100%;
}

/* 
.overseas-member_input > div.join_02 > .usernumber_input {
  width: 60%;
}
.overseas-member_input > div.join_02 > .usernumber_btn {
  width: 40%;
} */

.join-input-btn > input::-webkit-input-placeholder {
    color: #b0b0b0;
}

.join-input-btn > input::-moz-placeholder {
    color: #b0b0b0;
}

.join-input-btn > input:-ms-input-placeholder {
    color: #b0b0b0;
}

.join-input-btn > input::-ms-input-placeholder {
    color: #b0b0b0;
}

.join-input-btn > input::placeholder {
    color: #b0b0b0;
}

.join-input-btn > .usernumber_input > input::-webkit-input-placeholder {
    color: #B0B0B0;
}

.join-input-btn > .usernumber_input > input::-moz-placeholder {
    color: #B0B0B0;
}

.join-input-btn > .usernumber_input > input:-ms-input-placeholder {
    color: #B0B0B0;
}

.join-input-btn > .usernumber_input > input::-ms-input-placeholder {
    color: #B0B0B0;
}

.join-input-btn > .usernumber_input > input::placeholder {
    color: #B0B0B0;
}

.join-input-btn > .usernumber_btn {
    position: relative;
    width: 28%;
    text-align: right;
}

.join-input-btn > .usernumber_input .usernumber_input_time {
    font-size: 12px;
    color: #ff0000;
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.join-input-btn > .usernumber_btn > button {
    height: auto;
    background-color: #F3F3F3;
    border: 1px solid var(--color-grey_400);
    color: var(--color-grey_900);
    line-height: 1.2em;
    border-radius: 4px;
    font-size: 14px;
    padding: 5px 8px;
    margin: 2px 0;
}

button.disabled {
    background-color: #F9F9F9 !important;
    color: var(--color-grey_400) !important;
    border-color: var(--color-grey_200) !important;
}


.join-input-btn > .usernumber_btn > button.on {
    background-color: #2B3A70;
    color: #ffffff;
    border-color: #2B3A70;
}

.complete_check {
    font-weight: 400;
    color: #2B3A70;
}

.overseas-individuals-member > div:first-child,
.overseas-artificial-member > div:first-child {
    margin-bottom: 10px;
}


.join-input-btn.disabled > button {
    background-color: #c5c5c5;
}


.join-id {
    width: 100%;
}

.join-id > div {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.join-id > div > .input {
    position: relative;
    width: 100%;
}

.join-id > div > .input > .id_btnClear {
    display: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 15px;
    cursor: pointer;
}

.join-id > div > .joinid_btn {
    width: 17%;
    text-align: right;
    margin-right: 15px;
}

.join-id > div > .joinid_btn > button {
    height: auto;
    background-color: #f6f6f6;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    font-size: 14px;
    padding: 0 8px;
}


.join-content > .first_box > div input {
    width: 100%;
}


.error_box {
    display: none;
    font-size: 11px;
    line-height: 1.2em;
    color: #b0b0b0;
    margin-top: -10px;
    padding-left: 15px;
    padding-bottom: 15px;
}


.certified {
    position: relative;
}

.certified > input {
    width: 100%;
    background-color: #ffffff;
    color: #000000;
}

.certified .certified-check {
    position: absolute;
    right: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 10;
}

.certified .certified-check > span {
    font-size: 13px;
    color: #267746;
    cursor: pointer;
}

.certified .certified-check > span:hover {
    text-decoration: underline;
}

.certified .join_page_tooltip {
    display: none;
    top: 42px;
    right: -10px;
    width: 125px;
    padding: 12px;
    z-index: 11;
}

.certified .join_page_tooltip::after {
    left: 56%;
}

.certified .join_page_tooltip i {
    display: none;
}


.certified .certified-check > i {
    font-weight: 400;
    color: #173b7d;
}

.join-agree-check {
    display: none;
}

.join-agree-check + label {
    position: relative;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.join-agree-check + label > div {
    width: 20%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0;
}

.join-agree-check + label > p {
    width: 80%;
    display: inline-block;
    font-weight: 400;
    line-height: 1.2em;
}

.join-agree-check + label > div > span {
    display: inline-block;
    vertical-align: text-top;
    width: 18px;
    height: 18px;
    background: #ffffff;
    border: 1px solid #9d9d9d;
}

.join-personal-info-check {
    padding: 10px 20px;
    border: 1px solid #E1E1E1;
}

.join-personal-info-check > div:first-child {
    margin-bottom: 10px;
}

.join-personal-info-check > div > input {
    display: none;
}

.join-personal-info-check .join-conditions + label > div {
    width: 10%;
}

.join-personal-info-check .join-conditions + label > strong {
    width: 90%;
}

.join-personal-info-all-check {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 5px;
}

.join-personal-info-all-agree input {
    display: none;
}

.join-personal-info-all-agree {
    width: 100%;
}

.join-personal-info-all-agree .join-conditions + label > div {
    width: 10%;
    margin-left: 13px;
}

.join-personal-info-all-agree .join-conditions + label > strong {
    width: 90%;
}

.join-personal-info-all-check .precautions {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.join-content > div {
    margin: 0 0 25px 0;
}

.join-content > div > h4 {
    font-size: 16px;
}

.first_box > div,
.second_box > div {
    border-bottom: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    border-right: 1px solid #e1e1e1;
    background-color: #ffffff;
}

.first_box > div:first-child,
.second_box > div:first-child {
    border-top: 1px solid #e1e1e1;
}

.first_box input::-webkit-input-placeholder {
    color: #b0b0b0;
}

.first_box input::-moz-placeholder {
    color: #b0b0b0;
}

.first_box input:-ms-input-placeholder {
    color: #b0b0b0;
}

.first_box input::-ms-input-placeholder {
    color: #b0b0b0;
}

.first_box input::placeholder {
    color: #b0b0b0;
}

.attention_contents_choice {
    position: relative;
    padding: 20px 25px 20px 25px;
}

.attention_contents_dim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.2);
}

.attention_contents > div {
    margin-bottom: 50px;
}

.attention_contents > div:last-child {
    margin-bottom: 0;
}

.attention_part_box_wrap {
    font-size: 0;
    margin: 0 -2px;
}


/* 국내개인 */
.join-certified-desc > div > p.desc {
    text-align: center;
    font-size: 13px;
    line-height: 1.2em;
    color: #636363;
    margin-bottom: 22px;
    padding: 0 24px;
    word-break: keep-all;
}


.join-certified-desc .join-member-certified_box {
    padding: 18px 14px;
    background-color: #f9f9f9;
}

.join-certified-desc .join-member-certified_box ul li {
    font-size: 12px;
    line-height: 1.2em;
    color: #636363;
    padding-left: 7px;
}

.join-certified-desc .join-member-certified_box ul {
    margin-bottom: 5px;
}

.join-certified-desc .join-member-certified_box > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 5px;
}

.join-certified-desc .join-member-certified_box > div > div {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 3%;
    height: 14px;
}

.join-certified-desc .join-member-certified_box > div > div > span {
    font-size: 18px;
}

.join-certified-desc .join-member-certified_box > div > p {
    display: inline-block;
    width: 97%;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 1.2em;
    word-break: keep-all;
}


.join_step_tit {
    margin: 60px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.join_step_tit > p {
    font-size: 26px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 25px;
}

ul.join_step_list {
    position: relative;
    width: 225px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

ul.join_step_list::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 1px;
    background-color: #E1E1E1;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1;
}

ul.join_step_list li {
    position: relative;
    width: 24px;
    height: 24px;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    background-color: #ffffff;
    border: 1px solid #E1E1E1;
    color: #cccccc;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 24px;
    padding: 0;
    font-size: 13px;
    line-height: 1.4em;
    z-index: 2;
}

ul.join_step_list li.on {
    background-color: #2B3A70;
    color: #ffffff;
    border-color: #2B3A70;
}

ul.join_step_list li.on::after {
    color: #000000;
}

ul.join_step_list li::after {
    position: absolute;
    bottom: -24px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    /*content: '동의 및 인증';*/
    font-size: 11px;
    white-space: nowrap;
    color: #cccccc;
    font-weight: 400;
}

ul.join_step_list li:nth-child(2):after {
    /*content: '정보 입력';*/
}

ul.join_step_list li:nth-child(3):after {
    /*content: '가입 완료';*/
}


.join_form_agree_wrap {
    padding: 32px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #e1e1e1;
}

.third_box {
    background-color: #ffffff;
    padding: 0 !important;
    margin-bottom: 25px;
    border: 1px solid #e5e5e5;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.join_form_agree_wrap > p {
    font-size: 15px;
    line-height: 1.4em;
    margin-bottom: 25px;
    text-align: center;
}

.join_form_agree_wrap > p > a {
    text-decoration: underline;
    color: #000000;
    font-weight: 600;
}

.join_form_agreebtn_wrap {
    font-size: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.join_form_agreebtn_wrap > div {
    width: 180px;
    height: auto;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #f1f1f1;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    cursor: pointer;
}

.join_form_agreebtn_wrap > div:first-child {
    margin-right: 14px;
}

.join_form_agreebtn_wrap > div > div {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 8px 5px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.join_form_agreebtn_wrap > div i {
    font-size: 11px;
    font-weight: 500;
}

.join_form_agreebtn_wrap > div span {
    display: inline-block;
    margin-left: 10px;
    font-size: 14px;
    line-height: 1.4em;
    text-align: center;
}

.join_form_agreebtn_wrap > div i {
    color: #b0b0b0;
    font-weight: 400;
}

.join_form_agreebtn_wrap > div.on i {
    color: #ffffff;
    font-weight: 600;
}

.join_form_agreebtn_wrap > div.on {
    background-color: #151a43;
    border-color: #151a43;
}

.join_form_agreebtn_wrap > div.on span {
    color: #ffffff;
}


.zipcode-wrap {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 15px;
}

.zipcode_dim {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.2);
    border: none !important;
}


.zipcode-wrap > div {
    border-bottom: 1px solid #e5e5e5;
}

.zipcode-wrap > div:last-child {
    border-bottom: none;
}

.zipcode-wrap > div > input {
    width: 100%;
}

.zipcode-wrap > div > input::-webkit-input-placeholder {
    color: #b0b0b0;
}

.zipcode-wrap > div > input::-moz-placeholder {
    color: #b0b0b0;
}

.zipcode-wrap > div > input:-ms-input-placeholder {
    color: #b0b0b0;
}

.zipcode-wrap > div > input::-ms-input-placeholder {
    color: #b0b0b0;
}

.zipcode-wrap > div > input::placeholder {
    color: #b0b0b0;
}

.zipcode_search_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.zipcode_search_wrap > .input {
    width: 80%;
}

.zipcode_search_wrap > .input > input {
    width: 100%;
}

.zipcode_search_wrap > .input > input::-webkit-input-placeholder {
    color: #b0b0b0;
}

.zipcode_search_wrap > .input > input::-moz-placeholder {
    color: #b0b0b0;
}

.zipcode_search_wrap > .input > input:-ms-input-placeholder {
    color: #b0b0b0;
}

.zipcode_search_wrap > .input > input::-ms-input-placeholder {
    color: #b0b0b0;
}

.zipcode_search_wrap > .input > input::placeholder {
    color: #b0b0b0;
}

.zipcode_search_wrap > .joinid_btn {
    width: 20%;
    text-align: right;
}

.zipcode_search_wrap > .joinid_btn > button {
    height: 32px;
    background-color: #f6f6f6;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    white-space: nowrap;
    font-size: 14px;
    padding: 0 8px;
    white-space: nowrap;
}

.zipcode-wrap .join-all-agree-cnt {
    position: relative;
    padding: 15px 15px;
}


/* 툴팁 css */
.zipcode-wrap .join-all-agree-cnt .join_page_tooltip {
    bottom: -46px;
    left: 0px;
    z-index: 10;
}

/* .zipcode-wrap .join-all-agree-cnt .join_page_tooltip i {
  display: none;
} */
.join_page_tooltip {
    display: none;
    position: absolute;
    background-color: #7a7a7a;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 11px 24px;
    border-radius: 6px;
}

.join_page_tooltip::after {
    content: "";
    width: 0px;
    height: 0px;
    display: block;
    position: absolute;
    left: 10%;
    top: -14px;
    border-bottom: 7px solid #7a7a7a;
    border-right: 7px solid rgba(0, 0, 0, 0);
    border-left: 7px solid rgba(0, 0, 0, 0);
    border-top: 7px solid rgba(0, 0, 0, 0);
}

.join_page_tooltip > p {
    color: #ffffff;
    font-size: 13px;
    line-height: 1.2em;
    text-align: center;
}

.join_page_tooltip > p > span {
    color: #ffb68c;
}

.join_page_tooltip > i {
    position: absolute;
    top: 7px;
    right: 7px;
    font-weight: 400 !important;
    font-size: 12px;
    line-height: 1em;
    color: #ffffff;
    cursor: pointer;
}


.zipcode-wrap .join-all-agree-cnt strong {
    font-size: 13px;
    color: #808080;
}


.fourth_box {
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
}

.attention_part_contents > .title {
    margin-bottom: 20px;
}

.attention_part_contents > .title > p {
    font-size: 14px;
}

.attention_part_contents > .title > p > span {
    color: #707070;
}

.attention_part_box_wrap {
    font-size: 0;
}

.attention_part_box_wrap .attention_part_contents_box {
    display: inline-block;
    width: 49%;
    height: 67px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 6px;
    background-color: #ffffff;
    text-align: center;
}

.attention_part_box_wrap .attention_part_contents_box input {
    display: none;
}

.attention_part_box_wrap > div:nth-child(2n) {
    margin-left: 2%;
}

.attention_part_box_wrap .attention_part_contents_box label {
    width: 100%;
    height: 100%;
    padding: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 0;
    cursor: pointer;
    border: 1px solid #e9e9e9;
    border-radius: 6px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.attention_part_box_wrap .attention_part_contents_box label p {
    font-size: 13px;
    line-height: 1.1em;
    color: #707070;
}

.attention_part_box_wrap .attention_part_contents_box label > div {
    display: inline-block;
    line-height: 0.5em;
}

.attention_part_box_wrap .attention_part_contents_box label > div > i {
    font-size: 10px;
    color: #b0b0b0;
}


.attention_part_contents_checkbox:checked + label > div > i {
    color: #000000;
}

.attention_part_contents_checkbox:checked + label {
    border-color: #101752;
    border-width: 2px;
}

.attention_part_contents_checkbox:checked + label > p {
    color: #000000;
}

.join_writer_registration_01 {
    position: relative;
    width: 80%;
}

.join_writer_registration_01 > input {
    width: 100%;
}

.join_writer_registration_01 > input::-webkit-input-placeholder {
    color: #b0b0b0;
}

.join_writer_registration_01 > input::-moz-placeholder {
    color: #b0b0b0;
}

.join_writer_registration_01 > input:-ms-input-placeholder {
    color: #b0b0b0;
}

.join_writer_registration_01 > input::-ms-input-placeholder {
    color: #b0b0b0;
}

.join_writer_registration_01 > input::placeholder {
    color: #b0b0b0;
}

.join_writer_registration_01 > .join_writer_btnclear {
    display: none;
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    cursor: pointer;
}

.join_writer_registration_02 {
    width: 20%;
    height: 100%;
}

.join_writer_registration_02 > button {
    background-color: #151a43;
    width: 100%;
    height: 100%;
    color: #ffffff;
    font-size: 13px;
}

.join_writer_registration {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #e5e5e5;
    height: 38px;
    border-radius: 6px;
    overflow: hidden;
}

.join_writer_registration_input {
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    font-size: 15px;
    line-height: 1.2em;
}


.form-control.search-page {
    height: 38px;
    border-radius: 0 !important;
    border: none !important;
    padding: 6px 16px;
    border-top-left-radius: 3px !important;
    border-bottom-left-radius: 3px !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}


.gender_checkbox_cnt {
    position: relative;
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 32.3334%;
    height: 31px;
}

.gender_checkbox_cnt input {
    display: none;
}

.gender_checkbox + label {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 8px 0;
    border: 1px solid #e5e5e5;
    text-align: center;
    border-radius: 6px;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: inherit;
    margin-bottom: 0;
}

.gender_checkbox + label > div {
    position: absolute;
    top: 50%;
    left: 17px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    line-height: 0.5em;
}

.gender_checkbox + label > div > i {
    color: #b0b0b0;
    font-size: 10px;
    line-height: 1.2em;
    font-weight: 500;
}

.gender_checkbox + label > p {
    display: inline-block;
    font-size: 14px;
    line-height: 1.2em;
}

.gender_checkbox:checked + label {
    border-color: #151a43;
    border-width: 2px;
}

.gender_checkbox:checked + label > div > i {
    color: #000000;
}


.fifth_box {
    border: 1px solid #e5e5e5;
}

.fifth_box > .join_ad_agree_wrap {
    background-color: #ffffff;
    padding: 17px 0px;
}

.join_ad_agree_wrap input {
    display: none;
}

.join_ad_agree_wrap .join-conditions + label > div > span {
    background-color: #ffffff;
    border-color: #b0b0b0;
}

.join_ad_agree_wrap .join_ad_all_agree + label > div > span {
    width: 24px;
    height: 24px;
}

.join_ad_agree_wrap .join_ad_all_agree + label > div > span i {
    font-size: 14px;
    font-weight: 500;
}


.join_ad_agree_wrap .join-conditions:checked + label > div > span {
    background-color: #151a43;
    border-color: #151a43;
}

.join_ad_agree_wrap .join-conditions:checked + label > div > span > i {
    color: #ffffff;
}

.join_ad_agree_cnt {
    padding: 0 25px 14px 25px;
    border-bottom: 1px solid #e5e5e5;
}

.join_ad_agree_cnt label div {
    width: 9%;
}

.join_ad_agree_cnt label strong {
    width: 91%;
    font-size: 15px;
}

.join_ad_agree_choice_cnt {
    font-size: 0;
    margin-top: 10px;
}

.join_ad_agree_choice_cnt > p {
    font-size: 13px;
    padding: 0 25px;
    margin-bottom: 17px;
}

.join_ad_agree_choice_cnt > div {
    padding: 0 25px;
    white-space: nowrap;
}

.join_ad_agree_choice_cnt > div > div {
    display: inline-block;
    padding-right: 40px;
    margin-right: 10px;
}


.join_ad_agree_choice_cnt .join-conditions + label {
    width: 100%;
    display: inline-block;
    vertical-align: top;
}

.join_ad_agree_choice_cnt .join-conditions + label > div {
    display: inline-block;
    line-height: initial;
    width: auto;
    vertical-align: top;
    margin-right: 6px;
}

.join_ad_agree_choice_cnt .join-conditions + label > strong {
    display: inline-block;
    width: auto;
}

.join_ad_agree_desc {
    padding: 15px 25px;
    background-color: #f9f9f9;
}

.join_ad_agree_desc > p {
    font-size: 12px;
    line-height: 1.2em;
    color: #808080;
}

.sixth_box {
    padding-top: 18px;
}

.sixth_box > button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 58px;
    background-color: #11062f;
    font-size: 15px;
    color: #ffffff;
    border-radius: 8px;
}


#join_job_select {
    width: 100%;
    height: 45px;
    border: 1px solid #e5e5e5;
    padding: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(../img/icons/schedule-img.png) no-repeat 95% 50%;
}

.join_job_input_box {
    display: none;
}

.join_job_input_box > div {
    margin-top: -1px;
}

.join_job_input_box input {
    width: 100%;
    height: 45px;
    padding: 10px;
    border: 1px solid #e5e5e5;
    color: #000000;
}

.join_job_input_box input::-webkit-input-placeholder {
    color: #b0b0b0;
}

.join_job_input_box input::-moz-placeholder {
    color: #b0b0b0;
}

.join_job_input_box input:-ms-input-placeholder {
    color: #b0b0b0;
}

.join_job_input_box input::-ms-input-placeholder {
    color: #b0b0b0;
}

.join_job_input_box input::placeholder {
    color: #b0b0b0;
}

.join_writer_registration_list > div {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 3px 20px 3px 8px;
    font-size: 0;
    border-radius: 25px;
    border: 1px solid #e5e5e5;
    background-color: #f3f3f3;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 3px;
    margin: 3px 0;
    cursor: pointer;
}


.join_writer_registration_list {
    margin-top: 5px;
}

.join_writer_registration_list > div > span {
    font-size: 12px;
    line-height: 1.2em;
    font-weight: 400;
    color: #707070;
}

.join_writer_registration_list > div button i {
    font-size: 10px;
    color: #707070;
    font-weight: 400;
    line-height: initial;
}

.join_writer_registration_list > div button {
    background-color: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 9px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.joincomlete-wrap {
    width: 540px;
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 40px 50px;
    border-radius: 10px;
    box-sizing: border-box;
}

.joincomlete_tit {
    margin-bottom: 25px;
    text-align: center;
}


@-webkit-keyframes outline {
    from {
        stroke-dasharray: 0, 3.1416 *55px *2;
    }
    to {
        stroke-dasharray: 3.1416 *55px *2, 3.1416 *55px *2;
    }
}


@keyframes outline {
    from {
        stroke-dasharray: 0, 3.1416 *55px *2;
    }
    to {
        stroke-dasharray: 3.1416 *55px *2, 3.1416 *55px *2;
    }
}

#outline {
    -webkit-animation: .38s ease-in outline;
    animation: .38s ease-in outline;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
}

@-webkit-keyframes circle {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    to {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
}

@keyframes circle {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    to {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
}

#white-circle {
    -webkit-animation: .35s ease-in .35s forwards circle;
    animation: .35s ease-in .35s forwards circle;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
}

@-webkit-keyframes check {
    from {
        stroke-dasharray: 0, 75px;
    }
    to {
        stroke-dasharray: 75px, 75px;
    }
}

@keyframes check {
    from {
        stroke-dasharray: 0, 75px;
    }
    to {
        stroke-dasharray: 75px, 75px;
    }
}

#check {
    -webkit-animation: .34s cubic-bezier(0.65, 0, 1, 1) .8s forwards check;
    animation: .34s cubic-bezier(0.65, 0, 1, 1) .8s forwards check;
    stroke-dasharray: 0, 75px;
}

@-webkit-keyframes check-group {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.09);
        transform: scale(1.09);
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes check-group {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.09);
        transform: scale(1.09);
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

#check-group {
    -webkit-animation: .32s ease-in-out 1.03s check-group;
    animation: .32s ease-in-out 1.03s check-group;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
}


.joincomlete_tit > h2 {
    font-size: 20px;
    margin-top: 22px;
    line-height: 1.2em;
}

.joincomlete_tit > h2 > strong {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.joincomlete_tit > h2 > strong > span {
    display: inline-block;
    position: relative;
}

.joincomlete_tit > h2 > strong > span::after {
    content: '*';
    position: absolute;
    top: -12px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 11px;
}

.joincomlete_cnt {
    margin-bottom: 44px;
}

.joincomlete_cnt > p {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 5px;
}

.join_info_form {
    width: 100%;
    border-top: 1px solid #c1c1c1;
    border-bottom: 1px solid #c1c1c1;
}

.join_info_form td {
    text-align: center;
    padding: 12px 5px;
    border-bottom: 1px solid #dedede;
}

.join_info_form td:first-child {
    width: 35%;
    background-color: #eeeeee;

}

.join_info_form td:last-child {
    width: 65%;
    background-color: #ffffff;
}

.joincomlete_cnt > span {
    font-size: 12px;
    margin-top: 5px;
    color: #535353;
}

.joincomlete_cnt > span > a {
    color: #000000;
}

.joincomlete_cnt > span > a:hover {
    text-decoration: underline;
}

.joincomlete_btn_cnt > p {
    text-align: center;
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.joincomlete_btn_cnt > p > a {
    color: #000000;
    line-height: 1.4em;
}

.joincomlete_btn_cnt > p:hover > a {
    text-decoration: underline;
}

.joincomlete_btn_cnt > p > i {
    font-size: 12px;
    margin-left: 7px;
    color: #565656;
    font-weight: 500;
}

.joincomlete_btn_cnt > button {
    margin-top: 12px;
    width: 100%;
    height: 58px;
    color: #ffffff !important;
    background-color: var(--color-blue_900);
    border-radius: 8px;
}

.joincomlete_btn_cnt > button:hover {
    background-color: var(--color-blue_1000);
}

.ka-container .ka-content-wrapper .bottom-menu .company_about_list ul li a {
    width: 100%;
    display: block!important;
    color: #FFF!important;
    font-family: Noto Sans KR;
    font-size: 15px;
    font-weight: 700;
    line-height: 21px;
    margin-right: 42px;
}

.ka-container .ka-content-wrapper .bottom-menu .company_about_list ul li:hover a {
    color: #C1C1C1!important;
}


.zipcode-conditions-all-agree + label > div > span {
    background-color: #ffffff;
    border-color: #b0b0b0;
    width: 20px;
    height: 20px;
}

.zipcode-conditions-all-agree + label > div > span i {
    font-size: 12px;
}

.zipcode-conditions-all-agree:checked + label > div > span i {
    color: #ffffff;
}


.second_box.domestic_organizations input[type="text"] {
    height: 50px;
}

.domestic_organizations_form > div,
.domestic_organizations_number_form > div,
.domestic_organizations_documents > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.domestic_organizations_number_form > div > .input,
.domestic_organizations_documents > div > input {
    width: 80%;
}

.domestic_organizations_form > div,
.domestic_organizations_form > div > input {
    width: 100%;
}

.domestic_organizations_number_form input::-webkit-input-placeholder, .domestic_organizations_form input::-webkit-input-placeholder, .domestic_organizations_documents input::-webkit-input-placeholder, .third_box input::-webkit-input-placeholder {
    color: #b0b0b0;
}

.domestic_organizations_number_form input::-moz-placeholder, .domestic_organizations_form input::-moz-placeholder, .domestic_organizations_documents input::-moz-placeholder, .third_box input::-moz-placeholder {
    color: #b0b0b0;
}

.domestic_organizations_number_form input:-ms-input-placeholder, .domestic_organizations_form input:-ms-input-placeholder, .domestic_organizations_documents input:-ms-input-placeholder, .third_box input:-ms-input-placeholder {
    color: #b0b0b0;
}

.domestic_organizations_number_form input::-ms-input-placeholder, .domestic_organizations_form input::-ms-input-placeholder, .domestic_organizations_documents input::-ms-input-placeholder, .third_box input::-ms-input-placeholder {
    color: #b0b0b0;
}

.domestic_organizations_number_form input::placeholder,
.domestic_organizations_form input::placeholder,
.domestic_organizations_documents input::placeholder,
.third_box input::placeholder {
    color: #b0b0b0;
}

.domestic_organizations_number_form .form-btn,
.domestic_organizations_documents > div > .form-btn {
    width: 20%;
    text-align: right;
    border: none !important;
    margin-right: 15px;
    background-color: #ffffff !important;
}

.domestic_organizations_number_form .form-btn > button {
    display: inline-block;
    height: 32px;
    background-color: #f6f6f6;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    font-size: 14px;
    margin-bottom: 0;
    padding: 0 8px;
    cursor: pointer;
    color: #000000;
    white-space: nowrap;
}

.domestic_organizations_form .form-btn > label,
.domestic_organizations_documents > div > .form-btn > label {
    display: inline-block;
    /* height: 32px; */
    line-height: 1.2em;
    background-color: #f6f6f6;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    font-size: 14px;
    margin-bottom: 0;
    padding: 3px 8px;
    text-align: center;
    margin: 2px 0;
    cursor: pointer;
    color: #000000;
}

.domestic_organizations_documents > p {
    font-size: 12px;
    color: #606060;
    padding: 0 15px 11px 15px;
    line-height: 1.2em;
}


.second_box .organizations_desc {
    background-color: #AEAEAE;
    text-align: center;
    padding: 13px 15px;
}

.second_box .organizations_desc > p {
    color: #ffffff;
    line-height: 1.2em;
}


@media (max-width: 540px) {
    .join_cnt_wrap {
        padding: 40px 30px;
    }

    .join_step02_tit > a > img:nth-child(1) {
        display: none;
    }

    .join_step02_tit > a > img:nth-child(2) {
        display: inline-block;
    }

    .sixth_box {
        padding-top: 0;
    }

    .join-container {
        padding-left: 15px;
        padding-right: 15px;
    }

    .join_step01 {
        width: 100%;
    }

    .join-title {
        padding-left: 0;
        margin-top: 115px;
        margin-bottom: 38px;
    }

    .join-all-agree-wrap {
        padding-left: 0;
    }

    .join-accordion-menu .join-accordion-head {
        padding: 10px 0;
    }

    .overseas-member_input {
        padding: 18px 24px 28px 24px;
    }

    .join-accordion-menu .join-accordion-head > span {
        right: 13px;
    }

    .join-input-btn > .usernumber_btn > button {
        font-size: 13px;
    }

    /* .overseas-member_input > div > .usernumber_input {
    width: 60%;
  } */
    .join-input-btn > .usernumber_btn {
        width: 40%;
    }

    .join-certified-desc > div:nth-child(2) .certified-btn > button {
        padding: 12px 15px;
    }

    .join-id > div > .joinid_btn > button {
        font-size: 13px;
    }

    .zipcode_search_wrap > .joinid_btn > button {
        font-size: 13px;
    }

    .attention_contents_choice {
        padding: 20px 15px 20px 15px;
    }

    .join_ad_agree_cnt {
        padding: 0 15px 14px 15px;
    }

    .join_ad_agree_choice_cnt > p,
    .join_ad_agree_choice_cnt > div {
        padding: 0 15px;
    }

    .join_ad_agree_desc {
        padding: 15px 15px;
    }

    .join_ad_agree_cnt label div {
        width: 8%;
        margin-right: 1%;
    }

    .join_ad_agree_cnt label strong {
        width: 91%;
    }


    .domestic_organizations_number_form > div > .input, .domestic_organizations_documents > div > input,
    .zipcode_search_wrap > .input {
        width: 75%;
    }

    .zipcode_search_wrap > .joinid_btn,
    .domestic_organizations_number_form .form-btn, .domestic_organizations_documents > div > .form-btn {
        width: 25%;
    }

    .domestic_organizations_number_form > div > .input > input,
    .joincomlete-wrap {
        width: 100%;
    }
}


@media (max-width: 460px) {

    .join_step_tit {
        margin: 40px 0 50px 0;
    }

    .join_step_tit > p {
        font-size: 24px;
        margin-bottom: 15px;
    }

    .join_cnt_wrap > p {
        font-size: 18px;
    }

    .join-content > p {
        font-size: 18px;
    }

    .join-certified-desc > div .certified-btn > button {
        padding: 16px 25px;
    }


    .join_form_agreebtn_wrap {
        width: 100%;
        padding: 0 15px;
    }

    .join_form_agreebtn_wrap > div {
        width: 49%;
    }

    .join_form_agreebtn_wrap > div:first-child {
        margin-right: 2%;
    }

    .join-certified-desc > div .certified-btn > button > span {
        font-size: 12px;
    }
}


/* 메이저 경매 수정사항 반영 */
.card.artwork div.charlity {
    position: absolute;
    top: 6px;
    right: 12px;
    height: auto !important;
    -webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25) !important;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25) !important;
    background-color: #f97407;
    border: none !important;
    line-height: initial;
    font-size: 0;
    padding: 5px 11px !important;
    border-radius: 15px;
    -webkit-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
    cursor: pointer;
}

.card.artwork > div.charlity > span {
    color: #ffffff;
    font-size: 12px;
    line-height: 1.2em;
    -webkit-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.join_top_area {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 30px;
}

.join_go_back_btn {
    cursor: pointer;
}

.join_go_back_btn > span {
    display: inline-block;
    margin-left: 3px;
    font-size: 14px;
    text-decoration: underline;
}

.join_step01_dropdown input {
    visibility: hidden;
    position: absolute;
    left: -30px;
}

.join_step01_dropdown .dropdown-item {
    position: relative;
    font-size: 12px;
    border-radius: 0;
    overflow: hidden;
    cursor: pointer;
    margin-bottom: 0;
    padding: 4px 8px 4px 10px;
}

.join_step01_dropdown .dropdown-item:hover {
    background-color: #111041;
    color: #ffffff;
}

.join_step01_dropdown .dropdown-toggle::after {
    display: none;
}

.join_step01_dropdown {
    width: 70px;
    border: 1px solid #dedede;
    position: absolute;
    right: 0;
}

.join_step01_dropdown > button {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 2px;
    padding: 5px 26px 5px 10px;
    text-align: left;
    line-height: initial;
    background-color: #f3f3f3;
}

.join_step01_dropdown > button > span {
    line-height: initial;
    font-size: 12px;
}

.join_step01_dropdown > button i {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 10px;
    font-size: 11px;
    color: #656565;
}

.join_step01_dropdown .dropdown-menu {
    min-width: 100%;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    border-radius: 0;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    -webkit-box-shadow: rgb(15 15 15 / 5%) 0px 0px 0px 1px, rgb(15 15 15 / 10%) 0px 3px 3px, rgb(15 15 15 / 20%) 0px 2px 8px;
    box-shadow: rgb(15 15 15 / 5%) 0px 0px 0px 1px, rgb(15 15 15 / 10%) 0px 3px 3px, rgb(15 15 15 / 20%) 0px 2px 8px;
}


@media (max-width: 500px) {
    .join-accordion-menu .join-accordion-head > div {
        width: 350px;
    }

    .join_ad_agree_choice_cnt > div > div {
        margin-right: 0;
    }
}

@media (max-width: 450px) {
    .join_ad_agree_choice_cnt > div > div {
        padding-right: 25px;
    }
}

@media (max-width: 430px) {
    .join-accordion-menu .join-accordion-head > div {
        width: 320px;
    }

    .join-conditions + label > div {
        width: 10%;
    }

    .join-conditions + label > strong {
        width: 90%;
    }
}

@media (max-width: 400px) {
    .join-accordion-menu .join-accordion-head > div {
        width: 290px;
    }
}

@media (max-width: 370px) {
    .join-accordion-menu .join-accordion-head > div {
        width: 260px;
    }
}


/* 안내팝업 */
.join_member_modal > .modal-dialog {
    width: 100% !important;
    max-width: 100%;
    height: 100%;
    -ms-transform: none !important;
    transform: none !important;
    -webkit-transform: none !important;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.join_member_modal .modal-content {
    width: 298px !important;
    padding: 18px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 14px 18px !important;
}

.join_member_modal .modal-content h2 {
    font-size: 14px;
    line-height: 19px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 24px;
}

.join_member_modal .modal-content .modal_desc {
    padding: 10px;
    background-color: #f5f5f5;
}

.join_member_modal .modal-content .modal_desc > div {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 5px;
}

.join_member_modal .modal-content .modal_desc > div > div {
    width: 5%;
    height: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.join_member_modal .modal-content .modal_desc > div > div span {
    font-size: 18px;
    color: #3a3a3a;
}

.join_member_modal .modal-content .modal_desc > div > p {
    width: 95%;
    font-size: 13px;
    line-height: 1.2em;
    color: #3a3a3a;
}

.join_member_modal .modal-content .join_modal_btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
    margin-top: 26px;
    font-size: 0;
}

.join_member_modal .modal-content .join_modal_btn button {
    width: 49%;
    height: 30px;
    border-radius: 6px;
    background-color: #e5e5e5 !important;
    color: #000000 !important;
    border: none !important;
    font-size: 13px;
    font-weight: 400;
}

.join_member_modal .modal-content .join_modal_btn button:last-child {
    margin-left: 2%;
    background-color: #707070 !important;
    color: #ffffff !important;
}


/* 미동의안내팝업 */
/* #join_member_agree_modal {
  display: block !important;
} */
#join_member_agree_modal h2 {
    margin-bottom: 8px;
}

#join_member_agree_modal .modal_desc {
    background-color: #ffffff;
    padding: 0;
}

#join_member_agree_modal .join_modal_btn {
    margin-top: 10px;
}

@media (max-width: 768px) {
    .zipcode-wrap .join-all-agree-cnt .join_page_tooltip i {
        display: block;
    }
}


.join_info_tip {
    width: 100%;
    position: relative;
    margin: 0 !important;
    padding-bottom: 25px;
}

.join_info_tip > .title {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    cursor: pointer;
}

.join_info_tip:hover > .title > p {
    text-decoration: underline;
}

.join_info_tip > .title > p {
    font-size: 12px !important;
    margin-left: 5px;
    color: #666666;
}

.join_info_tip > .join-tooltip {
    display: none;
    width: 325px;
    left: auto;
    top: 30px;
    right: -10px;
    padding: 19px 24px 15px 15px;
    z-index: 50;
}

.join-tooltip.on {
    display: block;
}

/* join_info_tip_close */
.join_info_tip > .join-tooltip > button {
    position: absolute;
    top: 10px;
    right: 13px;
    line-height: 0.5em;
    z-index: 50;
    display: inline-block;
    background: none;
    cursor: pointer;
}

.join_info_tip > .join-tooltip > button i {
    font-size: 13px;
    font-weight: 500;
    color: #ffffff;
}

.join_info_tip .join-tooltip::after {
    left: auto;
    right: 14%;
}

.join_info_tip .join-tooltip ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-left: 0;
}

.join_info_tip .join-tooltip ul li:first-child {
    margin-bottom: 5px;
}

.join_info_tip .join-tooltip ul li div {
    width: 6%;
    height: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.join_info_tip .join-tooltip ul li div span {
    color: #ffffff;
    font-size: 18px;
}

.join_info_tip .join-tooltip ul li p {
    width: 94%;
    font-size: 12px;
    line-height: 1.2em;
    color: #ffffff;
    word-break: keep-all;
}


.join_address_info_tip {
    width: 100%;
    position: relative;
    margin: 0 !important;
    padding-bottom: 25px;
}

.join_address_info_tip > .title {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    cursor: pointer;
}

.join_address_info_tip:hover > .title > p {
    text-decoration: underline;
}

.join_address_info_tip > .title > p {
    font-size: 12px !important;
    margin-left: 5px;
    color: #666666;
}

.join_address_info_tip > .join-tooltip {
    display: none;
    width: 325px;
    left: auto;
    top: 30px;
    right: -10px;
    padding: 19px 24px 15px 15px;
    z-index: 50;
}

/* join_info_tip_close */
.join_address_info_tip > .join-tooltip > button {
    position: absolute;
    top: 10px;
    right: 13px;
    line-height: 0.5em;
    z-index: 50;
    display: inline-block;
    background: none;
    cursor: pointer;
}

.join_address_info_tip > .join-tooltip > button i {
    font-size: 13px;
    font-weight: 500;
    color: #ffffff;
}

.join_address_info_tip .join-tooltip::after {
    left: auto;
    right: 14%;
}

.join_address_info_tip .join-tooltip ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-left: 0;
}

.join_address_info_tip .join-tooltip ul li:first-child {
    margin-bottom: 5px;
}

.join_address_info_tip .join-tooltip ul li div {
    width: 6%;
    height: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.join_address_info_tip .join-tooltip ul li div span {
    color: #ffffff;
    font-size: 18px;
}

.join_address_info_tip .join-tooltip ul li p {
    width: 94%;
    font-size: 12px;
    line-height: 1.2em;
    color: #ffffff;
    word-break: keep-all;
}

.modal_document_wrap {
    margin-top: 115px;
    padding: 0px 10px !important;
}

.modal_document_wrap .topbox1 {
    padding: 0px !important;
    width: 840px !important;
}

.modal_document_wrap h1 {
    text-align: center;
}

.modal_document_wrap .topbox2 {
    height: auto !important;
    width: 840px !important;
    overflow: hidden !important;
}

.modal_document_wrap .modal-bid-noti-table {
    width: 850px !important;
}

.domestic_organizations_number_form > div > .input > input {
    width: 100%;
}

.join_text_box {
    position: relative;
}

.join_text_box > input {
    width: 92% !important;
}

.join_text_box > .text_box_clearbtn {
    display: none;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 15px;
    cursor: pointer;
}

.second_box.domestic_organizations > div:nth-child(2) > div > .input.join_text_box > input {
    width: 100% !important;
}

.second_box.domestic_organizations > div:nth-child(2) > div > .input.join_text_box > .text_box_clearbtn {
    right: 0;
}

.join_country_select_wrap {
    border-bottom: none;
}

.join_country_select {
    margin-bottom: 10px;
    width: 100%;
    height: 42px;
    border: 1px solid #e5e5e5;
    padding: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(../img/icons/schedule-img.png) no-repeat 95% 50%;
}


body.bgcolor {
    background-color: #f5f5f5 !important;
}

.content.not_pad {
    padding-bottom: 0 !important;
}

.none {
    display: none !important;
}

.select2-container.sequence {
    z-index: 1 !important;
}


/* 낙찰결과통보서 css */
body.scroll_x {
    overflow-x: scroll !important;
}

.auto {
    width: auto !important;
}

.inherit {
    overflow-x: inherit !important;
}

.suseefulBid_back_btn {
    position: fixed;
    top: 15px;
    left: 10px;
    cursor: pointer;
}

.suseefulBid_back_btn:hover span {
    text-decoration: underline;
}

.suseefulBid_logo {
    position: fixed;
    top: 35px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}


.winnig_bid_input_wrap {
    width: 768px;
    margin: 0 auto;
}

.winnig_bid_input_container {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.winnig_bid_input {
    width: 464px;
    margin-top: 50px;
    margin-bottom: 70px;
}

.winnig_bid_input > .winnig_bid_tit {
    text-align: center;
    margin-bottom: 35px;
}

.winnig_bid_input > .winnig_bid_tit > p {
    font-size: 16px;
    font-weight: 600;
    margin-top: 10px;
}

.winnig_bid_box {
    border: 1px solid #dedede;
    background-color: #ffffff;
    padding: 40px 30px;
    margin-bottom: 20px;
}

.winnig_bid_box > p {
    font-size: 15px;
    text-align: center;
    padding-bottom: 20px;
    word-break: keep-all;
    margin-bottom: 30px;
    border-bottom: 1px solid #E5E5E5;
}

.winnig_bid_box > p > span {
    color: #35A1ED;
}

.winnig_bid_box > .winnig_bid_box_img {
    text-align: center;
    margin-bottom: 30px;
}

.winnig_bid_box .input {
    margin-bottom: 25px;
}

.winnig_bid_box .input > p {
    font-size: 12px;
    margin-top: 5px;
    color: #b0b0b0;
}

.winnig_bid_box .input > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.winnig_bid_box_input {
    width: 78%;
    height: 45px;
    font-family: inherit; /* 폰트 상속 */
    font-size: 15px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    padding: 10px 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.winnig_bid_box_input::-webkit-input-placeholder {
    color: #cccccc;
}

.winnig_bid_box_input::-moz-placeholder {
    color: #cccccc;
}

.winnig_bid_box_input:-ms-input-placeholder {
    color: #cccccc;
}

.winnig_bid_box_input::-ms-input-placeholder {
    color: #cccccc;
}

.winnig_bid_box_input::placeholder {
    color: #cccccc;
}

.winnig_bid_box .input .button {
    width: 20%;
    height: 45px;
    margin-left: 2%;
}

.winnig_bid_box .input .button button {
    width: 100%;
    height: 100%;
    background-color: #151a43;
    border-radius: 6px;
    color: #ffffff;
    cursor: pointer;
}

.winnig_bid_box .notice {
    padding: 16px 18px;
    background-color: #F7F7F7;
}


.winnig_bid_box .notice > p {
    font-size: 13px;
    color: #636363;
    font-weight: 600;
    margin-bottom: 5px;
}


.winnig_bid_box .notice ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 0px;
}

.winnig_bid_box .notice ul li > div {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    width: 3%;
    height: 14px;
}

.winnig_bid_box .notice ul li > div > span {
    color: #636363;
    font-size: 18px;
}

.winnig_bid_box .notice ul li > p {
    display: inline-block;
    width: 97%;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 1.4em;
    color: #636363;
    word-break: keep-all;
}

@media (max-width: 768px) {
    .winnig_bid_input_wrap {
        width: 100%;
    }
}

@media (max-width: 500px) {
    .winnig_bid_input {
        width: 100%;
        padding: 0 15px;
    }

    .winnig_bid_box {
        padding: 30px 20px;
    }
}


.successful_footer_wrap ul {
    font-size: 0;
    text-align: center;
    margin-bottom: 0;
}

.successful_footer_wrap ul li {
    position: relative;
    display: inline-block;
    line-height: initial;
    padding: 0 8px;
}

.successful_footer_wrap ul li:last-child::after {
    display: none;
}

.successful_footer_wrap ul li::after {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    content: '';
    display: inline-block;
    width: 1px;
    height: 10px;
    background-color: #666666;
}

.successful_footer_wrap ul li a {
    font-size: 14px;
    font-weight: 500;
    color: #7D7D7D;
}

.successful_footer_wrap .copyright {
    margin-top: 3px;
    text-align: center;
}

.successful_footer_wrap .copyright span,
.successful_footer_wrap .copyright a {
    color: #7D7D7D;
}

#bid_successful_modal .modal-content {
    padding: 25px 30px !important;
    border-radius: 5px;
}

.bid_success_modal_desc > p {
    text-align: center;
    word-break: keep-all;
    margin-bottom: 15px;
    font-size: 14px;
    line-height: 1.4em;
    color: #3a3a3a;
}

.bud_success_doc_modal_btn button {
    width: 130px;
    height: 30px;
    border-radius: 6px;
    background-color: #000000 !important;
    color: #ffffff !important;
    border: none !important;
    font-size: 13px;
    font-weight: 400;
}

.liveToast_hide {
    color: #ffffff;
    font-size: 13px;
    margin-top: 10px;
    padding: 0 40px;
    height: 30px;
    background-color: #151a43;
    border-radius: 6px;
}


/* 주소등록/수정 팝업 개인정보수집동의 영역*/
#modal-address .address_add_info {
    width: 100%;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 10px;
    border: 1px solid #dedede;

}

#modal-address .address_add_info input {
    display: none;
}

#modal-address .address_add_info > div {
    width: 100%;
}

#modal-address .join-conditions + label > div > span {
    background: #ffffff;
}

#modal-address .join-conditions:checked + label > div > span {
    background: #173b7d;
}

#modal-address .join-conditions:checked + label > div > span > i {
    color: #ffffff;
}

#modal-address .join-conditions + label > div {
    width: 8%;
    margin-right: 0;
}

#modal-address .join-conditions + label > strong {
    margin-left: 2%;
    width: 88%;
    font-size: 14px;
}

#modal-address .all_agree_area {
    padding-bottom: 10px;
    border-bottom: 1px solid #f2f2f2;
}

#modal-address .all_agree_area .join-conditions + label > strong {
    font-weight: 600;
}

#modal-address .check_list > div {
    padding-top: 5px;
    padding-bottom: 5px;
}

#modal-address .check_list > div:last-child {
    padding-bottom: 0;
}

#modal-address .check_list .join-conditions + label > div > span {
    width: 18px;
    height: 18px;
}

#modal-address .check_list .join-conditions + label > div > span i {
    font-size: 10px;
}


/* #join_member_address_modal {
  display: block !important;
} */
#join_member_address_modal {
    z-index: 600;
}

#join_member_address_modal > .modal-dialog {
    width: 100%;
    height: 100%;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    max-width: 100%;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#join_member_address_modal > .modal-dialog > .modal-content {
    width: 450px;
    padding: 0;
}

#join_member_address_modal .tit {
    position: relative;
    width: 100%;
    height: 45px;
    line-height: 45px;
    background-color: #151a43;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 25px;
}

#join_member_address_modal .tit h6 {
    color: #ffffff;
    font-size: 15px;
}

#join_member_address_modal .tit button {
    position: absolute;
    right: 25px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: none;
}

#join_member_address_modal .tit button i {
    font-size: 15px;
    color: #ffffff;
    font-weight: 400;
}

#join_member_address_modal .address_input_wrap {
    width: 100%;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

#join_member_address_modal .address_input_wrap .join_text_box {
    width: 80%;
    height: 40px;
    border: 1px solid #E5E5E5;
    border-radius: 6px;
    margin-right: 2%;
    overflow: hidden;
}

#join_member_address_modal .address_input_wrap .join_text_box input {
    font-size: 13px;
    height: 100%;
}

#join_member_address_modal .address_input_wrap .join_text_box input::-webkit-input-placeholder {
    color: #bcbcbc;
}

#join_member_address_modal .address_input_wrap .join_text_box input::-moz-placeholder {
    color: #bcbcbc;
}

#join_member_address_modal .address_input_wrap .join_text_box input:-ms-input-placeholder {
    color: #bcbcbc;
}

#join_member_address_modal .address_input_wrap .join_text_box input::-ms-input-placeholder {
    color: #bcbcbc;
}

#join_member_address_modal .address_input_wrap .join_text_box input::placeholder {
    color: #bcbcbc;
}

#join_member_address_modal .address_input_wrap button {
    width: 18%;
    height: 40px;
    background-color: #151A43;
    font-size: 13px;
    color: #ffffff;
    border-radius: 6px;
}

#join_member_address_modal .detail {
    padding: 30px 25px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}


#join_member_address_modal .detail .result {
    width: 100%;
    margin-top: 20px;
}

#join_member_address_modal .detail .result .tip {
    padding: 15px 20px;
    background-color: #F7F7F7;
}

#join_member_address_modal .detail .result .tip h5 {
    font-size: 13px;
    font-weight: 600;
}

#join_member_address_modal .detail .result .tip > .desc {
    font-size: 12px;
    line-height: 1.2em;
    color: #999999;
    margin-bottom: 15px;
}


#join_member_address_modal .detail .result .tip > p.cnt {
    color: #000000;
    line-height: 1.2em;
}

#join_member_address_modal .detail .result .tip > span {
    display: inline-block;
    font-size: 11px;
    color: #666666;
    line-height: 1.2em;
    margin-bottom: 15px;
}

.addrList li {
    padding: 12px 0;
    border-bottom: 1px solid #eeeeee;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.addrList li > div {
    font-size: 11px;
    line-height: initial;
    margin-bottom: 3px;
}

.addrList li > div > span {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 10px;
    width: 40px;
    height: 16px;
    color: #ffffff;
}

.addrList li > div > span.new {
    background-color: #818ED8;
}

.addrList li > div > span.old {
    background-color: #9D9D9D;
}

.error_box.positive {
    color: #267746;
}

.error_box.nagative {
    color: red;
}


@media (max-width: 540px) {
    .join-content {
        padding: 40px 30px;
    }

    .join_form_agreebtn_wrap > div > div {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .joincomlete-wrap {
        padding: 30px 30px;
    }

}

@media (max-width: 500px) {

    #join_member_address_modal > .modal-dialog > .modal-content {
        width: 100%;
        margin: 0 10px;
    }

    #join_member_address_modal .detail {
        padding: 20px 15px;
    }

    #join_member_address_modal .address_input_wrap .join_text_box {
        height: 35px;
    }

    #join_member_address_modal .address_input_wrap .join_text_box input {
        font-size: 11px;
    }

    #join_member_address_modal .address_input_wrap button {
        height: 35px;
        font-size: 11px;
    }
}

@media (max-width: 460px) {
    .join_cnt_wrap > p {
        font-size: 18px;
    }

    .join-content {
        padding: 30px 20px;
    }

    .join_form_agreebtn_wrap > div > div {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .join_form_agreebtn_wrap > div span {
        margin-left: 0;
        text-align: center;
    }
}


@media (max-width: 390px) {
    .joincomlete-wrap {
        padding: 30px 20px;
    }

    .gender_checkbox + label > div {
        left: 8px;
    }

    .join-certified-desc > div .certified-btn > button {
        padding: 15px 15px;
    }

    .join-certified-desc > div .certified-btn {
        padding: 0 10px;
    }

    .join_form_agreebtn_wrap {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .join_form_agreebtn_wrap > div > div {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .join_ad_agree_choice_cnt > div {
        white-space: inherit;
    }

    .join_ad_agree_choice_cnt > div > div {
        width: 100%;
        margin-bottom: 5px;
    }

    .join_ad_agree_choice_cnt > div > div:nth-child(1),
    .join_ad_agree_choice_cnt > div > div:nth-child(2),
    .join_ad_agree_choice_cnt > div > div:nth-child(3) {
        text-align: left;
    }
}


.modal.fade .modal-content > div > .modal-btn > a.cancel {
    display: none;
    margin-left: 5px;
    background-color: #ffffff !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #666666;
    color: #000000 !important;
}


/* 3월24일수정 */
.iti {
    width: 100%;
}

.iti--separate-dial-code .iti__selected-flag {
    background-color: rgba(255, 255, 255, 0) !important;
}

.overseas-individuals-member > div:nth-child(1),
.overseas-member_input > div:nth-child(1) {
    margin-bottom: 10px;
}

#mobile-004,
#mobile-002,
.overseas-individuals-member > .join-input-btn > div > input,
.overseas-member_input > .join-input-btn > div > input {
    height: 40px;
}

#mobile-004 {
    width: 100%;
}

.iti__flag-container {
    width: 85px;
}

.iti__arrow {
    position: absolute;
    top: 50%;
    right: 6px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.overseas-member_input > .join-input-btn {
    width: 100%;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 115px;
}

.overseas-member_input > .join-input-btn > .usernumber_btn {
    width: auto;
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.overseas-member_input > .join-input-btn > .usernumber_btn > button {
    width: 105px;
    margin: 0;
    padding: 8px;
}


@media (max-width: 510px) {
    .overseas-member_input > .join-input-btn {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-right: 0;
    }

    .overseas-member_input > div:nth-child(1) {
        margin-bottom: 15px;
    }

    .overseas-member_input > div > .usernumber_input {
        margin-bottom: 8px;
    }

    .overseas-member_input > .join-input-btn > .usernumber_btn {
        position: relative;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
}


@media (max-width: 400px) {
    .overseas-member_input input,
    .join-input-btn > .usernumber_input .usernumber_input_time {
        font-size: 12px;
    }
}

.tooltip_wrap {
    display: none;
    position: absolute;
    top: 45px;
    left: 0px;
    z-index: 100;
    background-color: #7a7a7a;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 11px 20px !important;
    border-radius: 6px;
}

.tooltip_wrap::after {
    content: "";
    width: 0px;
    height: 0px;
    display: block;
    position: absolute;
    left: 10%;
    top: -14px;
    border-bottom: 7px solid #7a7a7a;
    border-right: 7px solid rgba(0, 0, 0, 0);
    border-left: 7px solid rgba(0, 0, 0, 0);
    border-top: 7px solid rgba(0, 0, 0, 0);
}

.join_form_agreebtn_wrap > div:first-child {
    position: relative;
}

.join_form_agreebtn_wrap > div:first-child:hover .tooltip_wrap {
    display: block !important;
}

.join_form_agreebtn_wrap > div:first-child .tooltip_wrap {
    width: 300px;
    height: auto;
}

.join_form_agreebtn_wrap > div:first-child .tooltip_wrap .cnt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.join_form_agreebtn_wrap > div:first-child .tooltip_wrap .cnt > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.join_form_agreebtn_wrap > div:first-child .tooltip_wrap .cnt > div:first-child {
    margin-bottom: 5px;
}

.join_form_agreebtn_wrap > div:first-child .tooltip_wrap .cnt > div > div {
    width: 5%;
    height: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.join_form_agreebtn_wrap > div:first-child .tooltip_wrap .cnt > div > div > span {
    margin-left: 0;
    line-height: initial;
    color: #ffffff;
}

.join_form_agreebtn_wrap > div:first-child .tooltip_wrap .cnt > div > p {
    width: 95%;
    color: #ffffff;
    line-height: 1.2em;
}


#page_loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 150;
    background-color: rgba(0, 0, 0, 0.3);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}


.domestic_organizations_documents .join_text_box .text_box_clearbtn {
    /* display: block; */
    right: 90px;
}

.guarantee_print_btn > a {
    cursor: pointer;
    height: 30px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-top: 3px;
    padding: 0 14px;
    background-color: #071839;
    color: #ffffff !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 5px;
    font-size: 13px;
}


.board-attached-file {
    padding: 15px 35px;
    background-color: #F9F9F9;
    border-bottom: 1px solid #eeeeee;
}

.board-attached-file > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.board-attached-file > div > strong {
    width: 6%;
    font-size: 16px;
    font-weight: 500;
    margin-right: 2%;

}

.board-attached-file > div > div {
    width: 92%;
}

.board-attached-file > div > div > a {
    font-size: 14px;
    display: block;
    color: #888888;
}

.board-attached-file > div > div > a:hover {
    text-decoration: underline;
}

.board-attached-file > div > div > a i {
    font-size: 12px;
    padding-right: 5px;
}

.board-attached-file > div > span {
    font-size: 14px;
    color: #888888;
}


/* 도록신청 모달팝업 */
.applyBook_tit {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 56px;
    border-bottom: 1px solid #eeeeee;
    font-size: 16px;
    font-weight: 700;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 24px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.applyBook_content {
    display: none;
    margin-top: 50px;
    width: 100%;
}


.applyBook_content input.default_type {
    width: 100%;
    height: 47px;
    border: 1px solid #eeeeee;
    font-size: 13px;
    border-radius: 5px;
    padding: 0.2rem 1rem 0.2rem 1rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.applyBook_content .list {
    margin-bottom: 12px;
}

.applyBook_content .list > .address_tit {
    position: relative;
    font-size: 14px;
    margin-bottom: 5px;
}

.applyBook_content .list > .address_tit > a {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #666666;
    font-size: 12px;
    text-decoration: underline;
}

.applyBook_content .list > p {
    font-size: 14px;
    margin-bottom: 5px;
}

.applyBook_content .hope-date div{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

.applyBook_content .hope-date select{
    border: 1px solid #CBCBCB;
}

.applyBook_content .hope-date .year{
    width: 100px;
    margin-right: 5px;
}

.applyBook_content .hope-date .month{
    width: 60px;
    margin-right: 4px;
}

.applyBook_content .hope-date > span{
    display: block;
    font-size: 12px;
    margin-top: 5px;
    color: #9e9e9e;
    text-indent: -15px;
    padding-left: 15px;
}

.applyBook_content .agree_wrap {
    margin-top: 15px;
    background-color: #fafafa;
    border: 1px solid #eeeeee;
}

.applyBook_content .agree_wrap .tit {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 10px;
    border-bottom: 1px solid #eeeeee;
    position: relative;
    text-align: center;
    text-decoration: underline;
}

.applyBook_content .agree_wrap .tit a {
    font-size: 14px;
}

.applyBook_content .agree {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 15px 10px;
}

.applyBook_content .agree input {
    display: none;
}

.applyBook_content .agree .join-conditions + label {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.applyBook_content .agree .join-conditions + label > div {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-right: 5px;
}

.applyBook_content .agree .join-conditions + label > strong {
    font-size: 12px;
    line-height: 1.6em;
    color: #333333;
}

.applyBook_content .btn_wrap {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 0;
    margin-top: 30px;
}

.applyBook_content .btn_wrap > button {
    width: 49%;
    height: 45px;
    background-color: #F0F3F7;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 5px;
    color: #9E9E9E;
}

.applyBook_content .btn_wrap > button.submit {
    color: #ffffff;
    background-color: #151A43;
}


#address-code {
    width: 100%;
    font-size: 13px;
    background: url(../img/icons/schedule-img.png) no-repeat 97% 50%;
    padding: 10px 34px 10px 10px;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    border-radius: 5px;
    margin-top: 0;
    margin-bottom: 0;
    color: #666666;
}


@media (max-width: 768px) {
    .modal.fade > div > div {
        padding: 30px 25px;
    }
}


li.policy_list_dropdown_wrap {
    position: relative;
}

.policy_list_dropdown {
    display: none;
    position: absolute;
    bottom: 30px;
    left: 22px;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 10;
    border-radius: 5px;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.08);
    background: #fff;
    padding: 6px 4px;
}

.policy_list_dropdown .caret_up > span {
    width: 0px;
    height: 0px;
    display: block;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(180deg);
    -ms-transform: translateX(-50%) rotate(180deg);
    transform: translateX(-50%) rotate(180deg);
    transform: translateX(-50%) rotate(180deg);
    bottom: -13px;
    border-bottom: 7px solid #ffffff;
    border-right: 7px solid rgba(0, 0, 0, 0);
    border-left: 7px solid rgba(0, 0, 0, 0);
    border-top: 7px solid rgba(0, 0, 0, 0);
}

.policy_list_dropdown ul {
    text-align: left;
    margin-top: 0 !important;
}

.policy_list_dropdown ul li {
    margin: 0 !important;
    min-width: 140px;
    height: 36px;
    padding-left: 0;
}

.ka-container .ka-content-wrapper .bottom-menu .policy_list_dropdown ul li a {
    width: 100%;
    height: 100%;
    white-space: nowrap;
    text-align: left;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 6px 12px;
    color: #252525;
    font-family: Noto Sans KR;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.39px;
    margin-right: 0;
}

.ka-container .ka-content-wrapper .bottom-menu .policy_list_dropdown ul li a:hover {
    border-radius: 5px;
    background: #F3F3F3;
    color: #252525!important;
}

.ka-container .ka-content-wrapper .bottom-menu .policy{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-top: 40px;
}


/* 이용약관 프린트버튼 */
.condition_print {
    margin: 40px 0 10px 0;
    text-align: right;
}

.condition_print .condition_print_btn {
    width: 90px;
    height: 35px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #666666;
    border-radius: 5px;
    background-color: #F5F5F5;
    border: 1px solid #cccccc;
}

.condition_print .condition_print_btn svg {
    margin-right: 5px;
}


/* 4월5일수정 */
/* [id*='collapse-'] */
[id*='collapse-'] .row-pad {
    padding: 0 !important;
    margin: 0 !important;
}

[id*='collapse-'] .row-pad > div {
    height: 100%;
    position: relative;
    padding: 0 !important;
    margin-right: 0;
}

[id*='collapse-'] .row-pad > div:first-child {
    margin-right: 20px;
}

[id*='collapse-'] .row-pad > div:nth-of-type(2) {
    padding-top: 27px !important;
}

[id*='collapse-'] .row-pad > div:last-child {
    padding: 24px 20px 0px 0 !important;
    height: 100%;
}

[id*='collapse-'] .row-pad > .card-price-info > .card-price-btn {
    right: 50px;
    width: 29.3%;
}


@media (max-width: 768px) {
    [id*='collapse-'] .row-pad > .card-list-img {
        max-height: 200px !important;
    }

    [id*='collapse-'] .row-pad > div:nth-child(2) {
        margin-top: 25px;
        padding-top: 0 !important;
        padding: 0 20px !important;
        height: auto;
    }

    [id*='collapse-'] .row-pad > div:nth-child(2) > svg {
        top: 0;
        right: 0;
    }

    [id*='collapse-'] .row-pad > div:last-child {
        position: relative;
        margin-top: 10px;
        padding: 0 20px 20px 20px !important;
        max-height: 155px !important;
    }

    [id*='collapse-'] .row-pad > .card-price-info > .card-price-btn{
        width: calc(100% - 80px)!important;
        width: -webkit-calc(100% - 80px)!important;
        width: -moz-calc(100% - 80px)!important;
        width: -o-calc(100% - 80px)!important;
    }

    .wish_list .card-list{
        padding-right: 20px;
    }

    .wish_list [id*='collapse-'] .row-pad > div:first-child{
        margin-right: 0;
    }
}


@media (max-width: 480px) {
    #modal-address .address_modal_cnt .list.address_num > div {
        padding-right: 0;
    }

    #modal-address .address_modal_cnt .list.delivery-addr > div{
        padding-right: 125px;
    }

    #modal-address .address_modal_cnt .list.address_num.delivery-addr > div > button{
        position: absolute;
        top: 0;
        right: 0;
        margin-top: 0;
        width: 115px;
    }

    #modal-address .address_modal_cnt .list input {
        height: 35px;
    }

    #modal-address .address_modal_cnt .list.address_num > div > button {
        position: relative;
        height: 35px;
        top: auto;
        right: auto;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        margin-top: 8px;
    }

    #modal-address .address_modal_cnt .list {
        margin-bottom: 8px;
    }

    #address_modify_btn_wrap {
        margin-top: 10px;
    }

    #address_modify_btn_wrap > button {
        height: 40px;
    }
}


@media (max-width: 490px) {
    .filter_wrap > .bottom > .refresh_btn > button {
        font-size: 11px;
    }
}


@-webkit-keyframes skeleton-gradient {
    0% {
        background-color: rgba(165, 165, 165, 0.1);
    }

    50% {
        background-color: rgba(165, 165, 165, 0.3);
    }

    100% {
        background-color: rgba(165, 165, 165, 0.1);
    }
}

@keyframes skeleton-gradient {
    0% {
        background-color: rgba(165, 165, 165, 0.1);
    }

    50% {
        background-color: rgba(165, 165, 165, 0.3);
    }

    100% {
        background-color: rgba(165, 165, 165, 0.1);
    }
}

.skeleton_item,
.img-lazy {
    -webkit-animation: skeleton-gradient 1.8s infinite ease-in-out;
    animation: skeleton-gradient 1.8s infinite ease-in-out;
}

.img-lazy > img {
    display: none;
}


.follow_btn > i {
    display: inline-block;
}

.follow_btn > span {
    display: inline-block;
}

.w_follow_list .list > .w_info > .w_name {
    font-size: 20px;
    word-break: keep-all;
    font-weight: 700;
    margin-bottom: 3px;
    color: #000000;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.24;
}

.w_follow_list .list > .w_info > .w_year {
    font-size: 12px;
    line-height: 15px;
    letter-spacing: -0.2px;
    color: #868686;
    font-family: 'Montserrat';
}

.board-view-desc > table.table-bordered {
    width: 100% !important;
}

.board-view-desc > table.table-bordered td:first-child {
    white-space: nowrap;
}


/* 경매결과리스트페이지 스켈레톤 ui */

#list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /* margin-right: -15px;
    margin-left: -15px; */
}


.result-skeleton-item .result-skeleton-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    font-size: 0;
    height: 160px;
    overflow: hidden;
    border: 1px solid var(--color-grey_200);
}

.result-skeleton-item .result-skeleton-card .result-skeleton-img {
    width: 38%;
    height: 100%;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 0;
    -webkit-animation: skeleton-gradient 1.8s infinite ease-in-out;
    animation: skeleton-gradient 1.8s infinite ease-in-out;
}

.result-skeleton-item .result-skeleton-card .result-skeleton-content {
    position: relative;
    width: 62%;
    padding: 25px 15px 25px 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.result-skeleton-item .result-skeleton-card .result-skeleton-content > .title {
    display: block;
    width: 220px;
    height: 22px;
    margin-bottom: 20px;
    -webkit-animation: skeleton-gradient 1.8s infinite ease-in-out;
    animation: skeleton-gradient 1.8s infinite ease-in-out;
}

.result-skeleton-item .result-skeleton-card .result-skeleton-content > .cnt {
    display: block;
    width: 200px;
    height: 18px;
    margin-bottom: 5px;
    -webkit-animation: skeleton-gradient 1.8s infinite ease-in-out;
    animation: skeleton-gradient 1.8s infinite ease-in-out;
}

@media (max-width: 645px) {
    .result-skeleton-item .result-skeleton-card {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: auto !important;
    }

    .result-skeleton-item .result-skeleton-card .result-skeleton-img {
        width: 100%;
        height: 200px;
    }

    .result-skeleton-item .result-skeleton-card .result-skeleton-content {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .result-top-group-wrap {
        -webkit-box-flex: 100%;
        -ms-flex: 100%;
        flex: 100%;
        max-width: 100%;
        margin-bottom: 10px
    }

    .result-top-group-wrap.text-right {
        text-align: left !important;
    }
}


/* 5월19일 */
#list-skeleton {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.list-skeleton-item {
    padding: 0 5px;
    margin-bottom: 1.5rem !important;
}

.list-skeleton-item .list-skeleton-item-card {
    border: 1px solid #eeeeee;
    height: 500px;
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    word-wrap: break-word;
}

.list-skeleton-item-card .list-skeleton-item-card-img {
    width: 100%;
    height: 228px;
    -webkit-animation: skeleton-gradient 1.8s infinite ease-in-out;
    animation: skeleton-gradient 1.8s infinite ease-in-out;
}

.list-skeleton-item-card .list-skeleton-item-card-body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 15px;
}

.list-skeleton-item-card .list-skeleton-item-card-body > .lot {
    display: block;
    width: 40px;
    height: 14px;
    background-color: var(--color-grey_200);
    margin: 8px 0;
}

.list-skeleton-item-card .list-skeleton-item-card-body > .name {
    display: block;
    width: 80px;
    height: 26px;
    background-color: var(--color-grey_200);
    margin-bottom: .75rem;
}

.list-skeleton-item-card .list-skeleton-item-card-body > .work-name {
    display: block;
    width: 200px;
    height: 23px;
    background-color: var(--color-grey_200);
    margin-top: -.375rem;
    margin-bottom: 0.5em;
}

.list-skeleton-item-card .list-skeleton-item-card-body > .desc-1 {
    display: block;
    width: 80px;
    height: 18px;
    background-color: var(--color-grey_200);
    margin-bottom: 5px;
}

.list-skeleton-item-card .list-skeleton-item-card-body > .desc-2 {
    display: block;
    width: 110px;
    height: 18px;
    background-color: var(--color-grey_200);
    margin-bottom: 5px;
}

.list-skeleton-item-card .list-skeleton-item-card-body > .button {
    display: block;
    width: 100%;
    height: 35px;
    background-color: var(--color-grey_200);
    margin: 88px 0 10px 0;
}

#uploader .tui-dropzone-contents {
    background-color: #f9f9f9;
    border: 1px solid #B9B9B9;
}

#uploader .tui-dropzone-contents:hover {
    background-color: #EAEAEA;
}

#uploader .uploader-msg {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0.5;
}

#uploader .tui-dropzone-contents:hover .uploader-msg {
    opacity: 1;
}

#uploader .uploader-msg .tui-dropzone-msg {
    width: 100%;
    display: inline-block;
    font-size: 11px;
    color: var(--color-grey_800);
}

#uploader .apply-tui-btn-upload {
    width: 56.5px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    background-color: var(--color-grey_100);
    color: #000;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0px 7px;
    border: 1px solid #B9B9B9;
    border-radius: 4px;
}

#uploader .apply-tui-btn-upload:hover {
    background-color: var(--color-grey_200);
}

#uploader .apply-tui-btn-upload > span {
    line-height: initial;
    font-size: 11px;
}

/* 파일업로드 css */

table.apply-table .essential-img-upload {
    padding: 0 !important;
}

.essential-detail-img-upload {
    padding: 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#essential-img-upload-wrap {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: (1fr) [ 2 ];
    grid-template-columns: repeat(2, 1fr);
}

#essential-img-upload-wrap > div {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px;
    border-bottom: 1px solid #efefef;
}

#essential-img-upload-wrap > div:first-child,
#essential-img-upload-wrap > div:nth-child(3) {
    border-right: 1px solid #efefef;
}

.essential-img-upload-item > p {
    font-size: 11px;
    margin-bottom: 5px;
    line-height: 1.4em;
    color: var(--color-orange_500);
}

.essential-img-upload-item .file-list {
    height: 78px;
    overflow-y: auto;
    border: 1px solid #B9B9B9;
    background-color: #F9F9F9;
    padding: 8px;
    margin-bottom: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.essential-img-upload-item .file-list:hover {
    background-color: #EAEAEA;
}

.essential-img-upload-item .file-list:hover .icon {
    opacity: 1;
}

.essential-img-upload-item .file-list .icon {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: 0.5;
}

.essential-img-upload-item .file-list .icon > p {
    font-size: 11px;
    color: var(--color-grey_800);
}

.essential-img-upload-item .file-list .filebox {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 18px;
    height: auto;
    font-size: 0;
    margin-bottom: 5px;
}

.essential-img-upload-item .file-list .filebox:hover > p {
    text-decoration: underline;
}

.essential-img-upload-item .file-list .filebox p {
    width: 100%;
    font-size: 11px;
    line-height: 1em;
    display: block;
    word-break: break-all;
}

.essential-img-upload-item .file-list .filebox a {
    position: absolute;
    right: 0;
    top: 0;
    line-height: initial;
    font-size: 0;
}

.essential-img-upload-item .essential-img-upload-label {
    font-size: 11px;
    padding: 0px 7px;
    border: 1px solid #B9B9B9;
    margin-bottom: 0;
    vertical-align: top;
}


@media (max-width: 850px) {
    #essential-img-upload-wrap {
        -ms-grid-columns: (1fr) [ 1 ];
        grid-template-columns: repeat(1, 1fr);
    }

    #essential-img-upload-wrap > div:first-child, #essential-img-upload-wrap > div:nth-child(3) {
        border-right: 0;
    }
}

@media (max-width: 768px) {
    #essential-img-upload-wrap > div,
    #uploader {
        padding: 10px 15px;
    }

    .written-call-apply > div:first-child {
        margin-bottom: 50px;
    }

    .written-call-apply > div {
        margin-bottom: 150px;
    }

    .apply-btn {
        margin-top: 30px;
    }
}

/* 5월30일 수정 */
.panel-body .writer-search-input {
    position: relative;
    margin: 10px 0;
    padding: 0 25px;
    width: 100%;
}

.panel-body .writer-search-input > div {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 20px;
    height: 30px;
    border-bottom: 1px solid #000000;
}

.panel-body .writer-search-input > div i {
    position: absolute;
    font-weight: 400;
    top: 50%;
    left: 25px;
    color: var(--color-grey_800);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.panel-body .writer-search-input > div input {
    border: none;
    width: 100%;
    height: 100%;
}

#qrcode_popup .modal_wrap {
    width: 400px;
    height: 100%;
    margin: 0 auto;
    max-width: 100%;
}

#qrcode_popup .modal_wrap > .modal-content {
    width: 400px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#inquiry_popup .modal_wrap > .modal-content {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 25px;
}

#qrcode_popup .modal_wrap .modal_header > p {
    text-align: center;
}

#qrcode_popup .modal_wrap .modal_header > p.name {
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 10px;
}

#qrcode_popup .modal_wrap .modal_header > p.desc {
    font-size: 13px;
    line-height: 1.2em;
    color: var(--color-grey_600);
    margin-bottom: 28px;
}

#qrcode_popup .modal_wrap .qrcode_img_wrap {
    width: 165px;
    height: 165px;
    -webkit-box-shadow: 0px 2px 10px rgba(244, 78, 5, 0.3);
    box-shadow: 0px 2px 10px rgba(244, 78, 5, 0.3);
    border-radius: 23px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}


#qrcode_popup .modal_wrap .qrcode_img_wrap > .img {
    display: block;
    width: 125px;
    height: 125px;
    background-image: image-set(
            url(../img/temp/highlight/appstore_img@1x.png) 1x,
            url(../img/temp/highlight/appstore_img@2x.png) 2x,
            url(../img/temp/highlight/appstore_img@3x.png) 3x
    );
    background-image: -webkit-image-set(
            url(../img/temp/highlight/appstore_img@1x.png) 1x,
            url(../img/temp/highlight/appstore_img@2x.png) 2x,
            url(../img/temp/highlight/appstore_img@3x.png) 3x
    );
    background-position: 0 0;
    background-repeat: no-repeat;
}

#qrcode_popup .modal_wrap .appstore_img_wrap {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 30px;
    gap: 0 12px;
}

#qrcode_popup .modal_wrap .appstore_img_wrap > div {
    width: 114px;
    height: 38px;
    border-radius: 38px;
    border: 1px solid #eaeaea;
    background-image: image-set(
            url(../img/temp/highlight/appstore_img@1x.png) 1x,
            url(../img/temp/highlight/appstore_img@2x.png) 2x,
            url(../img/temp/highlight/appstore_img@3x.png) 3x
    );
    background-image: -webkit-image-set(
            url(../img/temp/highlight/appstore_img@1x.png) 1x,
            url(../img/temp/highlight/appstore_img@2x.png) 2x,
            url(../img/temp/highlight/appstore_img@3x.png) 3x
    );
    background-repeat: no-repeat;
}

#qrcode_popup .modal_wrap .appstore_img_wrap > div.ios {
    background-position: -121px 4px;
}

#qrcode_popup .modal_wrap .appstore_img_wrap > div.android {
    background-position: -121px -29px;
}

/* 작품문의하기 모달팝업 */
#inquiry_popup .modal_wrap {
    width: 600px;
    height: auto;
    margin: 0 auto;
    max-width: 100%;
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#inquiry_popup .modal_header {
    position: relative;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 30px;
}

#inquiry_popup .modal_header > p {
    font-size: 24px;
    line-height: 1em;
    font-weight: 700;
}

#inquiry_popup .modal__inquiry-work-info {
    position: relative;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 14px 0 14px 72px;
    border-bottom: 1px solid var(--color-grey_200);
    border-top: 1px solid var(--color-grey_200);

}

#inquiry_popup .modal__inquiry-work-info > figure {
    width: 62px;
    height: 62px;
    background-color: #d9d9d9;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#inquiry_popup .modal__inquiry-work-info > figure > img {
    max-height: 100%;
}

#inquiry_popup .modal__inquiry-work-info > figcaption {
    width: 100%;
    position: relative;
    text-align: left;
}

#inquiry_popup .modal__inquiry-work-info > figcaption > span {
    color: var(--color-grey_900);
    font-size: 16px;
    width: 100%;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

#inquiry_popup .modal__inquiry-select-wrap {
    margin: 15px 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}


#inquiry_popup .state {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 24px;
    border-radius: 25px;
    font-size: 14px;
    z-index: 5;
    background-color: var(--color-grey_500);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0px 8px;
    color: var(--color-white);
}

#inquiry_popup .contact button {
    height: 26px;
    padding: 0 18px 0 6px;
    background: url(../img/icons/btn-arrow.png) no-repeat 92% 50%;
}

#inquiry_popup select {
    width: 214px !important;
    height: 32px;
    border: 1px solid var(--color-grey_300);
    background: url(../img/icons/schedule-img.png) no-repeat 95% 50%;
    color: var(--color-grey_700);
}

/* 10월5일수정 */
#inquiry_popup label {
    display: block !important;
    position: relative;
    width: 100%;
}

#inquiry_popup label > span {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: var(--color-grey_600);
}

#inquiry_popup textarea {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 15px;
    border-color: var(--color-grey_300);
}

#inquiry_popup .btn_wrap {
    margin-top: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 10px;
    -moz-column-gap: 10px;
    column-gap: 10px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#inquiry_popup .btn_wrap > button.btn_nt {
    display: none;
}

#inquiry_popup .btn_wrap > button {
    width: 100px;
    height: 38px;
}

#inquiry_popup .contact {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    color: var(--color-grey_600);
}

#hompage-inquiry-pop article{
    padding: 30px;
    padding-right: 20px;
}

#hompage-inquiry-pop article i{
    font-style: normal;
}

#hompage-inquiry-pop article .tit{
    font-size: 24px;
    line-height: 1em;
    font-weight: 700;
    margin-bottom: 30px;
}

#hompage-inquiry-pop article .text{
    color: #636363;
}

#hompage-inquiry-pop article > div {
    display: block;
    height: 500px;
    overflow: hidden;
    overflow-y: auto;
    padding-right: 10px;
}

#hompage-inquiry-pop article > div > div{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

#hompage-inquiry-pop dl{
    width: 47.8%;
    margin-right: 4.4%;
}

#hompage-inquiry-pop article dl:last-child{
    margin-right: 0;
}

#hompage-inquiry-pop .cnt dl{
    width: 100%;
}

#hompage-inquiry-pop dt{
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #000;
    margin-bottom: 10px;
    position: relative;
}

#hompage-inquiry-pop dt > i{
    color: #FF4D00;
}

#hompage-inquiry-pop dt .total-text{
    position: absolute;
    right: 0;
    color: #777777;
    font-size: 12px;
}

#hompage-inquiry-pop dd{
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #000;
    margin-bottom: 15px;
    position: relative;
}

#hompage-inquiry-pop dd input{
    width: 100%;
    border: 1px solid #CBCBCB;
    height: 35px;
    padding: 0 10px;
}

#hompage-inquiry-pop dd textarea{
    width: 100%;
    border: 1px solid #CBCBCB;
    height: 35px;
    resize: none;
    padding: 5px;
}

#hompage-inquiry-pop .cnt dd textarea{
    height: 158px;
    padding: 10px;
}

#hompage-inquiry-pop dd .dropbox{
    display: none;
    position: absolute;
    border: 1px solid #CBCBCB;
    border-top: none;
    background: #f9f9f9;
    width: 100%;
    padding: 5px 10px;
    z-index: 1;
    margin: 0;
}

#hompage-inquiry-pop dd .dropbox li{
    padding: 0;
    cursor: pointer;
}

#hompage-inquiry-pop dd .dropbox li:hover a{
    text-decoration: underline;
}

#hompage-inquiry-pop dd .dropbox a{
    color: #898989;
    font-size: 13px;
}

#hompage-inquiry-pop dd .now{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border: 1px solid #CBCBCB;
    line-height: 35px;
    padding: 0 10px;
    text-align: center;
    color: #636363;
    cursor: pointer;
    background: url(../img/icons/icon_location.svg)no-repeat right center;
    background-position-x: calc(100% - 10px);
    background-position-x: -webkit-calc(100% - 10px);
    background-position-x: -moz-calc(100% - 10px);
    background-position-x: -o-calc(100% - 10px);
}

#hompage-inquiry-pop .reference-file dl{
    width: 100%;
    margin-top: 20px;
}

#hompage-inquiry-pop .reference-file dt{
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
}

#hompage-inquiry-pop .reference-file .file-btn{
    font-size: 12px;
    padding: 2px 10px;
    border: 1px solid #B9B9B9;
    margin-bottom: 0;
    vertical-align: top;
    margin-left: 5px;
    border-radius: 4px;
    cursor: pointer;
}

#hompage-inquiry-pop .reference-file .hidden-file{
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

#hompage-inquiry-pop .reference-file .file-list{
    height: 78px;
    overflow-y: auto;
    border: 1px solid #B9B9B9;
    background-color: #F9F9F9;
    padding: 8px;
    margin-bottom: 25px;
}

#hompage-inquiry-pop .reference-file .icon{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    opacity: 0.5;
    cursor: pointer;
}

#hompage-inquiry-pop .reference-file .icon:hover{
    opacity: 1;
}

#hompage-inquiry-pop .reference-file .icon span{
    color: #666;
}

#hompage-inquiry-pop .reference-file .data li{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0;
    line-height: normal;
    color: #333;
}

#hompage-inquiry-pop .reference-file .data a{
    width: 14px;
    height: 14px;
    font-size: 14px;
    border: 1px solid #333;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 4px;
    color: #333;
}

#hompage-inquiry-pop .reference-file .data li:hover{
    text-decoration: underline;
}

#hompage-inquiry-pop .reference-file .data li:hover a{
    color: #fff;
    background: #333;
    text-decoration: none;
}

#hompage-inquiry-pop .notice{
    border: 1px solid #CBCBCB;
    padding: 10px;
}

#hompage-inquiry-pop .notice li{
    position: relative;
    padding-left: 10px;
    font-size: 12px;
    line-height: 1.6;
    margin-bottom: 5px;
    color: #636363;
}

#hompage-inquiry-pop .notice li::after{
    content: '';
    position: absolute;
    left: 0;
    top: 11px;
    width: 3px;
    height: 3px;
    border-radius: 100%;
    background: #636363;
}

#hompage-inquiry-pop .notice li b{
    color: #636363;
}

#hompage-inquiry-pop .notice .text{
    display: block;
}

#hompage-inquiry-pop .bottom-area{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
}

#hompage-inquiry-pop .bottom-area font{
    text-decoration: underline;
    color: #FF4D00;
}

#hompage-inquiry-pop .bottom-area input{
    background: #FFFFFF;
    border: 1px solid #CBCBCB;
    border-radius: 4px;
    width: 16px;
    height: 16px;
    appearance: none;
    vertical-align: sub;
    margin-right: 10px;
    cursor: pointer;
    position: relative;
}

#hompage-inquiry-pop .bottom-area input:checked::after{
    content: '✔';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-55%, -50%);
    font-size: 13px;
    text-align: center;
    color: #000;

}

#hompage-inquiry-pop .bottom-area label{
    margin: 0;
}

#hompage-inquiry-pop .bottom-area > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

#hompage-inquiry-pop .bottom-area .btns{
    margin-top: 30px;
    width: 100%;
}

#hompage-inquiry-pop .bottom-area .btns a{
    font-weight: 700;
    font-size: 12px;
    width: 166px;
    line-height: 40px;
    border-radius: 4px;
    text-align: center;
}

#hompage-inquiry-pop .bottom-area .btns a:first-child{
    border: 1px solid #939393;
    color: #636363;
    margin-right: 10px;
}

#hompage-inquiry-pop .bottom-area .btns a:last-child{
    background: #000;
    border: 1px solid #000;
    color: #fff;
}

.reset-btn {
    margin-left: auto;
}

.reset-btn > button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 12px;
    padding: 0 8px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color-grey_700);
}

.reset-btn > button > img {
    margin-right: 4px;
}

.reset-btn > button:hover {
    border-color: var(--color-grey_800);
}


/* 작가db */
#artist-section {
    min-height: 650px;
}

.artist-row {
    padding: 0 40px;
}

.artist-cnt {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-bottom: 64px;
}

#artist-section .tit {
    padding: 25px 0 10px 0;
    border-bottom: 1px solid var(--color-black);
    margin-bottom: 40px;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: -0.04em;
}

.artist-filter-wrap {
    margin-bottom: 40px;
}

.artist-filter-wrap ul.langlist {
    display: none;
    margin-bottom: 10px;
}

ul.lang-main-li.langlist {
    padding: 0 18px;
}

.artist-filter-wrap ul.langlist li {
    margin-right: 0;
}

.artist-filter-wrap ul.langlist li:first-child {
    position: relative;
    padding-right: 10px;
}

.artist-filter-wrap ul.langlist li:last-child {
    padding-left: 9px;
}

.artist-filter-wrap ul.langlist li:first-child:after {
    position: absolute;
    content: '';
    width: 1px;
    height: 13px;
    background-color: var(--color-grey_400);
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.artist-filter-wrap ul.langlist li > a {
    font-size: 15px;
}

.artist-filter-wrap ul.langlist li.active > a {
    color: #000000;
}

.artist-filter-wrap .artist-tab-row {
    padding: 0 40px;
}


.artist-filter-wrap ul.ko-li {
    margin-bottom: 12px;
}

.artist-filter-wrap ul.en-li {
    margin-bottom: 22px;
}

.artist-filter-wrap ul li {
    display: inline-block;
    padding-left: 0;
    margin-right: 10px;
}

.artist-filter-wrap ul li a {
    font-size: 18px;
    color: var(--color-grey_400);
}

.artist-filter-wrap .search-wrap {
    position: relative;
    width: 240px;
    height: 36px;
    -webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: #f3f3f3;
    padding: 0 10px 0 26px;
}

.artist-filter-wrap .search-wrap.on {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid var(--color-grey_1000);
}

.artist-filter-wrap .search-wrap.on > i {
    color: var(--color-grey_1000);
}

.artist-filter-wrap .search-wrap > i {
    position: absolute;
    top: 50%;
    left: 10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: var(--color-grey_600);
}

.artist-filter-wrap .search-wrap > input {
    width: 100%;
    height: 100% !important;
    background: none !important;
    border: none !important;
}

.artist-list-wrap {
    padding-bottom: 86px;
}

.artist-list-wrap .common {
    padding: 50px 0 35px 0;
    border-top: 1px solid var(--color-grey_400);
}

.artist-list-wrap .common:first-child {
    border-top: none;
}

.artist-list-wrap .common .title {
    font-size: 26px;
    margin-bottom: 30px;
}

.artist_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.artist_list .list-box {
    position: relative;
    width: 16.6667%;
    margin-bottom: 15px;
    padding-right: 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.artist_list .list-box .info {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.artist_list .list-box .info:hover .ko-name {
    color: #F67137;
}

.artist_list .list-box .info .ko-name {
    font-size: 16px;
    line-height: 1.2em;
    font-weight: 400;
    cursor: pointer;
}

.artist_list .list-box .info .en-name {
    font-weight: 400;
    font-size: 12px;
    line-height: 1.2em;
    color: #7d7d7d;
    cursor: pointer;
}

.artist_list .list-box .img-wrap {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 86px;
    width: 135px;
    height: 135px;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: var(--color-white);
    border: 1px solid #d7d7d7;
    border-radius: 4px;
    z-index: 10;
}

.artist_list .list-box:nth-child(6n) .img-wrap {
    left: -150px;
}

.artist_list .list-box .img-wrap > div {
    width: 125px;
    height: 125px;
    overflow: hidden;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--color-grey_200);
}

.artist_list .list-box .img-wrap > div > img {
    width: 100%;
}

.artist_list .list-box .img-wrap:before {
    content: " ";
    position: absolute;
    width: 0;
    height: 0;
    left: -3px;
    right: auto;
    top: 50%;
    border: 8px solid;
    border-color: #d7d7d7 transparent transparent #d7d7d7;
    -webkit-transform: rotate(-45deg) translateY(-50%);
    -ms-transform: rotate(-45deg) translateY(-50%);
    transform: rotate(-45deg) translateY(-50%);
}

.artist_list .list-box:nth-child(6n) .img-wrap:before {
    left: auto;
    top: 41%;
    right: -3px;
    -webkit-transform: rotate(135deg) translateY(-41%);
    -ms-transform: rotate(135deg) translateY(-41%);
    transform: rotate(135deg) translateY(-41%);
}

.artist_list .list-box .img-wrap:after {
    content: " ";
    position: absolute;
    width: 0;
    height: 0;
    left: -1px;
    right: auto;
    top: 50%;
    border: 8px solid;
    border-color: #ffffff transparent transparent #ffffff;
    -webkit-transform: rotate(-45deg) translateY(-50%);
    -ms-transform: rotate(-45deg) translateY(-50%);
    transform: rotate(-45deg) translateY(-50%);
}

.artist_list .list-box:nth-child(6n) .img-wrap:after {
    left: auto;
    top: 41%;
    right: -2px;
    -webkit-transform: rotate(135deg) translateY(-41%);
    -ms-transform: rotate(135deg) translateY(-41%);
    transform: rotate(135deg) translateY(-41%);
}


#artist-scroll-box {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
    z-index: 100;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 15px 0;
}

#artist-scroll-box ul.langlist {
    padding: 0 18px;
}

.artist-scroll-box.on {
    display: block;
}

#artist-scroll-box .artist-filter-wrap {
    margin-bottom: 0;
}

.artist-footer {
    width: 100%;
    height: 64px;
    background-color: var(--color-grey_600);
}

.artist-footer > div {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.artist-footer strong {
    font-size: 18px;
    color: var(--color-white);
}

.artist-footer p {
    font-size: 11px;
    color: var(--color-grey_400);
}

#artist-modal {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
    z-index: 120;
}

#artist-modal.on {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

#artist-modal .bar {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 60px;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 15px;
}

#artist-modal .bar .close-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background-position: 0 0;
    background-image: image-set(
            url(../img/icons/artist-icon.png) 1x,
            url(../img/icons/artist-icon@2x.png) 2x,
            url(../img/icons/artist-icon@3x.png) 3x
    );
    background-image: -webkit-image-set(
            url(../img/icons/artist-icon.png) 1x,
            url(../img/icons/artist-icon@2x.png) 2x,
            url(../img/icons/artist-icon@3x.png) 3x
    );
    background-repeat: no-repeat;
    cursor: pointer;
}

#artist-modal .bar .icon-wrap {
    position: absolute;
    bottom: 15px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

#artist-modal .bar .icon-wrap .icon {
    width: 40px;
    height: 40px;
    border: 1px solid var(--color-white);
    border-radius: 40px;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
}

#artist-modal .bar .icon-wrap .icon:hover {
    background-color: var(--color-grey_600);
}

#artist-modal .bar .icon-wrap .icon:first-child {
    margin-bottom: 15px;
}

#artist-modal .bar .icon-wrap .icon span {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-position: 0 -30px;
    background-image: image-set(
            url(../img/icons/artist-icon.png) 1x,
            url(../img/icons/artist-icon@2x.png) 2x,
            url(../img/icons/artist-icon@3x.png) 3x
    );
    background-image: -webkit-image-set(
            url(../img/icons/artist-icon.png) 1x,
            url(../img/icons/artist-icon@2x.png) 2x,
            url(../img/icons/artist-icon@3x.png) 3x
    );
    background-repeat: no-repeat;
}

#artist-modal .bar .icon-wrap .icon.heart.on span {
    background-position: -20px -30px;
}

#artist-modal .bar .icon-wrap .icon:last-child span {
    background-position: -40px -30px;
}

#artist-modal > .info {
    width: 100%;
    height: 100%;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 47px 70px;
    overflow-y: scroll;
}

#artist-modal > .info > .work_info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#artist-modal > .info > .work_info > .img {
    width: 100px;
    height: 100px;
    overflow: hidden;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#artist-modal > .info > .work_info > .img > img {
    width: 100%;
}

#artist-modal > .info > .work_info > .cnt {
    padding-top: 15px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding-left: 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#artist-modal > .info > .work_info > .cnt > .name {
    font-size: 26px;
    font-weight: 700;
}

#artist-modal > .info > .work_info > .cnt > .en_name {
    font-size: 16px;
    line-height: 1em;
    color: var(--color-grey_600);
    margin: 8px 0 16px 0;
}

#artist-modal > .info > .work_info > .cnt > .year {
    font-size: 14px;
}

#artist-modal > .info .title {
    width: 100%;
    border-bottom: 1px solid var(--color-grey_400);
    margin: 32px 0;
}

#artist-modal > .info .title span {
    position: relative;
    font-size: 20px;
    line-height: 26px;
    display: inline-block;
    padding-bottom: 4px;
}

#artist-modal > .info .title span:after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #000000;
}

#artist-modal > .info .writer_info {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 107px 30px auto;
    grid-template-columns: 107px auto;
    gap: 0 30px;
}

#artist-modal > .info .writer_info .writer-img {
    height: 107px;
    border-radius: 4px;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#artist-modal > .info .writer_info .writer-img > img {
    height: 100%;
}

#artist-modal > .info .writer_info .writer-desc > p,
#artist-modal > .info .writer_history > p {
    font-size: 16px;
    line-height: 1.6em;
}

#artist-modal > .info .writer-data,
#artist-modal > .info .work-data {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 15px 1fr 15px 1fr 15px 1fr;
    grid-template-columns: repeat(4, 1fr);
    gap: 0 15px;
}

#artist-modal > .info .writer-data > div,
#artist-modal > .info .work-data > div {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    overflow: hidden;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    /* width: 18.56%; */
    background-color: var(--color-grey_200);
    vertical-align: middle;
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 15px;
}

#artist-modal > .info .writer-data > div::after,
#artist-modal > .info .work-data > div::after {
    content: '';
    display: block;
    padding-bottom: 100%;
}

#artist-modal > .info .w-auction > img {
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#artist-modal > .info .writer-data > div > .hover-box,
#artist-modal > .info .work-data > div > .hover-box {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    padding: 14px;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 10;
}

#artist-modal > .info .writer-data .w-video > img,
#artist-modal > .info .writer-data div.no-img-link > .link-cnt {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}


#artist-modal > .info .writer-data > div:hover > .hover-box,
#artist-modal > .info .work-data > div:hover > .hover-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#artist-modal .hover-box > .info > p.name {
    font-size: 13px;

}

#artist-modal .hover-box > .info > p.price-tit {
    font-size: 11px;
    margin-bottom: 12px;
}

#artist-modal .hover-box > .info > p.start-bid > span {
    color: var(--color-white);
}

.artist-tab-gradient {
    display: none;
    position: absolute;
    top: -6px;
    right: 0px;
    width: 35px;
    height: 35px;
    background: -webkit-gradient(linear, right top, left top, from(white), color-stop(80%), to(rgba(255, 255, 255, 0)));
    background: -o-linear-gradient(right, white, 80%, rgba(255, 255, 255, 0));
    background: linear-gradient(to left, white, 80%, rgba(255, 255, 255, 0));
    z-index: 115;
}

.artist-tab-gradient.active {
    display: block !important;
}


@media (max-width: 1100px) {
    .artist_list .list-box {
        width: 25%;
    }

    .artist_list .list-box:nth-child(6n) .img-wrap:before {
        left: -3px;
        top: 50%;
        right: auto;
        -webkit-transform: rotate(-45deg) translateY(-50%);
        -ms-transform: rotate(-45deg) translateY(-50%);
        transform: rotate(-45deg) translateY(-50%);
    }

    .artist_list .list-box:nth-child(6n) .img-wrap:after {
        left: -1px;
        top: 50%;
        right: auto;
        -webkit-transform: rotate(-45deg) translateY(-50%);
        -ms-transform: rotate(-45deg) translateY(-50%);
        transform: rotate(-45deg) translateY(-50%);
    }

    .artist_list .list-box:nth-child(4n) .img-wrap:before {
        left: auto;
        top: 41%;
        right: -3px;
        -webkit-transform: rotate(135deg) translateY(-41%);
        -ms-transform: rotate(135deg) translateY(-41%);
        transform: rotate(135deg) translateY(-41%);
    }

    .artist_list .list-box:nth-child(4n) .img-wrap:after {
        left: auto;
        top: 41%;
        right: -2px;
        -webkit-transform: rotate(135deg) translateY(-41%);
        -ms-transform: rotate(135deg) translateY(-41%);
        transform: rotate(135deg) translateY(-41%);
    }

    .artist_list .list-box:nth-child(6n) .img-wrap {
        left: 86px;
    }

    .artist_list .list-box:nth-child(4n) .img-wrap {
        left: -150px;
    }
}

@media (max-width: 900px) {
    #artist-modal > .info .writer-data,
    #artist-modal > .info .work-data {
        -ms-grid-columns: (1fr) [ 3 ];
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    #artist-scroll-box {
        padding: 13px 0px;
    }

    .artist-list-wrap .common {
        padding: 15px 0 0 0;
    }

    .artist-filter-wrap ul.langlist {
        display: block;
    }

    .artist-scroll-wrap,
    .artist-scrollbox-scroll-wrap {
        position: relative;
        height: 40px;
        padding: 0 0 0 18px;
    }

    .artist-filter-wrap .tab_cnt,
    .artist-scrollbox-scroll-wrap .tab_cnt {
        overflow-x: auto;
    }

    .artist-filter-wrap .artist-tab-row {
        padding: 0;
    }

    .artist-filter-wrap ul.en-li,
    .artist-filter-wrap ul.ko-li {
        white-space: nowrap;
        width: 100%;
    }

    .artist-filter-wrap ul.ko-li,
    .artist-filter-wrap ul.en-li {
        margin-bottom: 0;
    }

    .artist-filter-wrap .tab_cnt::-webkit-scrollbar {
        -webkit-appearance: none;
    }

    #artist-section .tit {
        font-size: 24px;
        line-height: 1em;
        padding: 10px 0 0 0;
        margin-bottom: 30px;
        border: none;
    }

    #artist-modal {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    #artist-modal .bar {
        width: 100%;
        height: 60px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-top: 0;
        padding: 0 20px;
    }

    #artist-modal .bar .icon-wrap {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    #artist-modal .bar .icon-wrap .icon:first-child {
        margin-bottom: 0;
        margin-right: 13px;
    }

    #artist-modal > .info {
        padding: 20px;
    }

    #artist-modal .bar .icon-wrap .icon {
        width: 30px;
        height: 30px;
    }

    #artist-modal > .info .writer-data,
    #artist-modal > .info .work-data {
        -ms-grid-columns: (1fr) [ 2 ];
        grid-template-columns: repeat(2, 1fr);
    }

    #artist-modal .bar .icon-wrap {
        bottom: auto;
        left: auto;
        right: 20px;
        top: 50%;
        -webkit-transform: translateX(0%) translateY(-50%);
        -ms-transform: translateX(0%) translateY(-50%);
        transform: translateX(0%) translateY(-50%);
    }

    .artist-row {
        padding: 0 18px;
    }

    .artist_list .list-box {
        width: 33.3334%;
    }

    .artist_list .list-box:nth-child(4n) .img-wrap:before {
        left: -3px;
        top: 50%;
        right: auto;
        -webkit-transform: rotate(-45deg) translateY(-50%);
        -ms-transform: rotate(-45deg) translateY(-50%);
        transform: rotate(-45deg) translateY(-50%);
    }

    .artist_list .list-box:nth-child(4n) .img-wrap:after {
        left: -1px;
        top: 50%;
        right: auto;
        -webkit-transform: rotate(-45deg) translateY(-50%);
        -ms-transform: rotate(-45deg) translateY(-50%);
        transform: rotate(-45deg) translateY(-50%);
    }

    .artist_list .list-box:nth-child(3n) .img-wrap:before {
        left: auto;
        top: 41%;
        right: -3px;
        -webkit-transform: rotate(135deg) translateY(-41%);
        -ms-transform: rotate(135deg) translateY(-41%);
        transform: rotate(135deg) translateY(-41%);
    }

    .artist_list .list-box:nth-child(3n) .img-wrap:after {
        left: auto;
        top: 41%;
        right: -2px;
        -webkit-transform: rotate(135deg) translateY(-41%);
        -ms-transform: rotate(135deg) translateY(-41%);
        transform: rotate(135deg) translateY(-41%);
    }

    .artist_list .list-box:nth-child(4n) .img-wrap {
        left: 86px;
    }

    .artist_list .list-box:nth-child(3n) .img-wrap {
        left: -150px;
    }

    #artist-modal > .info > .work_info > .img {
        width: 96px;
        height: 96px;
    }

    #artist-modal > .info > .work_info > .cnt > .name {
        font-size: 20px;
    }

    #artist-modal > .info > .work_info > .cnt > .en_name {
        font-size: 13px;
    }

    #artist-modal > .info > .work_info > .cnt > .year {
        font-size: 12px;
    }

    #artist-modal > .info .title {
        margin: 20px 0;
    }

    #artist-modal > .info .title span {
        font-size: 16px;
    }

    #artist-modal > .info .writer_info .writer-img {
        height: 96px;
    }

    #artist-modal > .info .writer_info {
        -ms-grid-columns: 96px 15px auto;
        grid-template-columns: 96px auto;
        gap: 0 15px;
    }

    #artist-modal > .info .writer_info .writer-desc > p,
    #artist-modal > .info .writer_history > p {
        font-size: 14px;
    }

    .search-wrap > input::-webkit-input-placeholder {
        color: #f3f3f3;
    }

    .search-wrap > input::-moz-placeholder {
        color: #f3f3f3;
    }

    .search-wrap > input:-ms-input-placeholder {
        color: #f3f3f3;
    }

    .search-wrap > input::-ms-input-placeholder {
        color: #f3f3f3;
    }

    .search-wrap > input::placeholder {
        color: #f3f3f3;
    }
}


.artist-scroll-wrap .tab_cnt,
.artist-scrollbox-scroll-wrap .tab_cnt {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.artist-scroll-wrap .tab_cnt::-webkit-scrollbar,
.artist-scrollbox-scroll-wrap .tab_cnt::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}


@media (max-width: 630px) {
    #inquiry_popup .modal_wrap {
        width: auto;
        padding: 0 20px;
    }

    #inquiry_popup .close-modal {
        right: 20px;
    }

    #inquiry_popup .modal__inquiry-select-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    #inquiry-hint-message {
        padding-left: 0 !important;
        margin-top: 3px;
    }

}

@media (max-width: 590px) {
    #inquiry_popup select {
        width: 100% !important;
        background: url(../img/icons/schedule-img.png) no-repeat 96% 50%
    }

    #inquiry_popup .contact button {
        display: none !important;
    }

    #inquiry_popup .btn_wrap > button.btn_nt {
        display: block;
    }

    #inquiry_popup .btn_wrap,
    #inquiry_popup .modal_header {
        margin-bottom: 20px !important;
    }

    #inquiry_popup .modal_header > p {
        font-size: 20px;
    }
}


@media (max-height: 680px) {
    .modal-document-evidence .modal-content h5{
        margin-bottom: 15px;
    }

    .modal-document-evidence .masking .masking-noti{
        margin-bottom: 10px;
        padding: 10px 20px  10px 15px;
    }

    .modal-document-evidence .img-wrap{
        height: auto;
    }

    .modal-document-evidence .upload-img{
        height: 450px;
    }

    .modal-document-evidence .img-wrap li:nth-child(4){
        margin-bottom: 10px;
    }

    .modal-document-evidence .masking-tool{
        padding: 10px 0;
    }

    .modal-document-evidence .masking .document-evidence-btn{
        margin-top: 0;
    }
}

@media screen and (max-width: 1200px) {
    .logo-img-mb {
        width: 138px;
        height: 64px;
        margin-top: 10px;
    }
}

@media screen and (max-width: 485px) {
    .logo-img-mb {
        width: 128px;
        height: 58px;
        margin-top: -2px;
        margin-left: -4px;
    }
}

/*Breadcrumb(Common)*/
.common-breadcrumb {
    background: #F9F9F9;
    border-bottom: 1px solid #F3F3F3;
}

.common-breadcrumb ul {
    max-width: 1250px;
    width: 100%;
    padding: 0 20px;
    margin: auto;
    display: flex !important;
    flex-direction: row
}

.common-breadcrumb ul > li{
    position: relative;
    padding: 0;
}

.common-breadcrumb ul > li > a {
    display: block;
    border-left: 1px solid #EAEAEA;
    min-width: 170px;
    line-height: 36px;
    padding: 0 9px;
    color: #6a6a6a;
    background: url('../img/icons/icon_location.svg')no-repeat calc(100% - 8px) 50%;
}

.common-breadcrumb ul > li:not(.home) > a.on{
    background-image: url('../img/icons/icon_location_on.svg');
}

.common-breadcrumb ul > li > a:hover{
    text-decoration: underline;
    text-underline-offset : 3px;
    text-decoration-color: #6a6a6a;
}

.common-breadcrumb ul > li:nth-child(1) > a {
    min-width: auto;
    background: none;
}

.common-breadcrumb ul > li:nth-child(3) a {
    border-right: 1px solid #EAEAEA;
    font-size: 14px;
    padding: 0 10px;
}

.common-breadcrumb .depth2 {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 31;
    display: none;
}

.common-breadcrumb .depth2 a {
    border-left: none !important;
    display: block;
    background: #eaeaea;
    border-bottom: 1px solid #F3F3F3;
    line-height: 36px;
    padding: 0 11px;
    color: #4E4E4E
}

.common-breadcrumb .depth2 a:hover {
    text-decoration: underline;
}

.common-breadcrumb .depth2 a.on {
    background: #D7D7D7
}

.common-breadcrumb .depth-4 a{
    background: none;
    pointer-events: none;
}

.breadcrumb_event-none .common-breadcrumb ul > li:not(.home) > a {
    pointer-events: none;
    background: none
}

.mypage .dropdown-divider,
.mypage .dropdown-item:nth-child(5),
.mypage .dropdown-item:nth-child(6) {
    display: none
}

.mypage .common-breadcrumb ul > li:nth-child(2) > a {
    pointer-events: none;
    background: none
}

.mypage .common-breadcrumb ul > li:nth-child(2) i {
    display: none;
}

.consign_consignor-detail.container {
    margin-top: 2rem;
}

/* 휴먼복구 대상자 중복확인 누락회원 팝업 */
.modal.fade.change-id-modal > div > div{
    padding: 0;
    overflow: hidden;
}

.change-id-modal .modal-body{
    padding: 0;
}

.change-id-modal .modal-body > div{
    width: 100%;
    padding: 30px;
}

.change-id-modal .change-info-text {
    text-align: center;
}

.change-id-modal .change-info-text .icon{
    width: 60px;
}

.change-id-modal .change-info-text p{
    font-size: 14px;
    color: #252525;
    margin-top: 10px;
    font-family: "Noto Sans KR"
}

.change-id-modal .change-form{
    border: 1px solid #D9D9D9;
    background: #FAFAFA;
}

.change-id-modal .change-form dt{
    color: #252525;
    font-weight: 500;
    font-size: 16px;
    margin-right: 6px;
}

.change-id-modal .change-form dd{
    color: #252525;
    font-size: 16px;
    transform: translateY(-1px);
}

.change-id-modal .change-form .original{
    border: 1px solid #D9D9D9;
    background: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 0;
    border-radius: 4px;
    font-family: "Noto Sans KR"
}

.change-id-modal .change-form .after{
    margin-top: 30px;
    font-family: "Noto Sans KR"
}

.change-id-modal .change-form .after dd {
    display: flex;
    flex-direction: column;
    align-items: start;
    margin-top: 8px;
    color: #252525;
}

.change-id-modal .change-form .after input {
    border: 1px solid #D9D9D9;
    background: #FFF;
    padding: 15px 10px;
    border-radius: 4px;
    width: 100%;
}

.change-id-modal .change-form .after .desc {
    color: #039700;
    font-size: 12px;
    margin-top: 4px;
}

.change-id-modal .change-form .after .desc.error {
    color: #F00;
}

.change-id-modal .change-form button {
    background: #000;
    color: #fff;
    width: 120px;
    height: 50px;
    display: block;
    margin: 30px auto 0;
    border-radius: 4px;
}


@media all and (max-width: 1600px){
    .ka-container .ka-content-wrapper .bottom-menu .text-zoom{
        right: 20px;
    }
}

@media all and (max-width: 1200px) {
    .self-auth-popup.modal .modal-content{
        width: 98%;
    }

    .mask-pc .modal-dialog{
        width: 98%;
    }

    .mask-pc .pc.img-wrap{
        width: 60%;
    }

    .mask-pc .mask-info{
        padding: 15px 15px 30px;
        width: calc(100% - 55%);
        width: -webkit-calc(100% - 55%);
        width: -moz-calc(100% - 55%);
        width: -o-calc(100% - 55%);
    }

    .mask-pc .masking-tool .file-select{
        padding: 0;
    }

    .mask-pc .document-evidence-btn .submit-btn{
        padding: 0;
    }

    .mask-pc .masking-tool a.reset{
        padding: 0;
    }
}

@media all and (max-width: 820px) {
    .self-auth-popup > .modal_wrap{
        max-width: 690px;
        width: 100%;
    }

    .self-auth-popup.modal .modal-content{
        padding: 20px;
        height: auto;
    }

    .modal-document-evidence .upload-img > div{
        align-items: baseline;
    }

    .modal-document-evidence .img-wrap {
        height: 300px;
        overflow-y: auto;
    }

    .modal-document-evidence .pc{
        display: none;
    }

    .modal-document-evidence .masking .masking-noti{
        padding: 15px;   
    }
    
}

@media all and (max-width: 768px) {
    .modal.show.change-id-modal .modal-dialog{
        padding: 0;
    }
}

@media all and (max-width: 720px) {
    .common-breadcrumb{
        display:none;
    }

    .modal-document-evidence .img-wrap li{
        padding-left: 35px;
        text-indent: -15px;
        padding-right: 25px;
        font-size: 14px;
    }

    .modal-document-evidence .img-wrap.biz .upload-img {
        height: 100%;
    }

    .modal-document-evidence .img-wrap.biz .masking-wrap{
        top: 50%;
        transform: translate(-50%, -50%);
        display: flex;
    }
}

@media all and (max-width: 575px) {
    /* 휴먼복구 대상자 중복확인 누락회원 팝업 */
    .modal.show.change-id-modal .modal-dialog {
        padding: 0 20px;
    }

    .change-id-modal .change-info-text .icon {
        width: 50px;
    }

    .change-id-modal .change-info-text p br{
        display: none;
    }

    .change-id-modal .change-form dt,
    .change-id-modal .change-form dd{
        font-size: 14px;
    }
}

@media all and (max-width: 520px) {
    #hompage-inquiry-pop article > div > div{
        display: block;
    }

    #hompage-inquiry-pop dl{
        width: 100%;
        margin-right: 0;
    }

    #hompage-inquiry-pop .bottom-area .btns a{
        width: 50%;
    }
}

@media all and (max-width: 450px) {
    #modal-bid-noti > div > div {
        width: 380px !important;
    }

    .modal-document-evidence .document-evidence-noti {
        padding: 0 20px;
        margin-bottom: 20px;
    }

    .modal-document-evidence > div > div > .modal-evidence-close{
        top: 29px;
        width: 13px;
        right: 15px;
    }

    #modal-document-evidence > div > div{
        padding-top: 20px;
        padding-bottom: 20px;
        padding: 20px 15px;
    }

    .self-auth-popup #modal-document-evidence  > div > div{
        width: 100%!important
    }

    .self-auth-popup.modal.fade > div > div{
        padding: 20px 15px;
    }

    .modal-document-evidence .masking .masking-noti{
        padding: 10px 10px 10px 15px;
    }

    .modal-document-evidence .masking p br{
        display: none;
    }

    .modal-document-evidence .document-evidence-btn .submit-btn{
        height: 45px;
        line-height: 44px;
    }

    .modal-document-evidence .masking-tool .file-select{
        margin-left: 15px;
    }

    .modal-document-evidence .masking-tool .editor_btn{
        padding-left: 10px;
        padding-right: 10px;
    }

    .modal-document-evidence .masking-tool a.reset{
        padding-left: 10px;
        padding-right: 10px;   
    }

    .modal-document-evidence .document-evidence-btn{
        margin-top: 0;
    }

    .modal-document-evidence .upload-img.on .sample-img{
        top: 50%;
        transform: translate(-50%, -50%);
    }

}

@media (max-width: 415px) {
    #modal-bid-noti > div > div{
        width: 360px !important;
        padding: 20px 20px !important;
    }

    .modal-show-popup > div > div > div > h3 {
        font-size: 14px !important;
    }

    .bank-account-num > p {
        font-size: 12px !important;
    }
}

@media all and (max-width: 380px) {
    .modal-document-evidence .masking-tool div a{
        font-size: 12px;
    }

    .modal-document-evidence .masking-tool .file-select{
        margin-left: 10px;
    }

    .modal-document-evidence .masking-tool a.reset{
        background-size: 20px;
        width: 44px;
    }

    .modal-document-evidence .masking-tool .editor_btn {
        padding-left: 10px;
        padding-right: 10px;
    }

    .modal-document-evidence .masking-tool .editor_btn img{
        width: 20px;
    }

}


