/*========== Reset ==========*/
body {
    position: relative;
    min-height: 100vh;
    overflow-x: hidden;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    color: #333;
    font-size: 15px;
    line-height: 1.4;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
    padding: 0;
    background-color: #F4F3F9;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: normal;
}

p {
    margin: 0;
}

ul, ol {
    list-style: none;
}
ul, ol, li {
    margin: 0;
    padding: 0;
}

address {
    font-style: normal;
}

h1, .heading-1, 
h2, .heading-2, 
h3, .heading-3, 
h4, .heading-4, 
h5, .heading-5, 
h6, .heading-6 {
    font-weight: bold;
    line-height: 1.2;
}

h1, .heading-h1 { 
    font-size: 30px;
}
h2, .heading-h2 { 
    font-size: 25px;
}
h3, .heading-h3 { 
    font-size: 20px;
}
h4, .heading-h4 { 
    font-size: 18px;
}
h5, .heading-h5 { 
    font-size: 16px;
}
h6, .heading-h6 { 
    font-size: 14px;
}

.heading.extended {
    margin-left: -10px;
    margin-right: -10px;
}

h1.login-title {
    font-size: 15px;
    font-weight: normal;
    line-height: 1.5;
}

h1.logout-title {
    font-size: 26px;
    font-weight: bold;
    line-height: 1.5;
    color: #57D395;
}

.logout-result-block {
    display: block;
    padding-top: 30px;
    padding-bottom: 30px;
}

.logout-result-block .logout-icon img {
    height: 65px; 
    margin-bottom: 1.5rem;
}

.text-link {
    margin-top: 5px;
    color: #4DCD8A !important;
    font-size: 14px;
    font-weight: 200;
    text-decoration: underline;
}

.text-link .ic {
    font-size: 11px;
    margin-left: 3px;
    vertical-align: baseline;
}

.text-green {
    color: #4DCD8A;
}

.text-red {
    color: #ee2e24;
}

.font-bold {
    font-weight: bold;
}

.font-size-12 {
    font-size: 12px;
}

.font-size-14 {
    font-size: 14px;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.name {
    line-height: 1.5;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}
.mb-0 {
	margin-bottom: 0 !important;
}

.d-inline-flex {
    display: inline-flex !important;
}

.flex-row-end {
    flex-direction: row;
    justify-content: flex-end;
}

.w-full {
    width: 100%;
}

.body-font {
    font-size: 15px;
}
a,
a:hover,
a:focus {
    outline: 0;
    color: inherit;
    text-decoration: none;
}
a[href^=tel] {
    white-space: nowrap;
}

img {
    border: 0;
    outline: 0;
    max-width: 100%;
    vertical-align: middle;
}

.nowrap {
    white-space: nowrap;
}

table {
    width: 100%;
}
th {
    font-weight: normal;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

button,
input,
select,
textarea {
    outline: 0;
    -webkit-appearance: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    border: 0;
    background: none;
    padding: 0;
    margin: 0;
    min-width: inherit;
    font: inherit;
    text-transform: none;
    text-align: left;
    color: inherit;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

select::-ms-expand {
    display: none;
}

iframe {
    border: 0;
}

video::-webkit-media-controls {
    display: none !important;
}

small {
    font-size: 90%;
}

.text-end {
    text-align: end !important;
}

.section { position: relative; }
.error-page .image.space-img img{
margin-top: 20%;
}
.sc-heading {
    margin-bottom: 30px;
}
.sc-heading.no-bt {
    margin-bottom: 0;
}
.sc-heading .image {
    margin-bottom: 30px;
}

.sc-heading p.desc.c-white.space{margin-top: 2%; }
/* .sc-heading .desc.c-white strong{padding: 0; margin: 0;} */
.sc-heading .desc{ font-size: 14px; line-height: 22px; margin-top: 10px; }

.sc-heading .desc-b { font-size: 16px; font-weight: bold; margin-top: 15px; }
.sc-heading .desc-b a.link-more {
    font-size: 16px;
}
.sc-heading .desc-b a.link-more:after { font-size: 10px; }
.sc-heading .txt-small {
    font-size: 13px;
    color: #999;
    font-weight: normal;
}
.flex-heading-between {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
}
.flex-heading-between .right {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}
.flex-heading-between .right .input {
    width: 350px;
}

@media (max-width: 767px) {
    .flex-heading-between {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}
@media (max-width: 480px) {
    .flex-heading-between .right {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        width: 100%;
    }
    .flex-heading-between .right .input {
        width: 100%;
    }
}

.txt-small {
    font-size: 13px;
}
@media (max-width: 767px) {
    .flex-col-mobile {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }        
    .flex-col-mobile .btn {
        max-width: 150px !important;
    }
}
.d-inline-block { display: inline-block; }
.a-left { text-align: left !important; }
.a-center { text-align: center !important; }
.a-right { text-align: right !important; }
.f-left { float: left !important;}
.f-right { float: right !important;}

.c-green { color: #4DCC89 !important; }
.c-dark-green { color: #00A850 !important; }
.c-success { color: #4DCC89 !important; }
.c-gray { color: #999999 !important; }
.c-white { color: #fff !important; }
.c-red { color: #FF0000 !important; }
.c-yellow { color: #FA9B02 !important; }
.c-dark-blue { color: #394855 !important; }
.c-black { color: #333 !important; }
.c-bold { font-weight: bold !important; }
.c-normal { font-weight: normal !important; }
.c-dark-gray {
    color: #555555 !important;
}
.c-gray-medium { color: #777 !important}
.sc-bg-white { background-color: #fff !important; }

a.link { font-weight: bold; color: #4dcc89; }
a.link.black { color: #333; }
a.link.black span { text-decoration: underline; }
a.link.gray { color: #aaa; }
a.link.gray span { text-decoration: underline; }
a.link-white { font-weight: bold; color: #fff; }
a.link-more {
    color: #4DCD8A;
    position: relative;
    font-weight: bold;
}
a.link-more:after {
    content: "\e907";
    font-family: 'iconfont';
    font-size: 11px;
    margin-left: 2px;
}
a.link-more span { text-decoration: underline; }
a.link-more.gray {
    color: #999;
    font-weight: normal;
}
a.link-more.black {
    color: #171819;
}
a.link.hv-icon .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-left: 5px;
}
a.link.d-inline-block {
    display: inline-block;
}
.mt-small { margin-top: 1em; }
.action { margin-top: 30px; }
.action.less-t { margin-top: 20px; }
.vertical-center {
    display: table;
    width:100%;
    height: 100%;
}
.content-vertical-top {
    display: table-cell;
    vertical-align: top;
}
.content-vertical-center {
    display: table-cell;
    vertical-align: middle;
}
.content-vertical-bottom {
    display: table-cell;
    vertical-align: bottom;
}
.v-baseline {
    vertical-align: baseline;
}
.heading-mt-3 {
    margin-top: 1.3rem;
}

.d-block-small {
    display: none;
}

.overflow-visible {
    overflow: visible !important;
}
/* ========== Columns - START ========== */
.column-container {   
    width: 100%;
    max-width: 100%;
    min-height: 100vh;
    margin-right: auto;
    margin-left: auto;
    padding-left: 0;
    padding-right: 0;
    display: table;
    background-color: #F4F3F9;
    position: relative;
}
.column-container {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}
.column-container:before {
    content: "";
    width: 255px;
    height: 100%;
    background: rgb(70,89,104);
    background: linear-gradient(180deg, rgba(70,89,104,1) 0%, rgba(35,45,52,1) 100%);
    position: absolute;
    top: 0;
    left: 0;
}
.column-menu {
    width: 255px;
    /* float: left; */
    padding-top: 30px;
}
.column-menu .logo {
    width: 148px;
    margin: auto;
    margin-bottom: 35px;
}
.column-container.no-nav:before {
    height: 65px;
}

.column-container.no-nav .column-menu {
    padding-top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 65px;
}

.column-container.no-nav .column-menu .logo {
    margin-bottom: 0;
    margin-top: 0;
}
.column-menu .approver-wrapper { margin-bottom: 20px; }
.column-menu .approver-wrapper .image { 
    position: relative;
    width: 80px;
    margin: auto;
    margin-bottom: 10px;
}
.column-menu .approver-wrapper .image:after {
    content: "";
    width: 80px;
    height: 80px;
    background-image: linear-gradient(to right, #465968 0%, #232D34 100%);
    position: absolute;
    top: -5px;
    left: 0px;
    border-radius: 50%;
}
.column-menu .approver-wrapper .image img { 
    border-radius: 50%;
    position: relative;
    z-index: 2;
}
.column-menu .approver-wrapper .name {
    color: #fff;
    font-weight: bold;
    /* font-size: 18px; */
    /* word-break: break-word; */
    padding-left: 10px;
    padding-right: 10px;
    /* Update */
    font-size: 16px;
    max-width: 250px;
    margin: auto;
    /* white-space: nowrap; */
    overflow: hidden;
    text-overflow: ellipsis; 
}
.column-menu .approver-wrapper .approver { 
    color: #fff;
    font-size: 14px;
    margin-top: 5px;
    /* Update */
    font-weight: 400;
}
.column-menu .approver-wrapper .approver .ic {
    display: inline-block;
    margin-top: -5px;
    margin-right: 3px;
}
.column-main {
    width: calc(100% - 255px);
    /* float: left; */
    padding-top: 65px;
}
.column-main .header {
    width: calc(100% - 255px);
    height: 65px;
    line-height: 65px;
    background-color: #fff;
    position: fixed;
    top: 0;
    padding: 0 30px;
    z-index: 1000;
}
.column-main.has-sub {
    padding-top: calc(65px + 35px);
}
.column-main .header-sub {
    width: calc(100% - 255px);
    height: 35px;
    border-top: 1px solid #E5E5E5;
    background-color: #fff;
    position: fixed;
    top: 65px;
    padding: 0 30px;
    z-index: 1000;
}
@media (max-width: 991px) {
    .column-main .header-sub {
        width: 100%;
    }
}
.column-main .header-sub .menu-right {
    float: right;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    padding: 5px 0;
}
.column-main .header-sub .rounded-lang a {
    border: 1px solid black;
    padding: 1px 8px;
    border-radius: 50px;
    font-size: 12px;
    line-height: 1.1;
    margin-right: 10px
}
.column-main .header-sub .menu-icon {
    max-width: 20px;
    max-height: 20px;
    cursor: pointer;
}
.column-main .header .main-menu { float: left; }
.column-main .header .main-menu li {
    display: inline-block; 
    font-weight: bold;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    margin-right: 30px;
    position: relative;
}
.column-main .header .main-menu li:after {
    content: "";
    width: 100%;
    height: 4px;
    position: absolute;
    left: 0;
    bottom: 0;
    background-image: none;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.column-main .header .main-menu li.active,
.column-main .header .main-menu li.active { color: #4dcd8a; }
.column-main .header .main-menu li.active:after,
.column-main .header .main-menu li:hover:after {
    background-image: linear-gradient(to right, #00a850 0%, #61d699 100%);
}
.column-main .header .main-menu li:last-child { margin-right: 0; }
.column-main .column-main-content { padding: 20px 30px 10px 30px; }
.column-main-content.fix-col .row {
    margin-left: -5px;
    margin-right: -5px;
}
.column-main-content.fix-col .row .col-md-6,
.column-main-content.fix-col .row .col-md-12 {
    padding: 0 5px;
}
.column-main .header .menu-right {
    float: right;
}

.column-main .header .menu-right .flex {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}
.column-main .header .menu-right .user-detail {
    line-height: 15px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}
.column-main .header .menu-right .user-detail .sub {
    font-size: 10px;
    font-weight: 700;
    color: #999;
}
.column-main .header .menu-right .user-detail .username {
    font-size: 12px;
    font-weight: 700;
    color: #333;
}

.no-logo .column-main .header,
.no-logo .column-main {
    width: 100%;;
}
.header .menu-right .menu-list { position: relative; padding-left: 20px; float: left; margin-left: 20px; }
.header .menu-right .menu-list:before {
    content: "";
    width: 1px;
    height: 25px;
    background-color: #EBEBEB;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
}
.header .menu-right .menu-list li {
    display: inline-block;
    margin-right: 20px;
}
.header .menu-right .menu-list li:last-child { margin-right: 0; }
.header .menu-right .menu-list li .ic { color: #3A3A3A; font-size: 20px; }
.header .menu-right .menu-list li .ic.hv-notification {
    position: relative;
}
.header .menu-right .menu-list li .ic.hv-notification:after {
    content: "";
    width: 10px;
    height: 10px;
    background-color: #E24545;
    border-radius: 50%;
    position: absolute;
    top: -4px;
    right: -2px;
}
.header .menu-right .user .detail .name.no-click:after {
    display: none;
}
.header .menu-right .user {
    height: 65px;
    float: left;
    line-height: 1;
    display: table;
    position: relative;
}
.header .menu-right .user .image {
    display: table-cell;
    vertical-align: middle;
    position: relative;
    margin-right: 20px;
}
.header .menu-right .user .image:after {
    content: "";
    width: 46px;
    height: 46px;
    background-image: linear-gradient(to right, #00A850 0%, #61D699 100%);
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
}
.header .menu-right .user .image img {
    width: 38px;
    border-radius: 50%;
    position: relative;
    z-index: 2;
    object-fit: cover;
    height: 38px;
}
.header .menu-right .user .detail {
    max-width: 400px;
    display: table-cell;
    vertical-align: middle;
    padding-left: 20px;
    word-break: break-word;
}
.header .menu-right .user .detail .name {
    font-weight: bold;
    position: relative;
    cursor: pointer;
    font-size: 12px;
    max-height: calc(25px + 12px);
    overflow: hidden;
    padding-right: 10px;
}
.header .menu-right .user .detail .name:after {
    content: "\e906";
    font-family: 'iconfont';
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 0;
    font-size: 10px;
}
.header .menu-right .user .detail .date, .refresh-date {
    font-size: 10px;
    font-weight: bold;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    color: #999;
    margin-top: 5px;
}
.header .menu-right .user .detail .date .ic, .refresh-date .ic {
    margin-right: 5px;
}
.refresh-date {
    font-weight: normal;
    margin-bottom: 5px;
    font-family: Arial;
}
/* Fixed header image เบี้ยว */
.header .menu-right > .user > .image {
    display: block;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 0;
}

.header .menu-right > .user > .image:after {
    top: 0;
    left: 0;
}
.header .menu-right > .user {
    display: flex;
    align-items: center;
    padding-left: 20px;
    justify-content: flex-start;
}
/* End Fixed header image เบี้ยว */
.business-type .header .menu-right .user .image:after {
    background-image: linear-gradient(to right, #465968 0%, #232D34 100%);
}
.business-type .header .menu-righ .user .detail .date { 
    font-size: 9px;
    margin-top: 4px;
}
.business-type .header .menu-right .user .detail .approver {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
}
.business-type .column-container:before {
    background: rgb(0,160,64);
    background: linear-gradient(126deg, rgba(0,160,64,1) 0%, rgba(29,165,94,1) 100%);
}
.business-type .column-container .sidebar .group-menu { color: #92DCB5; }
.business-type .column-container .sidebar .sidebar-menu li.active, 
.business-type .column-container .sidebar .sidebar-menu li:hover { 
    background-color: #0B6C36 !important; 
    color: #4DCD8A !important;
}
.business-type .column-container .sidebar .sidebar-menu li.active:before, 
.business-type .column-container .sidebar .sidebar-menu li:hover:before {
    background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
}

/* .business-type .column-container .sidebar .sidebar-menu.setting li {
    color: #92DCB5;
} */
.business-type .column-container .sidebar .sidebar-menu.setting li.active, 
.business-type .column-container .sidebar .sidebar-menu.setting li:hover {
    color: #fff;
    background-color: transparent;
}
.business-type .column-container .sidebar .sidebar-menu.setting li.active:before, 
.business-type .column-container .sidebar .sidebar-menu.setting li:hover:before {
    background-image: none;
}

.user-expand {
    width: 225px;
    position: absolute;
    background-color: #fff;
    top: 65px;
    left: -15px;
    z-index: 99;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    display: none;
}
.user-expand-setting {
    width: 225px;
    position: absolute;
    background-color: #fff;
    top: 65px;
    left: 35px;
    z-index: 99;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    display: none;
}
.user-expand-list {
    border-bottom: 1px solid #eee;
    padding: 15px 20px;
}
.user-expand-list a.link.black {
    line-height: 1.8;
}
.user-expand-list .date {
    font-size: 10px;
    color: #ccc;
    font-weight: bold;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    line-height: 1.8;
}
.user-expand-list .user-expand-list-profile {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 10px;
}
.user-expand-list .user-expand-list-profile .image:after {
    width: 44px;
    height: 44px;
    background-image: linear-gradient(to right, #465968 0%, #232D34 100%) !important;
    top: 0;
    left: 0;
}

.user-expand-list .user-expand-list-profile {
    
}
.header .user-expand-list > .user-expand-list-profile > .image {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 0;
}
.user-expand-list .user-expand-list-profile .detail {
    display: table-cell !important;
    vertical-align: middle !important;
    font-size: 12px;
}
.user-expand-list .user-expand-list-profile .detail .approver {
    font-size-adjust: 10px;
    margin-top: 4px;
    color: #949DA5;
}
.business-type .user-expand .user-expand-list .user-expand-list-profile .image:after {
    background-image: linear-gradient(to right, #00A850 0%, #61D699 100%) !important;
}
/*========== Columns - END ==========*/

/*========== Panel ==========*/
.hamburger {
    position: absolute;
    width: 30px;
    height: 15px;
    top: 25px;
    left: 20px;
}
.hamburger .bars,
.hamburger .bars:after,
.hamburger .bars:before {
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #fff;
    -webkit-transition-duration: 400ms;
    -o-transition-duration: 400ms;
    transition-duration: 400ms;
    -webkit-transition-timing-function: cubic-bezier(.55, .055, .675, .19);
    -o-transition-timing-function: cubic-bezier(.55, .055, .675, .19);
    transition-timing-function: cubic-bezier(.55, .055, .675, .19);
}
.hamburger .bars:after,
.hamburger .bars:before {
    display: block;
    content: ""
}
.hamburger .bars {
    font-size: 0;
    line-height: 0;
    top: 50%;
    display: block;
    margin-top: -1px;
    -webkit-transition-property: background-color, -webkit-transform;
    transition-property: background-color, -webkit-transform;
    -o-transition-property: background-color, transform;
    transition-property: background-color, transform;
    transition-property: background-color, transform, -webkit-transform;
}
.hamburger .bars:before {
    top: -6px;
    right: 0;
    -webkit-transition-property: background-color, top;
    -o-transition-property: background-color, top;
    transition-property: background-color, top;
    -webkit-transition-delay: 0s, .10s;
    -o-transition-delay: 0s, .10s;
    transition-delay: 0s, .10s;
}
.hamburger .bars:after {
    bottom: -6px;
    -webkit-transition-property: background-color, bottom, -webkit-transform;
    transition-property: background-color, bottom, -webkit-transform;
    -o-transition-property: background-color, bottom, transform;
    transition-property: background-color, bottom, transform;
    transition-property: background-color, bottom, transform, -webkit-transform;
    -webkit-transition-delay:  0s, .10s, 0s;
    -o-transition-delay:  0s, .10s, 0s;
    transition-delay:  0s, .10s, 0s;
}
.hamburger.active .bars,
.hamburger.active .bars:before,
.hamburger.active .bars:after {
    background-color: #fff;
}
.hamburger.active .bars {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition-property: background-color, -webkit-transform;
    transition-property: background-color, -webkit-transform;
    -o-transition-property: background-color, transform;
    transition-property: background-color, transform;
    transition-property: background-color, transform, -webkit-transform;
    -webkit-transition-delay: 0s, .10s;
    -o-transition-delay: 0s, .10s;
    transition-delay: 0s, .10s;
}
.hamburger.active .bars:before {
    top: 0;
    opacity: 0;
}
.hamburger.active .bars:after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition-property: background-color, bottom, -webkit-transform;
    transition-property: background-color, bottom, -webkit-transform;
    -o-transition-property: background-color, bottom, transform;
    transition-property: background-color, bottom, transform;
    transition-property: background-color, bottom, transform, -webkit-transform;
    -webkit-transition-delay: 0s, 0s, .10s;
    -o-transition-delay: 0s, 0s, .10s;
    transition-delay: 0s, 0s, .10s;
}

.no-touchevents .hamburger:hover .bars,
.no-touchevents .hamburger:hover .bars:after,
.no-touchevents .hamburger:hover .bars:before {
    background-color: #fff;
}
.panel {
    display: block;
    /* background-color: rgba(0, 0, 0, 0.2); */
    color: #fff;
    line-height: 1;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    width: 0;
    position: fixed;
    top: 0; left: 0;
    z-index: 2000;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: 300ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
    -o-transition: 300ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
    transition: 300ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
    will-change: opacity;
    overflow: hidden;
    pointer-events: none;
}
.panel.active {
    width: 90vw;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    -webkit-transition-delay: .1s;
    -o-transition-delay: .1s;
    transition-delay: .1s;
}
.panel-wrap {
    height: 100%;
    padding-left: 0;
    padding-right: 0;
    margin-right: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    opacity: 0;
    -webkit-transition: opacity 400ms ease-in-out .2s;
    -o-transition: opacity 400ms ease-in-out .2s;
    transition: opacity 400ms ease-in-out .2s;
}
.panel.active .panel-wrap {
    opacity: 1;
}
.panel-header {
    position: fixed;
    top: 0; left: 0;
    z-index: 1;
    width: 100%;
    padding: 0;
    background-color: #465968;
}
.business-type .panel-header { background-color: #02A040; }
.business-type .panel-body { background-color: #1DA55E; }
.business-type .panel-body .menu-group .item.current a { color: #fff; }
.panel-header .inner {
    position: relative;
    height: 65px;
}
.panel-header .panel-close {
    font-size: 22px;
    line-height: 0;
    position: absolute;
    left: 22px; 
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.panel-header .logo { position: absolute; top: 18px; left: 70px; }
.panel-header .logo img { height: 30px; }
.panel-body {
    width: 100%;
    position: relative;
    min-height: 100vh;
    padding-top: 65px;
    background-color: #394855;
}
.panel-body:last-child {
    padding-bottom: 0;
}
.panel-body .brand {
    margin-bottom: 50px;
}
.panel-body .brand .logo img {
    width: 129px;
}
.panel-body .menu-group .item {
    padding: 18px 0 18px 20px;
    position: relative;
}
.panel-body .menu-group .item:before {
    content: "";
    width: 5px;
    height: 100%;
    background-image: none;
    position: absolute;
    top: 0;
    left: 0;
     -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.panel-body .menu-group .item.current:before {
    background-image: linear-gradient(180deg, #00a850 0%, #61d699 100%);
} 
.business-type .panel-body .menu-group .item.current:before {
    background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
}
.panel-body .menu-group .item a {
    display: inline-block;
    vertical-align: top;
    font-size: 20px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.panel-body .menu-group .item.current a { color: #4DCD8A; position: relative; }
.panel-body .menu-group .item.current a:after {
    content: "\e906";
    font-family: 'iconfont';
    font-size: 14px;
    position: absolute;
    right: -30px;
    top: 5px;
}
.panel-body .menu-group .item.current.active a:after {
    content: "\e91a"; 
}
.panel-body .menu-group .sidebar-menu li a i.ic.ic-chevron-right {
    font-size: 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}
.panel-body .menu-group .sidebar-menu li a i.ic.ic-chevron-down {
    font-size: 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}
.panel-body .menu-group .item-hide { display: none; }
/*.panel-body .menu-group .sidebar { display: none; }*/
.panel-body .menu-group .sidebar .sidebar-menu.setting { margin-top: 0; }
.panel-body .menu-group .sidebar .sidebar-menu { border-top: 1px solid #949DA5; padding: 15px 0; }
.business-type .panel-body .menu-group .sidebar .sidebar-menu { border-top: 1px solid #fff; }
.panel-body .menu-group .sidebar .sidebar-menu li { font-size: 15px; padding-left: 20px; }
.panel-body .menu-group .sidebar .sidebar-menu li .ic { font-size: 25px; vertical-align: sub; }
.panel-body .menu-group .sidebar .group-menu { 
    margin-top: 12px;
    margin-bottom: 10px;
}
.panel-footer {
    padding: 100px 0 50px;
}
.panel-footer .callcenter:not(:last-child) {
    margin-bottom: 20px;
}
.panel-footer .links li:not(:last-child) {
    margin-bottom: 12px;
}
.panel-footer .links a {
    opacity: 0.3;
}
.panel-footer .change-lang .input .ic {
    font-size: 18px;
}
.panel-footer .change-lang:not(:last-child) {
    margin-bottom: 30px;
}
.no-touchevents .panel a:hover,
.panel .menu-group .item a.active {
    color: #fff;
    opacity: 1;
}
.panel-header,
.panel-body,
.panel-footer {
    opacity: 0;
    -webkit-transform: translateX(-60%);
    -ms-transform: translateX(-60%);
    transform: translateX(-60%);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    -o-transition-property: opacity, transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition-duration: 300ms;
    -o-transition-duration: 300ms;
    transition-duration: 300ms;
    -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -o-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -webkit-transition-delay: .05s;
    -o-transition-delay: .05s;
    transition-delay: .05s;
}
.panel.active .panel-header,
.panel.active .panel-body,
.panel.active .panel-footer {
    opacity: 1;
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition-delay: .4s;
    -o-transition-delay: .4s;
    transition-delay: .4s;
    
}
.panel-ctrl {
    cursor: pointer;
}
.panel-enabled {
    overflow: hidden;
}
.panel-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.3);
    z-index: 10;
}
.panel-body .menu-group .item .link-back {
    margin-left: 0;
    margin-bottom: 0;
}
/*========== Panel - END ==========*/

/*========== Sidebar - START ==========*/
.sidebar .sidebar-menu li { 
    font-size: 14px;
    color: #fff;
    font-weight: bold;
    padding: 13px 0;
    cursor: pointer;
    background-color: transparent;
    transition: all 0.5s ease-out;
    position: relative;
    padding-left: 15px;
}
.sidebar .sidebar-menu li:before {
    content: "";
    width: 4px;
    height: 100%;
    background-image: none;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.sidebar .sidebar-menu li.active,
.sidebar .sidebar-menu li:hover {
    background-color: #394855;
}
.business-type .sidebar .sidebar-menu li.active,
.business-type .sidebar .sidebar-menu li:hover {
    background-color: #0B6C36;
}
.sidebar .sidebar-menu li:hover { position: relative; }
.sidebar .sidebar-menu li.active:before,
.sidebar .sidebar-menu li:hover:before {
    background-image: linear-gradient(180deg, #00a850 0%, #61d699 100%);
}
.sidebar .sidebar-menu li .ic {
    font-size: 30px;
    vertical-align: bottom;
    margin-right: 10px;
    line-height: 0.8;
}
.sidebar .sidebar-menu li a {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    position:relative;
}

.main .sidebar .sidebar-menu li a .ic-chevron-right {
    font-size: 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}
.main .sidebar .sidebar-menu li a .ic-chevron-down {
    font-size: 10px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
}
.sidebar .group-menu {
    font-size: 14px;
    color: #949da5;
    padding-left: 32px;
    margin-top: 30px;
    margin-bottom: 5px;
}
.business-type .sidebar .group-menu {
    color: #fff;
}
.sidebar .sidebar-menu.setting { margin-top: 15px; }
/* .sidebar .sidebar-menu.setting li {
    color: #8a949c;
} */
.business-type .sidebar .sidebar-menu.setting li {
    color: #fff;
}
.sidebar .sidebar-menu.setting li.active a {
    color: #fff;
}
/*
.sidebar .sidebar-menu.setting li.active,
.sidebar .sidebar-menu.setting li:hover {
    color: #fff;
    background-color: transparent;
}
.sidebar .sidebar-menu.setting li.active:before,
.sidebar .sidebar-menu.setting li:hover:before {
    background-image: none;
}
*/
.dropdown-menu ul.submenu {
    padding-left: 28px;
    padding-top: 20px;
}
/*========== Sidebar - END ==========*/

.btn {
    display: inline-block;
    font-size: 14px;
    padding: 0 20px;
    background-color: #00a950;
    color: #fff !important;
    margin-bottom: 0;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
    text-align: center;
    text-decoration: none !important;
    white-space: nowrap;
    background-image: none;
    border: 1px solid transparent;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    -webkit-transition: ease-in-out .2s;
    -o-transition: ease-in-out .2s;
    transition: ease-in-out .2s;
}
.btn.outline-green {
    border: 2px solid #4DCD8A;
    color: #4DCD8A !important;
    background-color: transparent;
    line-height: 36px;
}
.btn.btn-gradient {
    background: rgb(2,170,82);
    background: linear-gradient(126deg, rgba(2,170,82,1) 0%, rgba(97,214,153,1) 100%);
    border: 0;
}
.btn.btn-blue { background-color: #445765; }
.btn.btn-dark-blue { background-color: #394855; }
.btn.btn-red { background-color: #EB0000; }
.btn.btn-gray { background-color: #ccc; pointer-events: none; }
.btn.btn-clear { background-color: #ccc; }
.btn.fixed-width { width: 160px; }
.btn.fixed-width-height { width: 200px; height: 50px; line-height: 50px; border-radius: 30px; }
.btn.btn-small {
    height: 32px;
    line-height: 32px;
    font-size: 13px;
}
.btn.hv-icon .ic {
    font-size: 12px;
    vertical-align: baseline;
    margin-right: 6px;
}
.btn-close {
    width: 24px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
    text-align: center;
    background-color: #fff;
    color: #EB0000;
    border-radius: 50%;
    text-decoration: none !important;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
}
.btn-close:hover,
.btn-close:focus { 
    color: #fff; 
    text-decoration: none !important; 
    background-color: #EB0000; 
}
.btn-close .ic { margin-right: 0 !important; }
.btn-edit {
    width: 24px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
    text-align: center;
    background-color: #fff;
    color: #394855;
    border-radius: 50%;
    text-decoration: none !important;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
}
.btn-edit .ic {
    font-size: 14px !important;
}
.btn-edit .ic {
    margin-right: 0 !important; 
    margin-top: 5px; 
    display: inline-block;
}
.btn-edit:hover,
.btn-edit:focus { 
    color: #fff; 
    text-decoration: none !important; 
    background-color: #394855;
}
.btn-min-width {
    min-width: 150px;
}
.btn-edit.btn-disabled {
    pointer-events: none;
    color: #999;
    background: #eee;
    box-shadow: none;
}
/*========== Form - START ==========*/
button::-moz-focus-inner, 
[type="button"]::-moz-focus-inner, 
[type="reset"]::-moz-focus-inner, 
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}
button:-moz-focusring, 
[type="button"]:-moz-focusring, 
[type="reset"]:-moz-focusring, 
[type="submit"]:-moz-focusring {
    outline: 0;
}
input[disabled],
textarea[disabled], 
select[disabled] {
    background-color: #f2f2f2;
    color: #999 !important;
    opacity: 1 !important;
}

input,
textarea,
select {
    width: 100%;
    height: 40px;
    color: #b5b5b5;
    line-height: normal;
    padding: 10px 10px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
}
/*
input:focus,
textarea:focus,
select:focus {
    background-color: #f8f8f8;
    border-color: #00A850;
}
*/
input::-webkit-contacts-auto-fill-button {
    visibility: hidden;
    display: none !important;
    pointer-events: none;
}
input:-webkit-autofill, 
textarea:-webkit-autofill, 
select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;
}

input[type=number] {
    -moz-appearance:textfield;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none; 
    
    margin: 0; 
}

textarea {
    display: block;
    overflow: auto;
    width: 100% !important;
    min-width: 100%;
    max-width: 100%;
    min-height: 60px;
    text-indent: -1px;
    resize: none;
}

/* fix cursor not show in firefox */
@supports (-moz-appearance:none) {
    textarea {
        text-indent: 0;
    }
}

/* Select - START */
.select {
    position: relative;
    color: #b5b5b5;
}
.select:after {
    font-family: 'iconfont';
    content: "\e918";
    font-size: 12px;
    font-weight: normal;
    color: #00A850;
    display: inline-block;
    width: 45px; 
    height: 45px;
    line-height: 45px;
    text-align: center;
    position: absolute;
    right: 0;
    top: 0; bottom: 0;
    z-index: 1;
	pointer-events: none;
    overflow: hidden;
}
.select.select-more-h:after{
    content: "\e906";
    height: 50px;
    line-height: 50px;
}
.select.select-two:after{
    content: "\e906";
}
.select select {
    line-height: normal;
    padding: 0 45px 0 15px;
    -o-text-overflow: "";
    text-overflow: "";
    cursor: pointer;
}

.select2-parent:after {
    display: none;
}

.select2-container {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
}
.select2-container .select2-selection--single {
    display: block;
    height: 40px;
    outline: 0;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.select-more-h .select2-container .select2-selection--single { height: 50px; }
.select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
    color: #000;
    padding-left: 10px;
    padding-right: 45px;
    overflow: hidden;
    /* -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;  */
}
.select2-container .select2-selection--single .select2-selection__rendered[title] {
    background-color: #fff;
}
.select-more-h .select2-container .select2-selection--single .select2-selection__rendered[title] {
    background-color: transparent;
}
.select2-container .select2-selection--single .select2-selection__clear {
    position: relative; 
}

.select2-container .select2-search--inline {
    float: left; 
}
.select2-container .select2-search--inline .select2-search__field {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    padding: 0; 
    margin-top: 5px;
    font-size: 100%;
}
.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
    -webkit-appearance: none; 
}

.select2-dropdown {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    display: block;
    position: absolute;
    left: -100000px;
/*    width: 100% !important;*/
    z-index: 1051; 
    -webkit-transition: border-color 250ms ease-in-out;
    -o-transition: border-color 250ms ease-in-out;
    transition: border-color 250ms ease-in-out;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-animation: fadeIn 400ms;
    animation: fadeIn 400ms;
}

.select2-container .select2-results {
    display: block; 
}
.select2-container .select2-results__options {
    list-style: none;
    margin: 0;
    padding: 0; 
}
.select2-container .select2-results__option {
    margin: 0 !important;
    padding: 10px 15px;
    color: #000;
    border-top: 1px solid #ccc;
    word-wrap: break-word;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; 
}
.select2-container .select2-results__option[aria-selected] {
    cursor: pointer; 
}
.select2-container .select2-results__option[aria-selected=true] {
    color: #00A850; 
}
.select2-container .select2-results__message {
    color: #ccc;
}

.select2-container--open .select2-dropdown {
    left: 0; 
    overflow: hidden;
}
.select2-container--open .select2-dropdown--above .select2-results__option {
    border-top: 0;
    border-bottom: 1px solid #eee;
}

.select2-search--dropdown {
    display: block;
    position: relative;
    z-index: 1010;
    padding: 5px 9px;
    white-space: nowrap;
    background: #eee;
    border-top: 1px solid #eee;
}
.select2-search--dropdown .select2-search__field {
    padding: 4px;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; 
}
.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
    -webkit-appearance: none; 
}
.select2-search--dropdown.select2-search--hide {
    display: none; 
}

.select2-container--default .select2-selection--single {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-transition: border-color 400ms ease-in-out;
    -o-transition: border-color 400ms ease-in-out;
    transition: border-color 400ms ease-in-out;
    overflow: hidden;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 40px; 
}
.select-more-h .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 50px; 
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #b5b5b5;
    display: inline-block;
    vertical-align: top;
    line-height: inherit;
}

.select2-container--default .select2-selection--single .select2-selection__arrow,
.select2-container--default .select2-selection--single .select2-selection__clear {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 1;
    display: block;
    width: 45px;
    height: 45px;
    line-height: 43px;
    font-size: 0;
    text-align: center;
    cursor: pointer;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    display: block;
    width: 100%;
    height: 100%;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b:before,
.select2-container--default .select2-selection--single .select2-selection__clear:before {
    font-family: 'iconfont';
    font-size: 10px;
    font-weight: normal;
    color: #00A850;
    line-height: 45px;
    display: inline-block;
    vertical-align: top;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b:before {
    content: "\e918";
}
.select-more-h .select2-container--default .select2-selection--single .select2-selection__arrow b:before {
    content: "\e906";
    font-size: 15px;
    line-height: 50px;
}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear,
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
    display: none; 
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    margin: 1px 0;
    padding: 5px 10px;
    width: 100%;
    height: auto;
    outline: 0;
    border: 1px solid #ddd;
    color: #00A850;
}
.select2-container--default .select2-search--inline .select2-search__field {
    background: transparent;
    border: none;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: textfield; 
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 25vh;
    overflow-y: auto; 
    -webkit-overflow-scrolling: touch;
}
.select2-container--default .select2-results__option[role=group] {
    padding: 0; 
}
.select2-container--default .select2-results__option[aria-disabled=true] {
    color: #b5b5b5; 
}
.select2-container--default .select2-results__option--highlighted[aria-selected=true] {
    color: #00A850; 
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #00A850;
    color: #fff;
}


.select2-container--default .select2-results__group {
    display: block;
    cursor: default;
    font-size: 20px;
    text-transform: uppercase;
    color: #ccc;
    border-bottom: 1px solid #fff;
    margin-bottom: -1px;
    position: relative;
    padding: 12px 10px 6px;
}

.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,
.select2-container--open .select2-dropdown--below {
    border-top: 0;
    -moz-border-top-left-radius: 0;
    border-top-left-radius: 0;
    -moz-border-top-right-radius: 0;
    border-top-right-radius: 0;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--open .select2-dropdown--above {
    border-bottom: 0;
    -moz-border-bottom-left-radius: 0;
    border-bottom-left-radius: 0;
    -moz-border-bottom-right-radius: 0;
    border-bottom-right-radius: 0;
}
.select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-selection--single,
.select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-dropdown,
.select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single {
    background-color: #f8f8f8;
    border-color: #ccc;
}
.select-more-h .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single {
    background-color: transparent;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__placeholder {
    color: #b5b5b5;
}

.select2-close-mask {
    border: 0;
    margin: 0;
    padding: 0;
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    opacity: 0;
    z-index: 99;
    background-color: #fff;
    filter: alpha(opacity=0); 
}

.select2-hidden-accessible {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important; 
}

.select2-rendered__match {
    text-decoration: underline;
}
.select-arrow .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px; line-height: 40px; 
}
.select-arrow .select2-container--default .select2-selection--single .select2-selection__arrow b:before { 
    content: "\e906";
    font-size: 14px;
    color: #4DCD8A;
    line-height: 40px; 
}
/* Select - END */

/* Checkbox & Radio - START */
input[type="checkbox"],
input[type="radio"] {
    height: auto;
    padding: 0;
    border: 0;
    background: none;
}
.choice {
    position: relative;
    font-size: 14px;
    line-height: 1.6;
}
.choice.inline {
    display: inline-block;
    vertical-align: top;
}
.choice.inline:not(:last-child) {
    margin-right: 20px;
}
.choice > label {
    position: relative;
    display: inline-block;
}

.choice .choice-name {
    display: inline-block;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.choice input.choice-input {
    position: absolute; 
    z-index: -1000; 
    overflow: hidden; 
    clip: rect(0 0 0 0); 
    height: 1px; width: 1px; 
    margin: -1px; padding: 0; 
    border: 0;
}
.choice input.choice-input + .choice-name {
    display: inline-block;
    padding-left: 25px;
    min-width: 17px;
    min-height: 17px;
    height: auto;
    vertical-align: top;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: left 2px;
    background-size: 17px 17px;
    font-weight: bold;
}
.list .choice .choice-name {
    display: inline-block;
    padding-left: 25px;
    min-width: 17px;
    min-height: 17px;
    height: auto;
    vertical-align: top;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: left 2px;
    background-size: 17px 17px;
    font-weight: bold;
}
.choice input.choice-input + .choice-name.no-bold { font-weight: normal; }
.choice input.choice-input + .choice-name small {
    font-size: 12px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    color: #999;
}
.choice input[type=radio].choice-input + .choice-name {
    background-image: url(../img/icon/radio.png);
}
.choice input[type=radio].choice-input:checked + .choice-name {
    background-image: url(../img/icon/radio-checked.png);
}
.choice input[type=checkbox].choice-input + .choice-name {
    background-image: url(../img/icon/checkbox.png);
}
.choice input[type=checkbox].choice-input:checked + .choice-name {
    background-image: url(../img/icon/checkbox-checked.png);
}
.choice input[type=checkbox].choice-input:checked:disabled + .choice-name {
    background-image: url(../img/icon/checkbox-checked-disabled.png);
}
.choice input[type=checkbox].choice-input:disabled + .choice-name {
    background-image: url(../img/icon/checkbox-disabled.png);
}
.list .choice.choice-disable .choice-input  + .choice-name {
    background: none !important;
}
.choice.input-only {
    line-height: 15px;
}
.choice.input-only input.choice-input + .choice-name {
    padding-left: 0;
    background-position: left top;
}

.choice input.choice-input[disabled],
.choice input.choice-input[disabled] + .choice-name {
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.choice > label:not(:last-child),
.choice-group:not(:last-child),
.choice:not(.inline):not(:last-child) {
    margin-bottom: 10px;
}
.choice-group {
    margin-top: 8px;
}
.label + .choice-group {
    margin-top: 20px;
}
.choice-other {
    display: table;
    width: 100%;
}
.choice-other > .choice-label,
.choice-other > .input {
    display: table-cell;
    width: 100%;
    vertical-align: middle;
}
.choice-other.inline-choice > .input {
    display: table-cell;
    width: auto;
    vertical-align: middle;
    margin-top: -10px;
    opacity: 1;
}
.choice-group .remark { padding-left: 25px; }
.choice-group .remark span { font-size: 12px; color: #999; font-weight: normal;}
.form .choice-other.inline-choice > .input.disabled {
    opacity: 0;
}
.choice.inline-choice:not(.inline):not(:last-child) {
    margin-top: 19px;
}
.choice-other > .choice-label:not(:last-child) {
    padding-right: 10px;
}
.choice-other > .choice-label {
    width: 1%;
    white-space: nowrap;
}
/* Checkbox & Radio - END */

/* Datepicker - START */
.datepicker,
.datepicker-2 {
    position: relative;
}
.datepicker:before,
.datepicker-2:before {
    font-family: 'iconfont';
    content: "\e925";
    font-size: 16px;
    font-weight: normal;
    color: #4DCD8A;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    position: absolute;
    top: 0; right: 0;
    pointer-events: none;
}
.ui-datepicker {
    width: 18.29em;
    max-width: calc(100vw - 40px);
    margin: 5px 0;
    padding: 0;
    background: transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    overflow: hidden;
    z-index: 9999 !important;
}
.ui-datepicker .ui-datepicker-header {
    background: #00A850;
    color: #fff;
    padding: 0 10px;
    height: 45px;
    line-height: 45px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.ui-datepicker .ui-datepicker-title {
    font-weight: bold;
    line-height: inherit;
}
.ui-datepicker table {
    margin: 0;
    padding: 5px 0;
    font-size: 12px;
    background: #fff;
}
.ui-datepicker th,
.ui-datepicker td {
    padding: 3px 5px;
}
.ui-datepicker thead tr:first-child th {
    padding-top: 8px;
}
.ui-datepicker tbody tr:last-child td {
    padding-bottom: 8px;
}
.ui-datepicker td span, 
.ui-datepicker td a {
    width: 22px;
    height: 22px;
    line-height: 22px;
    border-radius: 50%;
    margin: 0 auto;
    padding: 0;
    font-weight: 500;
    text-align: center;
}
.ui-datepicker th {
    color: #b5b5b5;
}
.ui-datepicker td .ui-state-highlight {
    color: #00A850;
    font-weight: bold;
}
.ui-datepicker td .ui-state-active {
    background-color: #00A850;
    color: #fff;
    font-weight: bold;
}

.ui-datepicker .ui-datepicker-prev, 
.ui-datepicker .ui-datepicker-next {
    width: 45px;
    height: 45px;
    line-height: inherit;
    text-align: center;
    top: 0;
}
.ui-datepicker .ui-datepicker-prev-hover {
    left: 0;
}
.ui-datepicker .ui-datepicker-next-hover {
    right: 0;
}
.ui-datepicker .ui-datepicker-prev span, 
.ui-datepicker .ui-datepicker-next span {
    position: static;
    margin: 0;
    width: 100%;
    height: 100%;
    text-indent: inherit;
    font-size: 0;
}
.ui-datepicker .ui-datepicker-prev span:before, 
.ui-datepicker .ui-datepicker-next span:before {
    font-family: 'iconfont';
    font-size: 12px;
    font-weight: normal;
    color: #fff;
}
.ui-datepicker .ui-datepicker-prev span:before {
    content: "\e938";
}
.ui-datepicker .ui-datepicker-next span:before {
    content: "\e907";
}
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year {
    width: 40%;
    height: 30px;
    line-height: 30px;
    padding: 0 18px;
    margin: 0 2px;
}
/* Datepicker - END */

.form .field { font-size: 14px; }
.form .field.third {
    width: 33.333333%;
}
.form .action { width: 100%; display: inline-block; margin-top: 30px; }
.form.form-login { margin-top: 10px !important; }
.form.form-login .action { margin-top: 10px; }
.form.form-login .action .link:not(.btn) { margin-top:10px; display: inline-block;}
.form.form-login .validated { margin-top: 15px;}
.form-login .fields {
    margin-bottom: 10px;
}
.form.form-login .validated {
    margin-top: 0;
}
.sc-form-full .form-login .fields.no-space .field:last-child {
    padding-bottom: 0;
}
.form .action.less-t {
    margin-top: 20px !important;
}
.form .alert {
    color: #ee2e24;
    clear: both;
    word-break: break-word
}
.form .alert-green {
    color: #4DCC89;
    clear: both;
}
.form .alert-rsso {
    color: #ee2e24;
    font-size: 12px;
    margin-top: -20px;
    padding: 0 5px;
}
.form .alert-rsso.green {
    color: #4DCC89;
}
.form .note {
    color: #aaa;
    font-size: 10px;
    margin-top: 8px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.form .input .alert {
    font-weight: normal;
    font-size: 12px;
}
.form .input .alert:not(:first-child) {
    margin-top: 5px;
}
.form .message .alert {
    font-weight: bold;
}
.form .message:not(:first-child) {
    margin-top: 35px;
}
.form .disabled {
    display: none;
}
.fieldset:not(:first-child) {
    padding-top: 20px;
    margin-top: 20px;
}
.fieldset .headline:not(:last-child) {
    margin-bottom: 20px;
}
.fields {
    margin-left: -12px;
    margin-right: -13px;
    /* margin-bottom: -25px; */
}
.form .field:last-child {
    padding-bottom: 2px;
}
.fields.no-p {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
}
.fields + .fields {
    margin-top: 25px;
}
.field {
    padding-left: 12px;
    padding-right: 13px;
    padding-bottom: 20px;
    clear: both;
}

.fields { 
    font-size: 0;
}
.fields:after {
    content: "";
    display: table;
    clear: both;
}
.field {
    width: 100%;
    display: inline-block;
    vertical-align: top;
}
.fields.f-last-custom .field {
    padding-bottom: 8px;
}
.fields .field.half-fix { 
    width: 50%;
}
.input {
    position: relative;
    text-align: left;
}

.input .label {
    padding: 0;
    border-radius: 0;
    position: relative;
    display: block;
    font-size: 14px;
    color: #333;
    margin-bottom: 4px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-weight: normal;
}
.input .label.more-mar {
    margin-bottom: -10px;
    margin-left: 6px;
}
.input  .label.label2 {
    width: 100%; 
    display: inline-block; 
    margin-bottom: -2px;
}
.input  .label.label2 .more-detail { font-size: 11px; color: #999; }
.input  .label.label2 .more-detail .ic { 
    margin-top: -3px;
    display: inline-block;
}
.input .label.anim {
    margin: 0;
    display: inline-block;
    vertical-align: top;
    color: #b5b5b5;
    line-height: 45px;
    position: absolute;
    top: 0; left: 15px;
    z-index: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none;
}
.input.filled .label.anim:not(.fixed) {
    opacity: 0;
    visibility: hidden;
}

.input .star {
    font-size: inherit;
    color: #ee2e24;
}
.input .remark {
    color: #ccc;
}

.input-action input {
    padding-right: 55px;
}
.input-action .action {
    margin: 0 !important;
    width: auto;
    height: 100%;
    line-height: 45px;
    position: absolute;
    top: 0; right: 0;
    color: #00A850;
}
.input-action .action .ic {
    width: 55px;
    font-size: 18px;
    color: #00A850;
    text-align: center;
    line-height: inherit;
    vertical-align: top;
}
.input-action.left .action {
    left: 0;
    right: auto;
}
.input-action.left input {
    padding-right: 20px;
    padding-left: 50px;
}

.input-icon .ic {
    width: 55px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    position: absolute;
    left: 0; top: 0;
    font-size: 18px;
    color: #00A850;
}
.input-icon input {
    padding-left: 55px;
}

.input-group {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.input-group .input {
    display: table-cell;
    vertical-align: top;
}
.input-group .input:not(:first-child) .select select,
.input-group .input:not(:first-child) .select2-container--default .select2-selection--single {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.input-group .input:not(:last-child) .select select,
.input-group .input:not(:last-child) .select2-container--default .select2-selection--single {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 1px solid #ccc;
}
.input-group .input .select select:focus,
.input-group .input .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-selection--single, 
.input-group .input .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single,
.input-group .input .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-dropdown {
    border-color: #00A850;
}

.input.filled input, 
.input.filled textarea, 
.input.filled select {
    color: #000;
    background-color: #f8f8f8;
}
.input.filled .select-more-h select {
    background-color: transparent;
}

.input.required input,
.input.required textarea,
.input.required select,
.input.required .select2-container--default .select2-selection--single,
.input.required .select2-container--default .select2-dropdown {
    color: #E53F3F;
    border: 1px solid #E53F3F;
}
.input.required-green input,
.input.required-green textarea,
.input.required-green select,
.input.required-green .select2-container--default .select2-selection--single,
.input.required-green .select2-container--default .select2-dropdown {
    color: #4DCC89;
    border: 1px solid #4DCC89;
}

input:disabled,
textarea:disabled,
select:disabled,
.select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #f8f8f8;
    cursor: default; 
    opacity: 0.4;
}
input[type="checkbox"]:disabled,
input[type="radio"]:disabled {
    background-color: transparent;
}

.input.pass .label.anim {
    color: #00A850;
}
.input.fail .label.anim {
    color: #ee2e24;
}

.input ::-ms-clear { display: none; width: 0; height: 0;}
.input ::-ms-reveal { display: none; width: 0; height: 0;}

.input :-ms-input-placeholder { color: #b5b5b5; font-weight: 500;}
.input ::-webkit-input-placeholder { color: #b5b5b5; line-height: normal; font-weight: 500;}
.input ::-moz-placeholder { color: #b5b5b5; opacity: 1; font-weight: 500;}
.input.filled :-ms-input-placeholder { color: #b5b5b5; font-weight: 500;}
.input.filled ::-webkit-input-placeholder { color: #b5b5b5; font-weight: 500;}
.input.filled ::-moz-placeholder { color: #b5b5b5; opacity: 1; font-weight: 500;}
.input-search {
    position: absolute;
    right: 10px;
    top: 30px;
    color: #22C77D;
}
.input-search .ic { font-size: 15px; color: #22C77D; }
.input-search .ic:hover,
.input-search .ic:focus { color: #22C77D; }
.input-search.no-label {
    top: 8px;
}
.input-hv-icon {
    position: absolute;
    right: 10px;
    top: 30px;
    color: #999;
}
.input-hv-icon .ic { font-size: 15px; color: #999; }
/* Upload File */
.custom-file-upload-hidden {
    display: none;
    visibility: hidden;
    position: absolute;
    left: -9999px;
}
.custom-file-upload {
    display: block;
    width: auto;
}
.file-upload-wrapper {
    position: relative; 
}
.file-upload-wrapper .file-upload-action {
    position: absolute;
    top: 7px; left: 10px;
    cursor: pointer; 
}
.file-upload-wrapper .file-upload-action .btn {
    width: 85px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    padding: 0;
    background-color: #405260;
}
.file-upload-wrapper .file-upload-input {
    padding-left: 100px;
    background-color: #f8f8f8;
}
.input.required:not(.filled) .file-upload-wrapper .file-upload-input:-ms-input-placeholder {
    color: #ee2e24;
}
.input.required:not(.filled) .file-upload-wrapper .file-upload-input::-webkit-input-placeholder {
    color: #ee2e24;
}
.input.required:not(.filled) .file-upload-wrapper .file-upload-input::-moz-placeholder {
    color: #ee2e24;
}
.remove-uploadfile {
    position: absolute;
    right: 15px;
    bottom: 11px;
}
.remove-uploadfile .ic {
    font-size: 10px;
}
.custom-file-upload.show-detail {
    width: 26%;
    float: left;
}
.custom-file-upload .file-upload-wrapper .file-upload-input {
    padding-left: 84px;
}
.detail-show {
    width:62%;
    float: right;
    margin-left: 10px;
    margin-top: 12px;
    position: relative;
    text-align: right;
    padding-right: 20px;
    overflow: hidden;
    color: #47CD8C;
}
.detail-show:after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 40px;
    content: '';
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
}
.detail-show .detail-show-close {
    position: absolute;
    right: 0;
    top: -2px;
    z-index: 4;
} 
.detail-show .detail-show-close .ic {
    font-size: 10px;
    color: #333;
}

/* Filter */
.input-filter {
    color: #000;
    min-width: 218px;
    display: inline-block;
    vertical-align: top;
}
.input-filter .label,
.input-filter .select,
.input-filter .select:after,
.input-filter.filled select,
.input-filter .select2-container--default .select2-selection--single .select2-selection__arrow b:before,
.input-filter .select2-container .select2-selection--single .select2-selection__rendered,
.input-filter .select2-container .select2-results__option {
    color: inherit;
}
.input-filter .label {
    font-size: 14px;
}
.input-filter .select:after,
.input-filter .select2-container--default .select2-selection--single .select2-selection__arrow {
    text-align: right;
}
.input-filter select,
.input-filter .select2-container--default .select2-selection--single {
    background-color: transparent;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid;
}
.input-filter select,
.input-filter .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0;
}
.input-filter.filled select,
.input-filter .select2-container .select2-selection--single .select2-selection__rendered[title],
.input-filter .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-selection--single, 
.input-filter .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single {
    background-color: transparent;
    border-color: inherit;
}
.input-filter .select2-dropdown {
    border-radius: 0;
    width: calc(100% + 30px) !important;
    margin: 0 -15px;
}

.input-filter .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-dropdown {
    background-color: #fff;
    border-color: #000;
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.input-filter .select2-container .select2-results__option {
    border-color: #000;
}
.input-filter .select2-container .select2-results__option[aria-selected=true] {
    color: #00A850;
}
.input-filter .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #00A850;
    color: #fff;
}

/* Clear */
.input-clear .label,
.input-clear .select,
.input-clear .select:after,
.input-clear.filled select,
.input-clear .select2-container--default .select2-selection--single .select2-selection__arrow b:before,
.input-clear .select2-container .select2-selection--single .select2-selection__rendered,
.input-clear .select2-container .select2-results__option {
    color: #fff;
}
.input-clear .select:after,
.input-clear .select2-container--default .select2-selection--single .select2-selection__arrow {
    text-align: right;
}
.input-clear select,
.input-clear .select2-container--default .select2-selection--single {
    background-color: transparent;
    border: 0;
    border-radius: 0;
}
.input-clear select,
.input-clear .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0;
    padding-right: 20px;
    line-height: 45px;
}
.input-clear.filled select,
.input-clear .select2-container .select2-selection--single .select2-selection__rendered[title],
.input-clear .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-selection--single, 
.input-clear .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single {
    background-color: transparent;
    border-color: inherit;
}
.input-clear .select2-dropdown {
    border-radius: 0;
    width: 100% !important;
    margin: 0;
}
.input-clear .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-dropdown {
    background-color: #fff;
    border-color: transparent;
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.input-clear .select2-container .select2-results__options {
    padding: 5px;
}
.input-clear .select2-container .select2-results__option {
    border-color: transparent;
    padding: 5px;
    color: #00A850;
}
.input-clear .select2-container .select2-results__option[aria-selected=true] {
    display: none;
}
.input-clear .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #eaeaea;
    color: #00A850;
}
.alert-more-than-field {
    font-size: 12px;
    color: #ee2e24;
    padding-left: 12px;
    margin-top: -15px;
    margin-bottom: 15px;
}
/*========== Form - END ==========*/

/*========== Login - START ==========*/
.sc-full {
    width: 100%;
    height: 100vh;
    background: rgb(70,89,104);
    background: linear-gradient(180deg, rgba(70,89,104,1) 0%, rgba(35,45,52,1) 100%);
    position: relative;
}
.sc-full .sc-inner {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    overflow: hidden;
}
.sc-full .container {
    height: 100%;
    position: relative;
}
.sc-full-bg {
    background-size: cover !important; 
    background-position: left center !important;
}
.sc-form-full {
    max-width: 430px;
    margin: auto;
    text-align: center;
}
.form-lg { max-width: 580px; }
.sc-form-full.form-lg .policy { max-width: 430px; margin-left: auto; margin-right: auto;}
.sc-form-full .form {
    max-width: 380px;
    margin: auto;
}
.sc-form-full .login-text {
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    color: #4DCD8A;
    margin-bottom: 10px;
}
.sc-form-full .fields.no-space .field:first-child { padding-bottom: 0;  }
.sc-form-full .fields.no-space .field:last-child { padding-bottom: 20px;  }
.sc-form-full .fields.no-space .field input { 
    border-radius: 0; 
    border: 0; 
    height: 70px; 
}
.sc-form-full .fields.no-space .field:first-child input {
    border-top: 4px solid #61D699;
    border-bottom: 1px solid #ccc;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.sc-form-full .fields.no-space .field:last-child input {
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}
.sc-form-full .btn {
    width: 100%;
    height: 50px; 
    line-height: 50px;
    border-radius: 30px;
    background: rgb(0,168,80);
    background: linear-gradient(135deg, rgba(0,168,80,1) 0%, rgba(97,214,153,1) 100%);
    border: 0;
}
.sc-form-full .login-logo { margin-bottom: 30px; }
.sc-form-full .login-logo img {
    height: 45px;
}
.sc-form-full .logout-logo-double {
    display: grid;
    margin: auto;
    width: fit-content;
    grid-template-columns: 175px 3px 120px;
    grid-gap: 25px;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}
.sc-form-full .logout-logo-double .login-logo {
    margin-bottom: 0;
}
.sc-form-full .logout-logo-double .seperator-vertical {
    height: 70%;
    width: 1px;
    background-color: #FFF;
    opacity: 0.4;
}
@media (max-width: 480px) {
    .sc-form-full .logout-logo-double {
        grid-gap: 10px;
        grid-template-columns: 1.3fr 3px 1fr;
    }
    .sc-form-full .logout-logo-double .login-logo img {
        height: unset;
        max-height: 45px;
        width: 100%;
    }    
}

.sc-login-bg {
    background-image: url("../../../assets/page/login/img/login-bg.jpg") !important;
}
.sc-logout-bg {
    background-image: url("../../../assets/page/login/img/logout-bg-compression.png") !important;
    background-position: center !important;
}
@media (max-width: 610px) {
    .sc-login-bg {
        background-image: url("../../../assets/page/login/img/login-bg-mb.jpg") !important;
        background-size: max(500px, 100%) auto !important;
        background-position: left top !important;
        background-repeat: no-repeat !important;
    }
}
@media (max-height: 768px) and (min-width: 767px) {
    .sc-inner .footer-full {
        display: none;
    }
    .sc-inner .ct-bg-transparent {
        padding: 30px !important;
        padding-bottom: 0 !important;
        margin-bottom: 10px !important;
    }
    .sc-inner .footer-short-height {
        display: block;
        margin-top: 30px;
    }
    .sc-inner .header-full {
        /* position: fixed; */
        top: 18px;
    }
    .sc-form-full .login-logo { margin-bottom: 13px; }
    .form-login input {height: 50px !important;}
    .sc-ct-inner.fixed-lock {
        overflow: visible !important;
        height: fit-content !important;
    }
}
.header-full {
    width: 100%; 
    position: absolute; 
    top: 40px;
    padding-left: 50px;
    padding-right: 30px;
    z-index: 9;
}
.header-full .menu-left {
    float: left;
}
.header-full .menu-right {
    float: right;
}
.header-full .change-lang { width: 50px; float: left; }
.header-full .menu-left .ic { 
    float: left; 
    color: #fff;
    font-size: 22px;
    margin-top: 10px; 
    margin-right: 10px;
}
.header-full .input-clear .label, .input-clear .select, 
.header-full .input-clear .select:after, 
.header-full .input-clear.filled select, 
.header-full .input-clear .select2-container--default .select2-selection--single .select2-selection__arrow b:before { 
    color: #fff; 
    font-weight: bold; 
}
.header-full .input-clear .select2-container .select2-results__option { font-size: 12px; }
.header-full .menu-right a { margin-right: 10px; }
.header-full .menu-right a:last-child { margin-right: 0; }
.header-full .menu-right .btn.outline-green {
    width: 100px;
    height: 35px;
    padding: 0;
    line-height: 31px;
}
.header-full .logo { text-align: center; }
.header-full .logo img {
    height: 45px
}

@media (max-height: 450px) {
    .sc-full .sc-inner.sc-low-height {
        overflow: scroll;
    }
    .header-40x {
        position: static;
        margin-top: 18px;
        margin-bottom: 20px;
    }        
    .footer-40x {
        display: block !important;
        position: static !important;
        margin-top: 18px;
        margin-bottom: 20px;
    }        

    .sc-full .container.container-low-height {
        height: fit-content !important;
    }
}

.footer-40x {
    display: block !important;
}

.footer-full {
    width: 100%; 
    position: absolute;
    bottom: 20px;
    text-align: center;
    left: 0;
}
.footer-short-height {
    display: none;
    width: 100%; 
    text-align: center;
}
.footer-full .image img, .footer-short-height .image img {
    height: 24px;
} 
.sc-form-full .policy {
    text-align: left;
    color: #fff;
    position: relative;
    margin-top: 35px;
    padding: 0 30px 0 50px;
    font-size: 14px;
}
.sc-form-full .policy:before {
    content: "\e919";
    font-family: 'iconfont';
    font-size: 15px;
    color: #4DCD8A;
    position: absolute;
    left: 25px;
    top: 0;
}
.sc-form-full .validated {
    width: 100%;
    color: #E53F3F;
    background-color: #F8DADA;
    text-align: center;
    font-size: 12px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    margin-top: 5px;
    padding: 5px 0;
}
/*========== Login - END ==========*/

/*========== Login Select - START ==========*/
.account-select {
    max-width: 480px;
    width: 100%;
    display: table;
    margin: auto;
    text-align: center;
    margin-bottom: 80px;
}
.account-select .account-lists {
    width: 50%;
    float: left;
    padding: 0 20px;
    position: relative;
    margin-top: 30px;
}
.account-select .account-lists:last-child:before {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #55616D;
    position: absolute;
    bottom: -30px;
    left: 0;
}
.account-select .account-lists .type {
    color: #aaa;
}
.account-lists .account-list {
    width: 100%;
    min-height: 60px;
    display: table;
    background-color: #fff;
    padding: 0 15px;
    border-radius: 5px;
    text-align: left;
    margin-top: 10px;
}
.account-lists .account-list .image {
    display: table-cell;
    vertical-align: middle;
    width: 45px;
}
.account-lists .account-list.bu-type .image {
    width: 35px;
}
.account-lists .account-list .image img {
    border: 2px solid #00A850;
    border-radius: 50%;
}
.account-lists .account-list.bu-type .image img { 
    border: 2px solid #465968;
}
.account-lists .account-list .detail {
    display: table-cell;
    vertical-align: middle;
    padding-left: 15px;
}
.account-lists .account-list .detail .name {
    font-weight: bold;
    color: #000;
    font-size: 13px;
}
.account-lists .account-list .detail .approver {
    font-size: 12px;
    color: #949DA5;
}
.account-lists .account-list .detail .approver .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-right: 2px;
}
/*========== Login Select - END ==========*/

/*========== Content BG White - START ==========*/
.sc-full-no-lock {
    width: 100%;
    min-height: 100vh;
    height: auto;
    background: rgb(70,89,104);
    background: linear-gradient(180deg, rgba(70,89,104,1) 0%, rgba(35,45,52,1) 100%);
    overflow: hidden;
}
.sc-full-no-lock .sc-inner {
    position: inherit;
}

.sc-full-no-lock.no-scrollbar::-webkit-scrollbar {
    width: 0;
    height: 0;
}
.no-scroll::-webkit-scrollbar {
    width: 0;
    height: 0;
}
.sc-ct-bg-white { padding-top: 30px; }
.sc-ct-bg-white .logo { width: 100%; display: inline-block; text-align: center; position: relative; z-index: 999; }
.sc-ct-bg-white .logo img {
    height: 45px;
}
.sc-ct-bg-white .account-number {
    float: left;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-size: 15px;
    margin-top: 14px;
}
.sc-ct-bg-white .account-number-input {
    width: 70%;
    float: right;
}
.sc-ct-bg-white .captcha-input input { 
    width: 50%; 
    float: left;
    padding-right: 10px; 
}
.sc-ct-bg-white .captcha-input img { 
    width: 50%; 
    height: 40px;
    float: right; 
    padding-left: 10px;
}
.sc-ct-bg-white .credit-number-input input {
    width: 21%;
    float: left;
    position: relative;
}
.sc-ct-bg-white .credit-number-input input:last-child {
    float: right;
    margin-right: 0;
}
.sc-ct-bg-white .credit-number-input span { 
    float: left;
    font-size: 37px;
    margin: 0 4px;
}
.sc-ct-bg-white .confirm-data {                             
    position: relative;
    background-color: #F4F4F4; 
    margin-bottom: 40px;
    margin-left: -40px;
    margin-right: -40px;
}
.sc-ct-bg-white .confirm-list { 
    width: 100%;
    display: inline-block; 
    border-bottom: 1px solid #ccc; 
    padding: 15px 80px;; }
.sc-ct-bg-white .confirm-list:last-child { border-bottom: 0; }
.sc-ct-bg-white .confirm-list .topic {
    float: left;
}
.sc-ct-bg-white .confirm-list .detail {
    float: right;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: bold;
}
.sc-ct-bg-white .otp {
    max-width: 600px;
    margin: auto;
}
.sc-ct-bg-white .otp.less-margin {
    max-width: inherit;
    margin-left: -15px;
    margin-right: -15px;
}
.sc-ct-bg-white .otp .ic { vertical-align: top; margin-left: 5px; }
.sc-ct-bg-white .otp .line-s {
    width: 100%;
    height: 1px;
    background-color: #eee;
    display: inline-block;
    margin: 30px 0;
}
.sc-ct-bg-white .ct-bg-white {
    padding: 40px;
    background-color: #fff;
    border-radius: 10px;
    margin-top: 50px;
    margin-bottom: 100px;
    position: relative;
}
.sc-ct-bg-white .ct-bg-white .small-wrapper {
    max-width: 380px;
    margin: auto;
}
.sc-ct-bg-white .ct-bg-white .small-wrapper .image {
    margin: 30px auto;
    text-align: center;
}
.sc-ct-bg-white .ct-bg-white .small-wrapper .list-num {
    margin-top: 15px;
    margin-left: 15px;
}
.sc-ct-bg-white .ct-bg-white .small-wrapper .list-num li {
    list-style-type: decimal;
    margin-bottom: 8px;
}
.sc-ct-bg-white .ct-bg-white .action { width: 100%; display: inline-block; }
.sc-ct-bg-white .ct-bg-white .list-num {
    margin-top: 15px;
    margin-left: 15px;
}
.sc-ct-bg-white .ct-bg-white .list-num li {
    list-style-type: decimal;
    margin-bottom: 8px;
    line-height: 1.5;
}
.sc-ct-bg-white .ct-bg-white .code {
    width: 100%;
    height: 60px;
    line-height: 60px;
    background-color: #F4F4F4;
    border: 1px solid #eee;
    border-radius: 4px;
    text-align: center;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    color: #000;
}
.sc-ct-bg-white .ct-bg-white .line {
    width: 189%;
    height: 1px;
    background-color: #eee;
    display: inline-block;
    margin-left: -44.5%;
    margin-top: 30px;
    margin-bottom: 30px;
}
.sc-ct-bg-white .ct-bg-white .line.no-border,
.sc-ct-bg-white .otp .line-s.no-border  {
    background-color: transparent;
    margin-top: 0;
}
.sc-ct-bg-white .ct-bg-white .note {
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-size: 10px;
    color: #9A9A9A;
}
.sc-ct-bg-white .ct-bg-gray { 
    background-color: #FAFAFA;
    padding: 20px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.sc-ct-bg-white .ct-bg-gray p { margin-top: 15px; }
.sc-ct-bg-white .ct-bg-gray ul { margin-top: 8px; margin-left: 18px; }
.sc-ct-bg-white .ct-bg-gray ul li {
    position: relative;
    padding-left: 15px;
    margin-bottom: 5px;
}
.sc-ct-bg-white .ct-bg-gray ul li:before { 
    content: "-";
    position: absolute;
    top: 0;
    left: 0;
}
.sc-ct-bg-white .ct-bg-gray .image {
    max-width: 320px;
    margin: 20px auto;
}
.sc-ct-bg-white .ct-bg-gray .content {
    height: 350px;
    overflow: auto;
    padding-right: 20px;
}
.sc-ct-bg-white .ct-bg-gray .content-overlay, 
.terms-conditions-animate .animate-guide,
.terms-conditions-animate-2 .animate-guide {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0,0,0,0.65);
    display: none;
    text-align: center;
    padding: 70px 20px;
    cursor: pointer;
}
.content-wrap.scroller .content-overlay, 
.terms-conditions-animate.scroller .animate-guide,
.terms-conditions-animate-2.scroller .animate-guide {
    display: block;
}    

.content-wrap, 
.terms-conditions-animate, 
.terms-conditions-animate-2 {
    position: relative;
}

.content-wrap .content-overlay .desc, 
.terms-conditions-animate .animate-guide .desc,
.terms-conditions-animate-2 .animate-guide .desc {
    font-family: 'DBThaiTextX';
    font-size: 25px !important;
    text-shadow: -1px 1px 2px #000;
    line-height: 0.8;
    color: #fff;
    margin-bottom: 10px;
}
.content-wrap .content-overlay .icon, 
.terms-conditions-animate .animate-guide .icon,
.terms-conditions-animate-2 .animate-guide .icon {
    margin: 2rem auto;
}
.content-wrap .content-overlay .icon img, 
.terms-conditions-animate .animate-guide .icon img,
.terms-conditions-animate-2 .animate-guide .icon img {
    height: 80px;
    margin: 0 auto;
    animation: slide-vertical 1.5s infinite;
}

@keyframes slide-vertical {
  0%, 100% {
    transform: translateY(-25%);
  }
  50% {
    transform: translateY(0);
  }
}

.sc-ct-bg-white .ct-bg-gray .content::-webkit-scrollbar {
    width: 5px;
    border-radius: 50px;
    background-color: #999;
}
.sc-ct-bg-white .ct-bg-gray .content::-webkit-scrollbar-track,
.sc-ct-bg-white .ct-bg-gray .content::-webkit-scrollbar-thumb {
    border-radius: 50px;
    background-color: #efefef;
}
.sc-ct-bg-white .ct-bg-gray .content::-webkit-scrollbar-track {
    background-color: #efefef;
    border-radius: 50px;
}
.sc-ct-bg-white .ct-bg-gray .content::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: #999;
}
.sc-ct-bg-white .ct-bg-gray .content::-webkit-scrollbar-thumb:hover {
    width: 5px;
    background-color: #efefef;
}
.sc-ct-bg-white .ct-bg-white .menu-step { 
    position: absolute;
    right: -190px;
    top: 0;
    width: 170px;
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li { 
    font-size: 14px;
    color: #fff;
    margin-bottom: 20px;
    padding-left: 45px;
    position: relative;
    min-height: 38px;
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li .num { 
    width: 30px;
    height: 30px;
    line-height: 26px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    display: inline-block;
    border: 2px solid #ccc;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    color: #000;
    margin-right: 8px;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: -3px;
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li .num:after {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #ccc;
    position: absolute;
    bottom: -29px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li .num.last:after {
    background-color: transparent;
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li.active {
    color: #4DCD8A;
    font-weight: bold;
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li.active .num {
    background-color: #4DCD8A;
    border: 2px solid #4DCD8A;
    color: #fff;
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li.check .num {
    color: #4DCD8A;
}
.sc-ct-bg-white .ct-bg-white .menu-step ul li.check .num:before {
    content: "\e91e";
    font-family: 'iconfont' !important;
    position: absolute;
    top: 50%; left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    color: #fff;
}
.application-channels { margin-left: -25px; margin-right: -25px; }
.application-channels-list { text-align: center; padding: 0 25px; }
.application-channels-list .heading {
    margin-bottom: 20px;
}
.application-channels-list .action { margin-top: 15px; }
.application-channels-list .action a.link-more { display: block; margin-bottom: 6px; }
.application-channels-list .action a.link-more:last-child { margin-bottom: 0; }
.application-channels-list .action .or { display: block; margin: 5px 0; }
.sc-ct-inner { padding-top: 30px; }
.sc-ct-inner .ct-bg-transparent {
    padding: 40px;
    border-radius: 10px;
    margin-top: 50px;
    margin-bottom: 100px;
    position: relative;
}
/*========== Content BG White - END ==========*/

/*========== Popup - START ==========*/
.popup-content-style h3 {
    font-size: 25px;
}

.popup-content-style-type h4, 
.popup-content-style-type .heading-h4 {
    font-size: 18px;
}
.popup-content-style-type h5, 
.popup-content-style-type .heading-h5 {
    font-size: 16px;
}
.popup-content-style h6, 
.popup-content-style .heading-h6 {
    font-size: 14px;
}
.popup-content-style-type .desc {
    font-size: 14px;
}

.mfp-bg.popup-content-style { opacity: 0.9; }
.popup-content-style .mfp-content .white-popup-block { padding: 0; }
.popup-content-style .mfp-content {
    max-width: 650px;
    background-color: #fff;
    padding: 30px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-style.mfp-close-btn-in .mfp-close {
    color: transparent;
}

.popup-content-style .mfp-content .content .desc {
    font-size: 14px;
    margin-top: 15px;
}      

.popup-content-style .mfp-content .content-default h2 {
    font-size: 20px;
}
.popup-content-style .mfp-content .content-default .desc {
    font-size: 14px;
    margin-top: 0;
}
.popup-content-style .mfp-content .content-default .link {
    font-size: 14px;
}      

.popup-content-style .mfp-content .content .image-icon {
    text-align: center;
    margin-bottom: 30px;
}
.popup-content-style .mfp-content .btn {
    height: 45px;
    line-height: 45px;
    width: 150px;
    border-radius: 90px;
}
.popup-content-style .mfp-content .btn.fixedwidth,
.popup-content-style-type-b .mfp-content .btn.fixedwidth {
    width: 150px;
    height: 40px;
    line-height: 40px;
}
.popup-content-style .mfp-content .popup-modal-dismiss,
.popup-content-style-more-detail .mfp-content .popup-modal-dismiss,
.popup-content-style .mfp-content .popup-modal-back,
.popup-content-style .mfp-content .popup-modal-dismiss-02,
.popup-content-style-search-large .mfp-content .popup-modal-dismiss-02 {
    position: absolute;
    top: 0;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style .mfp-content .popup-modal-dismiss .ic,
.popup-content-style .mfp-content .popup-modal-back .ic,
.popup-content-style .mfp-content .popup-modal-dismiss-02 .ic,
.popup-content-style-search-large .mfp-content .popup-modal-dismiss-02 .ic,
.popup-content-style-more-detail .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
@media (max-width: 768px) {
    .popup-modal-dismiss.mobile-compat,
    .popup-modal-dismiss-02.mobile-compat {
        right: 0!important;
        top: -40px!important;
    }        
}
.popup-content-style .mfp-content .account-select { margin-bottom: 0; }
.popup-content-style .mfp-content .account-select .account-lists {
    width: 43%;
    float: none;
    display: inline-block;
    padding: 0;
}
.popup-content-style .mfp-content .account-select .account-lists:last-child:before { background-color: transparent; }
.popup-content-style .mfp-content .account-select .account-lists .type { 
    font-size: 11px; 
    font-weight: bold;
    color: #333;
}
.popup-content-style .mfp-content .account-arrow {
    width: 14%;
    display: inline-block;
    vertical-align: bottom;
    margin-bottom: 20px;
}
.popup-content-style .mfp-content .account-arrow .ic {
    color: #fff;
    background-color: #445765;
    padding: 10px;
    border-radius: 50%;
}
.popup-content-style .mfp-content .account-lists .account-list {
    background-color: #FAFAFA;
    border: 1px solid #EDEDED;
}
.popup-content-style .mfp-content .account-lists .account-list .image { width: 35px; }
.popup-content-style .mfp-content .account-select.change-template { margin-top: 30px; }
.popup-content-style .mfp-content .account-select.change-template .account-lists {
    margin-top: 15px;;
}
.popup-content-style .mfp-content .account-select.change-template .account-lists .account-list {
    margin-top: 0;
    line-height: 60px;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}
.popup-content-style .mfp-content .account-select.change-template .account-arrow {
    margin-bottom: 30px;
}
.popup-content-style .mfp-content .menu-step { 
    position: absolute;
    right: -150px;
    top: 0;
    width: 130px;
}
.popup-content-style .mfp-content .menu-step ul li { 
    font-size: 14px;
    color: #fff;
    margin-bottom: 20px;
    position: relative;
    padding-left: 45px;
}
.popup-content-style .mfp-content .menu-step ul li .num { 
    width: 30px;
    height: 30px;
    line-height: 26px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    display: inline-block;
    border: 2px solid #ccc;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    color: #000;
    margin-right: 8px;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: -3px;
}
.popup-content-style .mfp-content .menu-step ul li .num:after {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #ccc;
    position: absolute;
    bottom: -30px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.popup-content-style .mfp-content .menu-step ul li .num.last:after {
    background-color: transparent;
    width: 0;
}
.popup-content-style .mfp-content .menu-step ul li.active {
    color: #4DCD8A;
    font-weight: bold;
}
.popup-content-style .mfp-content .menu-step ul li.active .num {
    background-color: #4DCD8A;
    border: 2px solid #4DCD8A;
    color: #fff;
}
.popup-content-style .mfp-content .menu-step ul li.check .num {
    color: #4DCD8A;
/*    position: relative;*/
}
.popup-content-style .mfp-content .menu-step ul li.check .num:before {
    content: "\e91e";
    font-family: 'iconfont' !important;
    position: absolute;
    top: 50%; left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    color: #fff;
}
.popup-content-style .mfp-content .heading .ic {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin-top: -10px;
    display: inline-block;
    color: #fff;
    margin-right: 10px;
    font-size: 15px;
}
.popup-content-style .mfp-content .desc-heading {
    margin-left: 20px;
    margin-top: 0;
}
.popup-content-style .mfp-content .sc-ct-bg-white .list-num {
    margin-top: 15px;
    margin-left: 15px;
}
.popup-content-style .mfp-content .sc-ct-bg-white .list-num li {
    list-style-type: decimal;
    margin-bottom: 8px;
    line-height: 1.5;
}
.popup-content-style .mfp-content .sc-ct-bg-white {
    height: 500px;
    overflow-x: hidden;
    overflow-y: auto;
    padding-top: 0;
    padding-right: 10px;
}
.popup-content-style .mfp-content .sc-ct-bg-white::-webkit-scrollbar {
  width: 5px;
}
.popup-content-style .mfp-content .sc-ct-bg-white::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.popup-content-style .mfp-content .sc-ct-bg-white::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}
.popup-content-style .mfp-content .choice-profile-heading { margin-bottom: 10px; }
.popup-content-style .mfp-content .choice-profile {
    background-color: transparent;
    padding: 10px 10px;
    border-bottom: 1px solid #d8d8d8;
    margin-bottom: 15px;
}
.popup-content-style .mfp-content .choice-profile .choice-label-profile {
    width: 20%; 
    float: left; 
    margin-top: 10px;
}
.popup-content-style .mfp-content .choice-profile .profile-details {
    width: 80%; 
    float: left; 
    text-align: center;
}
.popup-content-style .mfp-content .choice-profile .image {
    margin-bottom: 15px;
    position: relative;
    display: inline-block;
}
.popup-content-style .mfp-content .choice-profile .image:after {
    content: "";
    width: 55px;
    height: 55px;
    background-image: linear-gradient(to right, #00A850 0%, #61D699 100%);
    position: absolute;
    top: -5px;
    left: -5px;
    border-radius: 50%;
    z-index: 2;
}

.content-step-two .summary-wrapper.popup-choice-profile {
    height: 430px;
}
.popup-content-style .mfp-content .choice-profile .image img {
    width: 45px;
    border-radius: 50%;
    z-index: 9;
    position: relative;
}
.popup-content-style .mfp-content .choice-profile .caption {
    word-break: break-word;
    font-size: 13px;
    line-height: 1.2;
}
.choice-profile .input .label {
    font-size: 13px;
}
.popup-content-style .mfp-content .choice-profile .fields {
    margin-left: -3px;
    margin-right: -3px;
}
.popup-content-style .mfp-content .choice-profile .fields .field {
    padding-left: 3px;
    padding-right: 3px;
}
.popup-content-style .mfp-content .content.max-height,
.popup-content-style .mfp-content .content .popup-edit-list-step-1,
.popup-content-style .mfp-content .content .popup-remove-list-step-1 {
    height: 530px;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 10px;
}
.popup-content-style .mfp-content .content.max-height::-webkit-scrollbar,
.popup-content-style .mfp-content .content .popup-edit-list-step-1::-webkit-scrollbar,
.popup-content-style .mfp-content .content .popup-remove-list-step-1::-webkit-scrollbar {
  width: 5px;
}
 
.popup-content-style .mfp-content .content.max-height::-webkit-scrollbar-track,
.popup-content-style .mfp-content .content .popup-edit-list-step-1::-webkit-scrollbar-track,
.popup-content-style .mfp-content .content .popup-remove-list-step-1::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
 
.popup-content-style .mfp-content .content.max-height::-webkit-scrollbar-thumb,
.popup-content-style .mfp-content .content .popup-edit-list-step-1::-webkit-scrollbar-thumb,
.popup-content-style .mfp-content .content .popup-remove-list-step-1::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}
.popup-content-style .mfp-content .content .line { 
    width: 100%; 
    height: 1px; 
    display: inline-block; 
    background-color: #eee;
    margin: 15px 0 10px 0;
}
.popup-content-style .content-search-wrapper {
    width: 100%; display: inline-block; position: relative;
}
.popup-content-style .content-search-wrapper .content-search {
    position: absolute; left: 55%; top: 10px;
}
.popup-content-style .content-search-wrapper input {
    width: 65%; float: left;
}
.popup-content-style .content-search-wrapper .search-link {
    width: 75px; 
    float: right;
    font-size: 10px;
    margin-top: 4px;
    background: rgb(2,170,82);
    background: linear-gradient(126deg, rgba(2,170,82,1) 0%, rgba(97,214,153,1) 100%);
    border: 0;
    color: #fff;
    text-align: center;
    border-radius: 20px;
    padding: 4px 0;
    font-weight: bold;
    line-height: 1.1;
}
/*
.popup-content-style .mfp-content .summary {
    width: 50%;
    float: left;
}
*/
.popup-content-style-type .mfp-content .white-popup-block { padding: 0; }
.popup-content-style-type .mfp-content {
    max-width: 750px;
    background-color: #fff;
    padding: 30px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-style-type.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-content-style-type .mfp-content .content .desc {
    margin-top: 15px;
}  
.popup-content-style-type .mfp-content .content .desc.no-t {
    margin-top: 0;
}
.popup-content-style-type .mfp-content .content .num-code,
.popup-content-style .mfp-content .content .num-code {
    font-size: 25px;
    color: #4DCD8A;
    font-weight: bold;
}
.popup-content-style-type .mfp-content .content .summary-email,
.popup-content-style .mfp-content .content .summary-email {
    max-width: 600px;
    margin: auto;
    background-color: #F4F4F4;
    padding: 20px;
    margin-top: 20px;
    border: 1px solid #eee;
    border-radius: 4px;
    word-break: break-word;
}
.popup-content-style-type .mfp-content .content .pattern-password,
.popup-content-style .mfp-content .content .pattern-password {
    margin-top: 15px;
    font-size: 14px;
}
.popup-content-style-type .mfp-content .content .pattern-password li,
.popup-content-style .mfp-content .content .pattern-password li {
    margin-bottom: 6px;
    position: relative;
    padding-left: 30px;
}
.popup-content-style-type .mfp-content .content .pattern-password li:before,
.popup-content-style .mfp-content .content .pattern-password li:before {
    content: "\e91e";
    font-family: 'iconfont' !important;
    position: absolute;
    left: 0;
    top: -1px;
    font-size: 8px;
    color: #999;
    width: 18px;
    height: 18px;
    display: inline-block;
    line-height: 18px;
    border: 1px solid #999;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style-type .mfp-content .content .pattern-password li.checked,
.popup-content-style .mfp-content .content .pattern-password li.checked {
    color: #4DCD8A;
}
.popup-content-style-type .mfp-content .content .pattern-password li.checked:before,
.popup-content-style .mfp-content .content .pattern-password li.checked:before {
    color: #fff;
    background-color: #4DCD8A;
    border: 1px solid #4DCD8A;
}
.popup-content-style-type .mfp-content .content .line { 
    width: 100%; 
    height: 1px; 
    display: inline-block; 
    background-color: #eee;
    margin: 15px 0 10px 0;
}
.popup-content-style-type .mfp-content .content .summary-email .summary-email-detail {
    word-break: break-word;
}

.summary-detail {
    max-width: 100%;
    margin: auto;
    background-color: #F4F4F4;
    padding: 20px;
    border: 1px solid #eee;
    border-radius: 4px;
    word-break: break-word;
}
.popup-content-style-type .mfp-content .content .summary-email .summary-email-detail:first-child,
.popup-content-style .mfp-content .content .summary-email .summary-email-detail:first-child {
    border-bottom: 1px solid #E5E5E5;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.popup-content-style-type .mfp-content .content .summary-email .summary-email-detail.noline {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}
.popup-content-style-type .mfp-content .content .icon,
.popup-content-style .mfp-content .content .icon,
.popup-content-thank-you-style .mfp-content .content .icon { text-align: center; margin-bottom: 30px; }
.popup-content-style .mfp-content .content .icon.less-bt { margin-bottom: 15px; }
.popup-content-style-type .mfp-content .content .icon .ic,
.popup-content-style .mfp-content .content .icon .ic,
.popup-content-thank-you-style .mfp-content .content .icon .ic {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin: auto;
    margin-top: -10px;
    display: inline-block;
    color: #fff;
    margin-right: 10px;
    font-size: 35px;
}
.popup-content-style-alert .mfp-content .content .icon .ic.ic-check {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin: auto;
    margin-top: -10px;
    display: inline-block;
    color: #fff;
    margin-right: 10px;
    font-size: 35px;
}
.popup-content-style-type .mfp-content .content .small-wrapper {
    margin-top: 20px;
}
.popup-content-style-type .mfp-content .content .small-wrapper .image {
    margin: auto;
    text-align: center;
    margin-bottom: 20px;
}
.popup-content-style-type .mfp-content .btn {
    height: 45px;
    line-height: 45px;
    width: 250px;
    margin: 0px 4px;
}
.popup-content-style-type .mfp-content .btn.n-fixed-width {
    width: auto;
    height: 40px;
    line-height: 40px;
}
.popup-content-style-type .mfp-content .btn.fixedwidth {
    width: 150px;
    height: 40px;
    line-height: 40px;
}
.popup-content-style-type .mfp-content .btn.n-fixed {
    width: auto;
    height: 32px;
    line-height: 32px;
    font-size: 13px;
}
.popup-content-style-type .mfp-content .btn.n-fixed-button {
    width: 100px;
    height: 32px;
    line-height: 32px;
    font-size: 13px
}
@media screen and (max-width: 767px) {
    .popup-content-style-type .mfp-content .popup-modal-dismiss,
    .popup-content-style-more-detail .mfp-content .popup-modal-dismiss {
        top: -40px;
        right: 0;    
    }
}
@media screen and (min-width: 768px) {
    .popup-content-style-type .mfp-content .popup-modal-dismiss,
    .popup-content-style-more-detail .mfp-content .popup-modal-dismiss {
        top: 0;
        right: -40px;
    }
}
.popup-content-style-type .mfp-content .popup-modal-dismiss,
.popup-content-style-more-detail .mfp-content .popup-modal-dismiss {
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style-type .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
    position: absolute;
    top: 12px;
    left: 9.5px;
}
.popup-content-style-type .mfp-content .popup-modal-dismiss-next {
    position: absolute;
    top: 0;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style-type .mfp-content .popup-modal-dismiss-next .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
.popup-content-style-type .mfp-content .content-type-list .ic,
.popup-content-style .mfp-content .content-type-list .ic {
    color: #4DCD8A;
    font-size: 30px;
    margin-right: 8px;
    line-height: 20px;
}
.popup-content-style-type .mfp-content .content-type-list .type-list,
.popup-content-style .mfp-content .content-type-list .type-list {
    margin-bottom: 20px;
}
.popup-content-style-type .transfer-wrapper { 
    padding: 0; 
}
.popup-content-style-type .successful-wrapper.fix-height {
    height: 350px;
    overflow-x: auto;
    overflow-y: scroll;
}
.popup-content-style-type .successful-wrapper.fix-height::-webkit-scrollbar {
    background-color:#fff;
    width:5px
}
/* background of the scrollbar except button or resizer */
.popup-content-style-type .successful-wrapper.fix-height::-webkit-scrollbar-track {
    background-color:#F4F3F9;
}
.popup-content-style-type .successful-wrapper.fix-height::-webkit-scrollbar-track:hover {
    background-color:#fff;
}

/* scrollbar itself */
.popup-content-style-type .successful-wrapper.fix-height::-webkit-scrollbar-thumb {
    background-color:#babac0;
    border-radius:16px;
}
.popup-content-style-type .successful-wrapper.fix-height::-webkit-scrollbar-thumb:hover {
    background-color:#a0a0a5;
    /* border: 1px solid #a0a0a5; */
}
/* set button(top and bottom of the scrollbar) */
.popup-content-style-type .successful-wrapper.fix-height::-webkit-scrollbar-button {display:none}


.popup-content-style-type .successful-wrapper.fix-height .successful-detail .topic {
    font-size: 14px;
}
.popup-content-style-type .successful-wrapper .successful.fix-height-row .successful-detail {
    padding-top: 10px;
    padding-bottom: 15px;
}
.popup-content-style-type .summary-qr {
    text-align: center;
    margin: 40px 0;
}
.popup-content-style-type .summary-qr img { width: 210px; margin: auto; }
.popup-content-style-type .summary-qr-ct {
    max-width: 100%;
    margin: auto;
}
.popup-content-style-type .qr-summary {
    width: 100%;
    display: inline-block;
    margin-top: 20px;
}
.popup-content-style-type .qr-summary.qr-fixedwidth { display: inherit; }
.popup-content-style-type .summary-qr.half {
    margin: 0;
    text-align: right;
    margin-top: 20px;
}
.popup-content-style-type .summary-qr-ct.half { 
    max-width: 100%;
    margin-top: 20px;
}
.popup-content-style-type .form {
    max-width: 500px;
    margin: auto;
}
.popup-content-style-type .form.no-t {
    margin-top: 0;
    max-width: 100%;
}
.popup-step .form.no-t .fields {
    margin-bottom: 0;
}
.popup-step .form.no-t .fields .field:last-child {
    padding-bottom: 0;
}
.popup-content-style-type .form.form-full {
    max-width: 100%;
}
.popup-content-style-type .form.form-full .field { padding-left: 0; padding-right: 0; }

.popup-content-style-type-b .mfp-content .white-popup-block { padding: 0; }
.popup-content-style-type-b .mfp-content {
    max-width: 1100px;
    background-color: #fff;
    padding: 50px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-style-type-b .transfer-wrapper {
     max-width: 1100px;
}
.popup-content-style-type-b.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-content-style-type-b .mfp-content .content .desc {
    margin-top: 15px;
}  
.popup-content-style-type-b .mfp-content .content .desc.no-t {
    margin-top: 0;
}
.popup-content-style-type-b .mfp-content .content .num-code {
    font-size: 25px;
    color: #4DCD8A;
    font-weight: bold;
}
.popup-content-style-type-b .mfp-content .content .summary-email {
    max-width: 400px;
    margin: auto;
    background-color: #F4F4F4;
    padding: 20px 40px;
    margin-top: 20px;
    border: 1px solid #eee;
    border-radius: 4px;
}
.popup-content-style-type-b .mfp-content .content .pattern-password {
    margin-top: 15px;
}
.popup-content-style-type-b .mfp-content .content .pattern-password li {
    margin-bottom: 6px;
    position: relative;
    padding-left: 30px;
}
.popup-content-style-type-b .mfp-content .content .pattern-password li:before {
    content: "\e91e";
    font-family: 'iconfont' !important;
    position: absolute;
    left: 0;
    top: -2px;
    font-size: 8px;
    color: #999;
    width: 18px;
    height: 18px;
    display: inline-block;
    line-height: 18px;
    border: 1px solid #999;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style-type-b .mfp-content .content .pattern-password li.checked {
    color: #4DCD8A;
}
.popup-content-style-type-b .mfp-content .content .pattern-password li.checked:before {
    color: #fff;
    background-color: #4DCD8A;
    border: 1px solid #4DCD8A;
}
.popup-content-style-type-b .mfp-content .content .line { 
    width: 100%; 
    height: 1px; 
    display: inline-block; 
    background-color: #eee;
    margin: 15px 0 10px 0;
}
.popup-content-style-type-b .mfp-content .content .summary-email .summary-email-detail:first-child {
    border-bottom: 1px solid #E5E5E5;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.popup-content-style-type-b .mfp-content .content .summary-email .summary-email-detail.noline {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}
.popup-content-style-type-b .mfp-content .content .icon { text-align: center; margin-bottom: 30px; }
.popup-content-style-type-b .mfp-content .content .icon .ic {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin: auto;
    margin-top: -10px;
    display: inline-block;
    color: #fff;
    margin-right: 10px;
    font-size: 35px;
}
.popup-content-style-type-b .mfp-content .content .small-wrapper {
    margin-top: 20px;
}
.popup-content-style-type-b .mfp-content .content .small-wrapper .image {
    margin: auto;
    text-align: center;
    margin-bottom: 20px;
}
.popup-content-style-type-b .mfp-content .btn {
    height: 45px;
    line-height: 45px;
    width: 250px;
}
.popup-content-style-type-b .mfp-content .btn.n-fixed {
    width: auto;
    height: 32px;
    line-height: 32px;
    font-size: 13px;
}
.popup-content-style-type-b .mfp-content .popup-modal-dismiss {
    position: absolute;
    top: 0;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style-type-b .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
.popup-content-style-type-b .mfp-content .popup-modal-dismiss-next {
    position: absolute;
    top: -20px;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style-type-b .mfp-content .popup-modal-dismiss-next .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
.popup-content-style-type-b .mfp-content .content-type-list .ic {
    font-size: 30px;
    color: #4DCD8A;
    margin-right: 20px;
}
.popup-content-style-type-b .mfp-content .content-type-list .type-list {
    margin-bottom: 20px;
}
.popup-content-style-type-b .transfer-wrapper { 
    padding: 0; 
}
.popup-content-style-type-b .transfer-wrapper.fix-height {
    height: 500px;
    overflow-x: auto;
    padding-right: 20px;
}
.popup-content-style-type-b .transfer-wrapper.fix-height::-webkit-scrollbar {
  width: 5px;
}
 
.popup-content-style-type-b .transfer-wrapper.fix-height::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
 
.popup-content-style-type-b .transfer-wrapper.fix-height::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}
.popup-content-style-type-b .successful-wrapper.fix-height {
    height: 350px;
    overflow-x: auto;
}
.popup-content-style-type-b .successful-wrapper.fix-height .successful-detail .topic {
    font-size: 14px;
}
.popup-content-style-type-b .successful-wrapper .successful.fix-height-row .successful-detail {
    padding-top: 10px;
    padding-bottom: 15px;
}
.popup-content-style-type-b .summary-qr {
    text-align: center;
    margin: 40px 0;
}
.popup-content-style-type-b .summary-qr img { width: 130px; margin: auto; }
.popup-content-style-type-b .summary-qr-ct {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
.popup-content-style-type-b .qr-summary {
    width: 100%;
    display: inline-block;
}
.popup-content-style-type-b .summary-qr.half {
    margin: 0;
    text-align: center;
    margin-top: 20px;
}
.popup-content-style-type-b .summary-qr-ct.half { 
    margin-top: 20px;
}
.popup-content-style-type-b .form {
    max-width: 500px;
    margin: auto;
    margin-top: 30px;
}
.popup-content-style-type-b .form.no-t {
    margin-top: 0;
    max-width: 100%;
}
.popup-content-style-type-b .form.form-full {
    max-width: 100%;
}
.popup-content-style-type-b .form.form-full .field { padding-left: 0; padding-right: 0; }
.popup-content-style-advance .mfp-content {
    max-width: 390px;
    background-color: #fff;
    padding: 20px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-style-type-b .form.dashboard {
    margin-top: 0;
    width: 200px;
    float: right;
}
.popup-content-style-type-b .form.dashboard input,
.popup-content-style-type .form.dashboard input {
    height: 40px;
}
.popup-content-style-type-b .form.dashboard .input-search,
.popup-content-style-type .form.dashboard .input-search { top: 10px; }
.popup-content-style-advance.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-content-style-advance .mfp-content .content .desc {
    margin-top: 15px;
}       
.popup-content-style-advance .mfp-content .action { margin-top: 25px; }
.popup-content-style-advance .mfp-content .btn {
    height: 30px;
    line-height: 30px;
    width: 250px;
}
.popup-content-style-advance .mfp-content .btn.fixwidth {
    height: 40px;
    line-height: 40px;
    width: 145px;
}
.popup-content-style-advance .mfp-content input {
    height: 40px;
}
.popup-content-style-advance .mfp-content .field { padding-bottom: 15px; }
.popup-content-style-advance .mfp-content .popup-modal-dismiss {
    /* position: absolute;
    top: 0;
    right: 10px;
    width: 18px;
    height: 18px;
    background-color: #ccc;
    line-height: 16px;
    text-align: center;
    border-radius: 50%; */
    position: absolute;
top: 0;
right: -40px;
width: 30px;
height: 30px;
background-color: transparent;
border: 1px solid #fff;
line-height: 28px;
text-align: center;
border-radius: 50%;
}
.popup-content-style-advance .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
.popup-content-style-advance .mfp-content .select2-container--default .select2-selection--single .select2-selection__arrow b:before {
    content: "\e906";
}
.kplus-guide-title {
    font-size: 14px;
    line-height: 19px;
    font-weight: 700;
    color: #333333;
    margin-top: 30px;
}
.kplus-guide-detail {
    font-size: 13px;
    line-height: 19px;
    font-weight: 400;
    color: #333333;
}
.content-step-two .step-two-heading {
    width: 100%;
    display: inline-block;
}
.step-two-heading .error-msg {
    margin-top: 20px;
}
.content-step-two .date {
    float: right;
    text-align: right;
    font-size: 13px;
}
.content-step-two .date span {
    display: block;
    font-weight: bold;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.content-step-two .summary-qr {
    text-align: center;
    margin: 30px 0 0px 0;
}
.content-step-two .summary-qr img {
    width: 210px;
    margin: auto;
}
.content-step-two .summary-qr.s-width img {
    width: 120px;
}
.content-step-two .summary-wrapper {
    height: 530px; /* 530px is an old value */
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 10px;
    padding-top: 10px;
}
.summary-wrapper h3 {
    font-size: 20px;
}
.content-step-two .summary-wrapper::-webkit-scrollbar {
  width: 5px;
}
 
.content-step-two .summary-wrapper::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
 
.content-step-two .summary-wrapper::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}
.content-step-two .summary-wrapper .more-mar {
    display: inline-block;
    margin: 20px 0;
    margin-left: -15px;
    margin-right: -10px;
}
.content-step-two .summary-wrapper.height-auto {
    height: auto;
}
.content-step-two .summary-favourite {
    background-color: #F6F5FA;
    text-align: center;
    border-radius: 6px;
    padding: 20px;
    word-break: break-word;
}
.content-step-two .summary-favourite .image {
    width: 60px;
    height: 60px;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 35px;
}
.content-step-two .summary-favourite .image img {
    border-radius: 50%;
    border: 1px solid #eee;
    width: 100%;
    height: 100%;
}
.content-step-two .summary-favourite .image.no-pic img {
    border: none;
    width: 100%;
    max-width: 26px;
    height: auto;
    border-radius: 0;
}

.content-step-two .summary-favourite .image.no-pic {
    width: 60px;
    height: 60px;
    border: 3px solid #e2e2e2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.step-heading {
    margin-bottom: 20px;
}

.form-heading {
    margin-bottom: 20px;
}
.summary {
    width: 100%;
    display: table;
    table-layout: fixed;
    background-color: #F6F5FA;
    border-radius: 6px;
    padding: 10px 20px;
}
.row-transfer-inter .summary.matchHeight {
    max-height: 152px;
    min-height: 152px;
}
.row-transfer-th  .summary.matchHeight {
    max-height: 116px;
    min-height: 116px;
}
.summary-wrapper .col-md-7.matchHeight .summary {
    min-height: 116px;
}
.summary .image { width: 54px; display: table-cell; vertical-align: middle; }
.summary .image.no-pic .placeholder {
    width: 54px;
    height: 54px;
    border: 2px solid #e2e2e2;
    border-radius: 100px;
    position: relative;
}
.summary .image.no-pic img {
    border: none;
    width: 100%;
    max-width: 26px;
    height: auto;
    border-radius: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.summary .image img { border-radius: 50%; border: 2px solid #ccc; width: 100%; height: 54px; object-fit: cover; }
.summary .detail { display: table-cell; vertical-align: middle; padding-left: 20px; word-break: break-word;}
.summary .detail .name {
    font-size: 15px;
    font-weight: bold;
    position: relative;
    word-break: break-word;
}
.summary .detail .name .change {
    font-size: 15px;
    cursor: pointer;
    display: inline-block;
    margin-top: -5px;
}
.summary .detail .name small { font-size: 70%; font-weight: normal; display: block; }
.summary .detail .name .confirm {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #F6F5FA;
    display: none;
}
.summary .detail .name .confirm.show { display: block; }
.summary .detail .name input {
    background-color: #F6F5FA;
    border: 0;
    border-bottom: 1px solid #E5E4E8;
    padding: 0;
    height: 20px;
    border-radius: 0;
    color: #333;
    width: 70%;
    float: left;
    line-height: 1;
}
.summary .detail .name .confirm span {
    float: left;
}
.summary .detail .bank {
    color: #4DCD8A;
    font-size: 13px;
    font-weight: bold;
    word-break: break-word;
}
.summary .detail .account-no {
    font-size: 13px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.summary-wrapper .successful-detail {
    padding-bottom: 9px;
    padding-top: 10px;
}
.summary-wrapper .successful-detail .topic {
    color: #333;
}
.summary-wrapper .successful-detail .result { font-weight: normal; }
.summary-wrapper .otp {
    margin-top: 15px;
    margin-left: 0;
    margin-right: 0;
}
.summary-wrapper .otp .ic { vertical-align: top; margin-left: 5px; }
.summary-wrapper .otp .again,
.otp .again { margin-top: 5px; }
.summary-wrapper .otp input {
    height: 40px;
    background-color: #fff;
}
.summary-wrapper .otp input:focus { border-color: #ccc; }
.summary-wrapper .action {
    /* margin-top: 15px; */
}
.popup-content-style-search .mfp-content, 
.popup-content-style-search-large .mfp-content {
    max-width: 500px;
    background-color: #fff;
    padding: 10px 0 40px 0;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-style-search-large .mfp-content {
    max-width: 800px;
    padding: 30px;
}
.popup-content-style-search.mfp-close-btn-in .mfp-close, 
.popup-content-style-search-large.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-content-style-search .mfp-content .content .desc, 
.popup-content-style-search-large .mfp-content .content .desc {
    margin-top: 15px;
}       
.popup-content-style-search .mfp-content .action, 
.popup-content-style-search-large .mfp-content .action { 
    margin-top: 25px; 
}
.popup-content-style-search .mfp-content .btn,
.popup-content-style-search-large .mfp-content .btn {
    height: 30px;
    line-height: 30px;
}
.popup-content-style-search .mfp-content input,
.popup-content-style-search-large .mfp-content input {
    height: 40px;
}
.popup-content-style-search .mfp-content .field,
.popup-content-style-search-large .mfp-content .field { 
    padding-bottom: 15px; 
}
.popup-content-style-search .mfp-content .popup-modal-dismiss,
.popup-content-style-search-large .mfp-content .popup-modal-dismiss {
    position: absolute;
    top: 0;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
}
.popup-content-style-search .mfp-content .popup-modal-dismiss .ic,
.popup-content-style-search-large .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
.content-search .table thead { color: #333; }
.content-search .table th,
.content-search .table td { padding: 10px 20px;}
.content-search .table .bg-gray {
    background-color: #F6F5FA;
}
.content-search .table .nowrap {
    white-space: nowrap;
}
.content-search .search {
    padding: 0 20px 20px 20px;
}
.content-search .search .field p { margin-top: 10px; margin-right: 15px; }
.content-search .search .field input { width: 200px; }
.content-search .search-table-header {
    display: grid;
    grid-template-columns: fit-content(100%) 1fr fit-content(100%);
    justify-items: flex-start;
    align-items: center;
    gap: 15px;
    
    padding: 0 0 20px 0;
}
.content-search .search-table-header .field {
    padding-bottom: 0;
}
.content-search .search-table-header .field input {
    width: 300px;
}
.popup-content-style-search-large .content-search .search-table-header .field input {
    width: 330px;
}
.content-search .search-table-header .btn {
    height: 35px;
    line-height: 35px;
}
@media (max-width: 768px) {
    .content-search .search-table-header {
        grid-template-columns: 2fr 1fr;
        grid-template-rows: 1fr 1fr;
    }
    .content-search .search-table-header .search-title {
        grid-area: 1/1/2/2;
    }
    .content-search .search-table-header .search-btn {
        grid-area: 1/2/2/3;
        justify-self: flex-end;
    }
    .content-search .search-table-header .search-form {
        grid-area: 2/1/3/3;
        width: 100%;
    }
    .content-search .search-table-header .search-form .field input, 
    .content-search .search-table-header .search-form .field .input {
        width: 100%;
    }    
}

.content-search .input-search { top: 8px; }
.popup-content-style-more-detail .mfp-content {
    max-width: 700px;
    background-color: #fff;
    padding: 0;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-style-more-detail.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-content-style-more-detail .mfp-content .content .desc {
    margin-top: 15px;
}       
.popup-content-style-more-detail .mfp-content .action { margin-top: 25px; }
.popup-content-style-more-detail .mfp-content .btn {
    height: 30px;
    line-height: 30px;
}
.popup-content-style-more-detail .mfp-content input {
    height: 40px;
}
.popup-content-style-more-detail .mfp-content .field { padding-bottom: 15px; }

.popup-content-style-more-detail .mfp-content .heading {
    border-bottom: 1px solid #eee;
    padding: 20px;
}
.popup-content-style-more-detail .mfp-content .content-more-detail {
    padding: 20px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.popup-content-style-alert .mfp-content .white-popup-block { padding: 0; }
.popup-content-style-alert .mfp-content {
    max-width: 450px;
    background-color: #fff;
    padding: 40px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-style-alert.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-content-style-alert .mfp-content .content .desc {
    margin-top: 15px;
    font-size: 14px;
    line-height: 25px;
}             
.popup-content-style-alert .mfp-content .btn {
    height: 40px;
    line-height: 40px;
    width: 150px;
}
.popup-content-style-alert .mfp-content .popup-modal-dismiss {
    position: absolute;
    top: 0;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    /* display: none; */
}
.popup-content-style-alert .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
.popup-content-style-alert .content.content-alert .icon {
    margin-bottom: 30px;
}
.popup-content-style-alert .content.content-alert .iconfont {
    margin-bottom: 10px;
    font-size: 54px;
}
.popup-table-wrapper {
    background-color: #F7F7F7;
    padding: 20px;
    border-radius: 10px;
    margin-top: 20px;
    max-height: 300px;
    overflow-y: auto;
}
.popup-table-wrapper.no-bg {
    background-color: transparent;
    padding: 0;
}
.popup-iframe-style .mfp-content {
    max-width: 1250px;
    height: 630px;
}
.table.popup-table thead {
    background-image: none;
    color: #333;
}
.table.popup-table tbody tr {
    border-bottom: 1px solid #eee;
}
.table.popup-table tbody tr td { text-align: left; }
.table.popup-table tbody tr td:first-child { border-left: 0; }
.table.popup-table tbody tr td:last-child { border-right: 0; }
.table.popup-table tbody tr:last-child { border-bottom: 0; }
.table.popup-table tbody tr:nth-child(odd),
.table.popup-table tbody tr:nth-child(even) { background-color: transparent; }
.table.popup-table tbody tr td.c-big { font-size: 20px; }
#popup-account-number .select2-container,
#popup-create-template .select2-container,
#popup-edit-list .select2-container {
    width: 100% !important;
}
#popup-change-pattern-02 .content .qr-wrqpper,
.popup-change-pattern-qr .qr-wrqpper {
    border: 1px solid #4DCD8A;
    border-radius: 3px;
    padding: 35px 10px;
}
#popup-change-pattern-02 .content .qr-wrqpper .image,
.popup-change-pattern-qr .qr-wrqpper .image {
    text-align: center;
    margin: 20px auto;
}
#popup-change-pattern-02 .content .qr-wrqpper .image img,
.popup-change-pattern-qr  .qr-wrqpper .image img {
    width: 120px;
}
.popup-content-thank-you-style .mfp-content {
    max-width: 450px;
    background-color: #fff;
    padding: 40px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-thank-you-style .mfp-content .heading .ic {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin-top: -10px;
    display: inline-block;
    color: #fff;
    margin-right: 10px;
    font-size: 15px;
}
.popup-content-thank-you-style .desc-heading { margin-top: 15px; }
.mfp-bg.popup-content-style { opacity: 0.9; }
.popup-content-authen-style .mfp-content .white-popup-block { padding: 0; }
.popup-content-authen-style .mfp-content {
    max-width: 850px;
    padding: 0;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
}
.popup-content-authen-style.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-content-authen-style .mfp-content .popup-modal-dismiss {
    position: absolute;
    top: 0;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
}
.popup-content-authen-style .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 0.7;
}
.popup-content-authen-style .mfp-content .k-web-shopping-card-non-cards .k-web-shopping-card-non-card .caption {
    padding: 50px;
}

.mfp-content .content .approved-remark {
    margin-top: 10px;
    font-size: 13px;
}
/*========== Popup - END ==========*/

/*========== Transfer - START ==========*/
.transfer-wrapper {
    max-width: 800px;
    background-color: #fff;
    padding: 10px 20px 10px 20px;
    border-radius: 10px;
    position: relative;
}
.transfer-wrapper h6, 
.transfer-wrapper .heading-h6 {
    font-size: 14px;
}
.transfer-wrapper.more-p {
    max-width: 800px;
    padding: 40px;
}
.transfer-wrapper.half-t {
    margin-top: 20px;
}
.transfer-wrapper .tab-menu {
    position: absolute;
    top: -25px;
    right: 0;
}
.transfer-wrapper .tab-menu .list li {
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    margin-right: 20px;
    position: relative;
}
.transfer-wrapper .tab-menu .list li:last-child {
margin-right: 0;
}
.transfer-wrapper .tab-menu .list li:after {
    content: "";
    width: 100%;
    height: 4px;
    position: absolute;
    left: 0;
    bottom: -6px;
    background-image: none;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.transfer-wrapper .tab-menu .list li.active,
.transfer-wrapper .tab-menu .list li.active { color: #4dcd8a; }
.transfer-wrapper .tab-menu .list li.active:after,
.transfer-wrapper .tab-menu .list li:hover:after {
    background-image: linear-gradient(to right, #00a850 0%, #61d699 100%);
}
.transfer-wrapper .tab-menu .list li .ic {
    color: #22C77D;
    font-size: 12px;
    margin-right: 5px;
    margin-top: -3px;
    display: inline-block;
}
.transfer-wrapper.more-width {
    max-width: 100%;
}
.select-transfer-wrapper {
    margin-left: -5px;
    margin-right: -5px;
}
.select-transfer-wrapper .select-transfer {
    padding: 0 5px;
}
.select-transfer-wrapper .select-transfer-list { 
    width: 100%;
    display: inline-block;
    background-color: #fafafa;
    height: 40px;
    line-height: 40px;
    border: 1px solid #eee;
    border-radius: 25px;
    padding-left: 5px;
    -webkit-box-shadow: 0 1px 10px -5px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px -5px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px -5px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px -5px rgba(0,0,0,0.2);
}
.select-transfer-list .icon {
    width: 30px;
    height: 30px;
    line-height: 27px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    background: rgb(2,170,82);
    background: linear-gradient(126deg, rgba(2,170,82,1) 0%, rgba(97,214,153,1) 100%);
    color: #fff;
    border-radius: 50%;
    margin-top: 4px;
    margin-right: 4px;
}
.select-transfer-list .icon .ic {
    font-size: 18px;
}
.select-transfer-list .caption {
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    font-weight: bold;
}
.select-transfer-wrapper .select-transfer-list.active,
.select-transfer-wrapper .select-transfer-list:hover {
    background: rgb(2,170,82);
    background: linear-gradient(126deg, rgba(2,170,82,1) 0%, rgba(97,214,153,1) 100%);
}
.select-transfer-list.active .icon,
.select-transfer-list:hover .icon {
    background: none;
    border: 2px solid #fff;
    line-height: 23px;
}
.select-transfer-list.active .caption,
.select-transfer-list:hover .caption { color: #fff; font-weight: bold; }

.select-transfer-wrapper .select-transfer-list.disable,
.select-transfer-wrapper .select-transfer-list:hover.disable {
    background: transparent;
    background-color: #ddd;
}
.select-transfer-wrapper.account-management .select-transfer-list.disable .icon .ic,
.select-transfer-wrapper.account-management .select-transfer-list.disable .caption {
    color: #fff;
}
.select-transfer-list:hover.disable .icon { margin-top: 5px; }

.form-transfer-wrapper {
    border-top: 1px solid #eee;
    margin-left: -30px;
    margin-right: -30px;
    margin-top: 10px;
    padding: 10px 30px 5px 30px;
}
.form-transfer-wrapper.no-line {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
}
.fieldset-select-custom {
    background-color: #F6F5FA; 
    padding: 15px 20px;
    border-radius: 5px;
}
.field.fieldset-select-custom {
    padding-left: 12px;
    padding-right: 13px;
    padding-top: 0;
    background-color: transparent;
    border-radius: 0;
}
.fieldset-select-custom.no-bg {
    background-color: transparent;
    padding: 10px 0 0 0 !important;
}
.fieldset-select-custom.no-bg.px-normal {
    padding: 15px 20px !important;
}
.fieldset-select-custom.no-bg.py-small {
    padding: 0 20px 0 !important;
}
.fieldset-select-custom .heading {
    background-color: #F6F5FA;
    padding: 5px;
    font-size: 13px;
    margin-bottom: 15px;
}
.fieldset-select-custom .field.quarter {
    width: 25%;
}
.fieldset-select-custom.expand {
    display: none; 
}
.fieldset-select-custom .field-num {
    display: inline-block;
}
.fieldset-select-custom .field-num .obj {
    width: 10%;
    display: inline-block;
    vertical-align: middle;
    font-weight: bold;
    margin-top: 20px;
}
.fieldset-select-custom .field-num .obj .ic {
    font-size: 18px;
    color: #999;
}
.fieldset-select-custom .field-num .input {
    width: 85%;
    display: inline-block;
    vertical-align: middle;
}
.fieldset-title {
    font-size: 14px;
    line-height: 17px;
    font-weight: 700;
    color: #333;
    font-style: normal;
}
.select-custom .select2-dropdown { width: auto !important; }
.select-custom .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: transparent; }
.select-custom .select2-container--default .select2-selection--single .select2-selection__rendered { 
    height: 50px; 
    line-height: 50px;
}
.select-custom .select2-container--default .select2-selection--single .select2-selection__arrow b:before {
    content: "\e906";
    font-size: 14px;
    color: #4DCD8A;
    line-height: 50px;
}
.select-custom.select-custom-no-money .select2-container--default .select2-selection--single .select2-selection__arrow b:before {
    line-height: 40px;
}
.select-custom .select2-container--default .select2-selection--single .select2-selection__arrow b { 
    top: 0; left: 0; text-align: center; 
}
.select-custom .select2-container--default .select2-selection--single .select2-selection__arrow { 
    height: 50px; text-align: right; right: -8px;
}
.select-custom .select2-container .select2-selection--single .select2-selection__rendered[title] { 
    background-color: #fff; 
}
.select-custom-no-money .select2-container .select2-results__option {
    line-height: 50px;
}
.form.form-transfer input,
.form.form-transfer select {
    height: 40px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-size: 15px;
    background-color: #fff;
}
.form.form-transfer textarea {
    background-color: #fff;
}
.form.form-transfer input:disabled,
.form.form-transfer textarea:disabled,
.form.form-transfer select:disabled {
    background-color: #f8f8f8;
    cursor: default; 
    opacity: 0.4;
}

.form.form-transfer input:focus,
.form.form-transfer textarea:focus {
    border-color: #ccc;
}
.form.form-transfer .input.required input { 
    border: 1px solid #E53F3F;
    color: inherit;
}
.form.form-transfer .file-upload-wrapper .file-upload-input {
    background-color: #F8F8F8;
}
.form.form-transfer .select:after {
    content: "\e906";
    font-size: 14px;
    color: #4DCD8A;
    line-height: 40px;
}
.form.form-transfer .fields { margin-bottom: -10px; }
.form.form-transfer .field { padding-bottom: 10px; }
.form.form-transfer .field.more-bt {
    padding-bottom: 20px;
}
.form.form-transfer .field.more-bt .heading-h6 {
    margin-bottom: 10px;
}
.form.form-transfer .field.field-form-text {
    padding-bottom: 0;
    padding-top: 10px;
}
.form.form-transfer fieldset { padding-top: 8px; padding-bottom: 8px; }
.form.form-transfer .btn { width: 150px; }
.form.form-transfer .file-upload-wrapper .file-upload-action .btn { 
    width: 75px; 
    font-size: 12px;
    height: 26px;
    line-height: 26px;
    min-width: auto;
}
.form.form-transfer .file-upload-wrapper .file-upload-action .btn .ic-pencil {
    display: none;
}
.form.form-transfer .action {
    margin-top: 5px;
}
.form.form-transfer .select2-container .select2-results__option,
.form.form-transfer .select2-container .select2-selection--single .select2-selection__rendered[title] { 
    font-size: 14px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.form.form-transfer .select2-container .select2-selection--single { height: 40px; }
.form.form-transfer .select2-container--default .select2-selection--single .select2-selection__placeholder {
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.form.form-transfer .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-selection--single, 
.form.form-transfer .select2-container--default.select2-container--open:not(.select2-container--disabled) .select2-dropdown, 
.form.form-transfer .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single {
    border-color: #ccc !important;
}
.form.form-transfer .service-provider {
    width: 100%;
    margin: 10px 0;
    display: inline-block;
}
.form.form-transfer .service-provider img {
    float: left;
}
.form.form-transfer .service-provider span {
    float: left;
    margin-top: 5px;
    margin-left: 10px;
    font-size: 16px;
    font-weight: bold;
}
.form.form-transfer .service-provider .details {
    float: left;
    font-size: 11px;
    color: #999;
    margin-top: 10px;
    margin-left: 10px;
}
.form.form-transfer .service-provider .details .ic {
    display: inline-block;
    margin-top: -3px;
}
.select2-container .select2-results__option {
    padding: 10px 15px;
/*
    height: 40px;
    line-height: 40px;
*/
}
.select-custom-bank .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 40px; 
}
.select-custom-bank.select-arrow .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 35px;
    line-height: 35px;
    margin-top: 2px;
    margin-right: 2px;
}
.select-custom-bank .select2-container {
    width: 100% !important;
}
.select-custom-bank .select2-container--default .select2-selection--single .select2-selection__arrow b {
    background-color: #fff;
}
.transfer-wrapper .menu-step { 
    position: absolute;
    right: -150px;
    top: 0;
    width: 130px;
}
.transfer-wrapper .menu-step ul li { 
    font-size: 14px;
    color: #333;
    margin-bottom: 20px;
    padding-left: 45px;
    position: relative;
    padding-top: 3px;
}
.transfer-wrapper .menu-step ul li .num { 
    width: 30px;
    height: 30px;
    line-height: 26px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    display: inline-block;
    border: 2px solid #ccc;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    color: #000;
    margin-right: 8px;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: -3px;
}
.transfer-wrapper .menu-step ul li .num:after {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #ccc;
    position: absolute;
    bottom: -30px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.transfer-wrapper .menu-step ul li .num.last:after {
    width: 0;
    background-color: transparent;
}
.transfer-wrapper .menu-step ul li.active {
    color: #4DCD8A;
    font-weight: bold;
}
.transfer-wrapper .menu-step ul li.active .num {
    background-color: #4DCD8A;
    border: 2px solid #4DCD8A;
    color: #fff;
}
.transfer-wrapper .menu-step ul li.check .num {
    color: #4DCD8A;
/*    position: relative;*/
}
.transfer-wrapper .menu-step ul li.check .num:before {
    content: "\e91e";
    font-family: 'iconfont' !important;
    position: absolute;
    top: 50%; left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    color: #fff;
}
.transfer-wrapper .desc { margin-left: 25px; }
.transfer-wrapper.no-icon .desc { margin-left: 0; }
.transfer-wrapper .heading .ic {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin-top: -10px;
    display: inline-block;
    color: #fff;
    margin-right: 10px;
    font-size: 15px;
}
.transfer-wrapper .heading .ic.bg-red {
    background-color: #EB0000;
}
.notification-wrapper { width: 50%; float: left; }
.successful-wrapper {
    background-color: #F4F3F9;
    padding: 20px 40px;
    margin-top: 30px;
    border-radius: 4px;
    position: relative;

}
.successful-wrapper:after {
    content: "";
    position: absolute;
    top: 20%;
    right: 15%;
    width: 200px;
    height: 200px;
/*    background-image: url(../../page/business/fund-transfer/img/bg-successfully.png);*/
    background-size: 200px;
    background-repeat: no-repeat;
}
.successful-wrapper.no-bg:after {
    background-image: none;
}
.successful-wrapper.immediately { padding-top: 10px; margin-bottom: 40px; }
.successful-wrapper.immediately:before {
    content: "";
    width: 100%;
    height: 60px;
    background-color: #4DCD8A;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.successful-wrapper.immediately .logo { text-align: center; margin-bottom: 25px; }
.successful-wrapper.immediately .logo img { height: 38px; }
.successful-wrapper.immediately .bg-bt-successfully {
    position: absolute; 
    bottom: -12px; 
    left: 0;
}
.successful-wrapper .image-qr img { width: 100px; }
.successful-wrapper .image-qr p { 
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-size: 10px; 
    font-weight: bold;
    margin-top: 10px;
    margin-left: 16px;
}
.successful-wrapper .successful {
    position: relative;
    z-index: 9;
}
.successful-profile { width: 100%; display: table; table-layout: fixed; margin-bottom: 30px; margin-top: 15px; }
.successful-profile:last-child { margin-bottom: 0; }
.successful-profile .image { width: 60px; display: table-cell; vertical-align: middle; }
.successful-profile .image img {
    border-radius: 50%;
    border: 4px solid #232D34;
    width: 100%;
    height: 60px;
    object-fit: cover;
}
.successful-profile .image.no-pic .placeholder {
    width: 60px;
    height: 60px;
    border: 4px solid #ccc;
    border-radius: 50%;
    position: relative;
}
.successful-profile .image.to.no-pic img {
    border: none;
    width: 100%;
    max-width: 26px;
    height: auto;
    border-radius: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.successful-profile .image.green img {
     border: 4px solid #46C985;
}
.successful-profile .image.to img {
    border: 4px solid #ccc;
}
.successful-profile .detail { display: table-cell; vertical-align: middle; padding-left: 20px; }
.successful-profile .detail .form-to { 
    font-weight: bold;
    font-size: 14px;
    color: #999;
}
.successful-profile .detail .name {
    font-weight: bold;
    font-size: 16px;
}
.successful-profile .detail .bank {
    font-weight: bold;
    font-size: 13px;
    color: #4DCD8A;
}
.successful-profile .detail .account-no {
    font-size: 13px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.successful-profile.upload-file .image {
    width: 20%;
}
.successful-profile.upload-file .image img {
    border: 0;
    border-radius: 0;
}
.successful-profile.upload-file .detail {
    padding-bottom: 50px;
}
.successful-detail {
    width: 100%;
    display: inline-block;
    border-bottom: 1px solid #E5E4E8;
    padding-bottom: 15px;
    padding-top: 12px;
    line-height: 1.4em;
}
.successful-detail .topic { width: 36%; float: left; font-size: 13px; color: #999; }
.successful-detail .topic .ic { vertical-align: baseline; }
.successful-detail .result { 
    width: 64%;
    float: right; font-family: 'notosansthai', Helvetica, Arial, sans-serif; 
    font-size: 14px; 
    font-weight: bold; 
    text-align: right;
    word-break: break-word;
}
.successful-detail .result a { text-decoration: underline; }
.credit-card-detail .successful-detail .topic{
    width: 38%;
}
.credit-card-detail  .successful-detail .result { 
    width: 62%;
}
.successful-detail.successful-detail-6 .topic {
    width: 45%;
}
.successful-detail.successful-detail-6 .result {
    width: 55%;
}
.sc-bookmark { display: inline-block; margin-right: 20px; }
.sc-bookmark:last-child { margin-right: 0; }
.sc-bookmark .icon { margin-bottom: 25px; }
.sc-bookmark .icon .ic {
    background-color: #394855;
    padding: 15px;
    border-radius: 50%;
    color: #fff;
    font-size: 18px;
    margin-right: 0 !important;
}
.sc-bookmark .caption {
    font-size: 12px;
    font-weight: bold;
    color: #aaa;
}
.selected-type-wrapper {
    width: 100%; 
    display: inline-block;
    margin-bottom: 1px;
}
.selected-type .ic {
    display: inline-block;
    margin-top: -4px;
    margin-right: 4px;
}
/*========== Transfer - END ==========*/

/*========== Pending Approval - START ==========*/
.content-bg-white {
    padding: 20px;
    background-color: #fff;
    border-radius: 10px;
    margin-top: 10px;
    position: relative;
}
.content-bg-white.no-p {
    padding: 0;
}
.content-bg-white.max-width {
    max-width: 920px;
    padding: 30px;
}
.content-bg-white.max-width.less-pad {
    padding: 20px;
}
.content-bg-white .line { 
    width: 100%; 
    height: 1px; 
    display: inline-block; 
    background-color: #eee;
    margin: 15px 0;
}
.pending-heading {
    width: 100%;
    display: inline-block;
}
.pending-heading.more-bt {
    margin-bottom: 15px;
}
.pending-heading .heading,
.pending-heading .choice {
    float: left;
}
.pending-heading .btn {
    float: right;
    margin-top: -5px;
}
.table-overflow { overflow-x: auto; }
.table-overflow.has-menu {
    padding-bottom: 60px;
    margin-bottom: -60px;
}
.table-overflow.has-menu::-webkit-scrollbar {
    display: none;
}
/* .table-overflow .table thead tr th, 
.table-overflow .table tbody tr td {
    white-space: inherit;
} */
.table { 
    margin: 0 0 10px 0; 
    border: 1px solid transparent;
}
.table.table-fixed-desktop  tbody tr td, .table.table-fixed-desktop thead tr th {
    word-break: break-word;
    text-overflow: unset;
}
@media (min-width: 768px) {
    .table.table-fixed-desktop {
        table-layout: fixed;
    }
    .table.table-fixed-desktop  tbody tr td, .table.table-fixed-desktop thead tr th {
        word-break: break-word;
        text-overflow: unset;
        white-space: normal;
    }
}
.table tbody,
.table thead {
    font-size: 14px;
}
.table thead { color: #fff; }
.table tbody { color: #999; }
.table thead {
    background: rgb(0,168,80);
    background: linear-gradient(90deg, rgba(0,168,80,1) 100%, rgba(0,168,80,1) 100%);
}
.table.bg-blue thead{
    background: rgb(70,89,104);
    background: linear-gradient(90deg, rgba(35,45,52,1) 0%, rgba(70,89,104,1) 100%);
}
.table.bg-blue-no-gradient thead{
    background: rgb(44,58,66);
    background: linear-gradient(90deg, rgba(44,58,66,1) 0%, rgba(44,58,66,1) 100%);
}
.table thead th.radius-left-top {
    -webkit-border-top-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    border-top-left-radius: 10px;
}
.table thead th.radius-right-top {
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    border-top-right-radius: 10px;
}
.table tbody tr:nth-child(even) { background: #F7F7F7; }
.table tbody tr:nth-child(odd) { background: #FFF; }
.table tbody tr:last-child { border-bottom: 1px solid #eee; } 
.table tbody tr.bg-gray {
    background: #F7F7F7 !important;
}
.table tbody tr.menu-sub { background-color: #fff !important; }
.table tbody tr.menu-sub td {
    border-top: 1px solid #eee;
    padding: 5px 10px !important;
}
.table tbody tr.table-summary {
    background-color: #fff;
}
.table tbody tr.table-summary .pagination li {
    display: inline-block;
    border: 1px solid #eee;
    padding: 5px 10px;
    font-size: 14px;
    font-weight: bold;
    border-radius: 4px;
    background-color: #F5F5F5;
}
.table tbody tr.table-summary .pagination li.active {
    background-color: #fff;
}
.table tbody tr.table-summary .pagination li a {
    text-decoration: none !important;
    color: #6F6F6F;
}
.table tbody tr.table-summary .pagination li.active a {
    color: #00A850;
}
.table.set-bg tbody tr:nth-child(odd) {
    background-color: #fff;
}
.table.set-bg tbody tr:nth-child(even) {
    background-color: #fff;
}
.table.set-bg tbody tr.recent-transaction-detail {
    display: none;
}
.table.table-col-3 thead tr th, 
.table.table-col-3 tbody tr td {
    width: 33.3333333%;
    white-space: inherit;
    word-break: break-word;
}
.table.table-col-2 thead tr th, 
.table.table-col-2 tbody tr td {
    width: 50%;
    white-space: inherit;
    word-break: break-word;
}
.table.table-col-4 thead tr th, 
.table.table-col-4 tbody tr td {
    width: 25%;
    white-space: inherit;
    word-break: break-word;
}

.table .col-row-action a {
    display: inline-block;
}

.table .col-row-action a:first-child {
    margin-left: 0;
}

.table.table-with-action tbody > tr > td {
    white-space: normal;
}
.table.table-with-action tbody > tr > td.col-row-action {
    white-space: nowrap;
    text-align: left !important;
}
.table.table-with-action tbody > tr > td.col-acc-name {
    width: 170px;
}

.table .table-col-fixedwidth {
    width: 180px;
    white-space: pre-wrap;
}
.table-remark {
    font-size: 14px;
    padding: 0 10px 20px;
}

.table-remark ol {
    list-style: decimal;
    margin-left: 1em;
}
/*========== Pagination ==========*/
.card-bottom {
    padding: 15px 0;
}


ul.paginations {
    margin: 0;
    list-style: none;
    font-size: 0;
    position: relative;
    text-align: right;
    overflow: hidden;
    clear: both;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
ul.paginations li {
    display: inline-block;
    border: 1px solid #eee;
    font-size: 14px;
    font-weight: bold;
    border-radius: 4px;
    background-color: #F5F5F5;
    margin: 0 2px;
}
ul.paginations li,
ul.paginations span,
ul.paginations a {
    display: inline-block;
    vertical-align: top;
}
ul.paginations span,
ul.paginations a {
    width: 32px; 
    height: 32px;
    line-height: 32px;
    color: #999;
    text-align: center;
    overflow: hidden;
    text-decoration: none !important;
}
ul.paginations .prev,
ul.paginations .next {
    margin-left: 0;
    margin-right: 0;
    color: #ccc;
    line-height: 32px;
    position: relative;
}
ul.paginations .prev a, 
ul.paginations .next a { 
    position: relative;
    z-index: 2;
}
ul.paginations .prev:before,
ul.paginations .next:after {
    display: inline-block;
    vertical-align: top;
    font-family: 'iconfont';
    font-size: 12px;
    position: absolute;
    right: 10px;
}
ul.paginations .prev:before {
    content: "\e938";
}
ul.paginations .next:after {
    content: "\e938";
    transform: rotate(-180deg);
}
ul.paginations .ic {
    margin-top: -3px;
}
ul.paginations li:first-child .ic {
    margin-right: 5px;
}
ul.paginations li:last-child .ic {
    margin-left: 5px;
}

.no-touchevents ul.paginations li:not(.active):hover span,
.no-touchevents ul.paginations li:not(.active):hover a {
    color: #00A850;
}
ul.paginations .active {
    background-color: transparent;
}
ul.paginations .active span:not(.prev):not(.next),
ul.paginations .active a:not(.prev):not(.next) {
    background: #fff;
    color: #00A850;
    border-radius: 10px;
}
ul.paginations .disabled {
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    opacity: 1;
}

/*========== Action ==========*/
.table tbody tr.hv-border-t {
    border-top: 1px solid #eee;
}
.table thead tr th,
.table tbody tr td {
    padding: 12px 8px;
    white-space: nowrap;
} 
.table thead tr th { font-weight: bold; font-size: 14px; }
.table tbody tr td {
    text-align: center;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-size: 14px;
    color: #777;

    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}
.table tbody tr td:first-child { border-left: 1px solid #eee; }
.table tbody tr td:last-child { border-right: 1px solid #eee; }
.table tbody tr td .ic { font-size: 10px; margin-right: 5px; vertical-align: baseline; }
.table tbody tr td .ic.c-big {
    font-size: 16px;
}
.table tbody tr td .page {
    border: 1px solid #eee;
    padding: 5px 10px;
    color: #00A850;
    font-size: 14px;
    font-weight: bold;
}
.table tbody tr td a { text-decoration: underline; }
.table tbody tr td a.no-line { text-decoration: none; }
.table tbody tr td a:hover {
    text-decoration: underline;
}
.table tbody tr td a.noline,
.table tbody tr td a.noline:hover {
    text-decoration: none;
}
.form-pending-wrapper {
    margin-bottom: 15px;
}
.form.form-pending .fields {
    margin-left: -10px;
    margin-right: -10px;
    margin-bottom: 0;
}
.form.form-pending .fields .field {
    padding: 0 10px;
}
.form.form-pending input:focus, 
.form.form-pending textarea:focus, 
.form.form-pending select:focus {
    border-color: #ccc;
}
.form.form-pending .datepicker:before {
    height: 50px;
    line-height: 50px;
    color: #333;
}
.form-pending .choice { text-align: right; }
.form-pending-wrapper .sc-btn {
    text-align: right;
}
.form-pending-wrapper .sc-btn .btn {
    margin-top: 40px;
    margin-right: 10px;
}
.form-pending-wrapper .sc-btn.no-top .btn {
    margin-top: 0;
}
.form-pending-wrapper .sc-btn.less-t .btn {
    margin-top: 30px;
}
.form-pending-wrapper .sc-btn.less-t-no-bt { margin-bottom: 0; text-align: left; }
.form-pending-wrapper .sc-btn.less-t-no-bt .btn {
    margin-top: 30px;
    margin-bottom: 0;
}
.form-pending-wrapper .sc-btn .btn:last-child {
    margin-right: 0;
}
.pending-heading .choice:not(.inline):not(:last-child) { margin-top: 8px; margin-bottom: 0; }
.pending-heading .choice input.choice-input + .choice-name { line-height: 1.5; }
.pending-heading .sc-btn { float: right; display: none; }
.pending-heading .sc-btn .btn {
    float: left;
    margin-right: 10px;
}
.pending-heading .sc-btn .btn:last-child { margin-right: 0; }
.pending-heading .sc-btn p {
    margin-top: 4px;
    float: left;
    margin-right: 10px;
}
.form-pending.pending-approval .field {
    width: 20%;
}
.form-pending.pending-approval input,
.form-pending.pending-approval select {
    height: 40px; 
    line-height: 40px;
}
.form.form-pending.pending-approval .datepicker:before {
    line-height: 40px;
    height: 40px;
}
.form-pending.pending-approval .heading {
    margin-top: 30px;
    font-size: 18px;
}
.form-schedule { margin-bottom: 20px; }
.form-schedule .fields { margin-bottom: -10px; }
.form-schedule .field { width: 33.333333%; padding-bottom: 10px; }
.form-schedule .select-custom .select2-container--default .select2-selection--single .select2-selection__arrow b:before {
    line-height: 40px;
}
.form-schedule input, 
.form-schedule textarea, 
.form-schedule select { height: 40px; }
.form-schedule .sc-btn { margin-bottom: 20px; }
.form-schedule .sc-btn .btn {
    margin-top: 0;
}
.form-schedule .field.quarter {
    width: 25%;
}
.form-schedule .choice {
    margin-top: 15px;
}
.form-schedule .choice input.choice-input + .choice-name { font-weight: normal; }
/*========== Pending Approval - END ==========*/

/*========== Account Management - START ==========*/
.breadcrumb {
    font-weight: bold;
    color: #333;
    margin: 15px 0;
}
.breadcrumb .ic {
    color: #333;
    font-size: 10px;
    vertical-align: baseline;
}
.breadcrumb a {
    color: #aaa;
}
.account-management-detail {
    font-size: 13px;
    font-weight: bold;
    color: #333;
}
.account-management-detail span {
    float: right;
    font-weight: normal;
    color: #999;
    font-family: Arial;
}
.account-management-detail p { margin: 5px 0; }
.select-transfer-wrapper.account-management .select-transfer {
    width: auto;
    float: left;
}
.select-transfer-wrapper.account-management .select-transfer-list {
/*    margin-bottom: 10px;*/
}
.select-transfer-wrapper.account-management .select-transfer-list .caption {
    line-height: 1;
    vertical-align: middle;
    margin-top: -5px;
    font-weight: bold;
    padding-right: 12px;
}
.select-transfer-wrapper.account-management .select-transfer-list .icon {
    background: none;
}
.select-transfer-wrapper.account-management .select-transfer-list .icon .ic {
    color: #4DCD8A;
    font-size: 28px;
}
.select-transfer-wrapper.account-management .select-transfer-list.active .icon, 
.select-transfer-wrapper.account-management .select-transfer-list:hover .icon { border: 0; }
.select-transfer-wrapper.account-management .select-transfer-list.active .icon .ic, 
.select-transfer-wrapper.account-management .select-transfer-list:hover .icon .ic { color: #fff; }
.account-management-header {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
}
.account-management-heading.d-column {
    width: 60%;
    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;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    padding: 0;
    border-bottom: 0;
}
.account-management-heading-left {
    margin-right: 15px;
}
.account-management-heading.d-column .price {
    font-family: Arial;
    font-size: 10px;
    color: #999;
}
.account-management-heading-left .small-txt {
    font-family: Arial;
    font-size: 10px;
    color: #999;
}
.account-management-heading-left .small-txt .ic { margin-right: 5px; }
.account-management-heading.d-column .price span { 
    font-size: 28px;
    font-weight: bold;
    color: #333;
    margin-left: 0px;
    margin-top: 0px;
    display: inline-block;
}
.account-management-header .account-management-link {
    position: static !important;
}
.account-management-heading {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}
.account-management-heading .price {
    font-family: Arial;
    font-size: 10px;
    color: #999;
}
.account-management-heading.d-column .price span.green {
    color: #4DCC89;
}
.account-management-heading .price .ic { margin-right: 5px; }
.account-management-heading .price span { 
    font-size: 28px;
    font-weight: bold;
    color: #333;
    margin-left: 55px;
    margin-top: -20px;
    display: inline-block;
}
.account-management-heading .action {
    float: right;
    margin-top: -20px;
}
.account-management-heading .action .ic {
    color: #D6D6D6;
    margin-left: 5px;
}

.account-management-heading .price.credit-card span {
    margin-left: 100px;
}
.account-management-heading.d-column .price.credit-card span {
    margin-left: 0;
}
.account-management-heading .action {
    float: right;
    margin-top: -20px;
}
.account-management-heading .action .ic {
    color: #D6D6D6;
    margin-left: 5px;
}
.account-management-table {
    margin-top: 8px;
}
.table-wrapper {
    position:relative;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.table-scroll {
    height:260px;
    overflow:auto;  
    margin-top:45px;
}
.table-scroll.no-top {
    margin-top: 0;
}
.table.table-account-management { width: 100.2%; }
.table.table-account-management thead {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.table.table-account-management thead tr { width: 100%; display: inline-block; }
.table.table-account-management thead tr th, 
.table.table-account-management tbody tr td {
    padding: 15px 25px;
    font-size: 13px;
    width: 50%;
    float: left;
}
.table.table-account-management thead.three tr th,
.table.table-account-management tbody.three tr td {
    width: 33.3333333%;
    float: left;
}
.table.table-account-management thead.four tr th,
.table.table-account-management tbody.four tr td {
    width: 25%;
    float: left;
}
.table.table-account-summary-detail {
    margin: 0;
    position: relative;
}
/*
.table.table-account-summary-detail:after {
    width: 170px;
    height: 64px;
    content: "";
    position: absolute;
    top: 19px;
    right: -3px;
    background-image: url(../../../../SiteCollectionDocuments/assets/page/individual/account-management/credit-card/img/card-bar-03.png);
    background-size: 100%;
    background-repeat: no-repeat;
}
*/
.table.table-account-summary-detail.individual-account:after {
    background-image: url(../../../../SiteCollectionDocuments/assets/page/individual/account-management/credit-card/img/card-bar-03.png);
}
.table.table-account-summary-detail.individual:after {
    background-image: url(../../../../SiteCollectionDocuments/assets/page/individual/account-management/credit-card/img/card-bar-04.png);
}
/*
.table.table-account-summary-detail thead {
    background: rgb(0,168,80);
    background: linear-gradient(90deg, rgba(0,168,80,1) 0%, rgba(57,131,92,1) 100%);
}
*/
.table.table-account-summary-detail.individual thead,
.table.table-account-summary-detail.individual-account thead {
    background: rgb(44,58,66);
    background: linear-gradient(90deg, rgba(44,58,66,1) 0%, rgba(44,58,66,1) 100%);
}
.table.table-account-summary-detail thead tr th,
.table.table-account-summary-detail tbody tr td {
    text-align: left;
    padding: 20px;
    font-weight: normal;
}
.table.table-account-summary-detail tbody tr td {
    color: #333;
}
.table.table-account-summary-detail thead tr th .ic {
    vertical-align: baseline;
}
.table.table-account-summary-detail tbody tr td .num {
    font-size: 20px;
    font-weight: bold;
}
.table.table-account-summary-detail thead tr th.two-col {
    width: 8%;
}
.table.table-account-summary-detail thead tr th.five-col {
    width: 20%;
}
.table.table-account-summary-detail thead tr th.six-col {
    width: 24%;
}
.table.table-account-summary-detail thead tr th.seven-col {
    width: 28%;
}
.table.table-account-summary-detail tbody tr td.t-col-account-inactive img {
    width: 50px;
    margin-bottom: 10px;
}
.table.table-account-summary-detail tbody tr td.t-col-center {
    text-align: center;
}
.content-bg-white.content-bg-white-account-management {
    margin-top: 0;
    border-top: 0;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    border-left: 1px solid #eee;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    -webkit-border-top-left-radius: 0;
    -webkit-border-top-right-radius: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius-topright: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
/*========== Tab ==========*/
.tab {
    position: relative;
}
.tab .control {
    background: rgb(0,168,80);
    background: linear-gradient(90deg, rgba(0,168,80,1) 0%, rgba(97,214,153,1) 100%);
    margin-top: 8px;
    height: 45px;
    line-height: 45px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.tab .control.bg-blue {
    background: rgb(70,89,104);
    background: linear-gradient(90deg, rgba(35,45,52,1) 0%, rgba(70,89,104,1) 100%);
}
.tab .control a {
    width: 33.3333333%;
    float: left;
    text-align: center;
    font-size: 13px;
    color: #fff;
    font-weight: bold;
    position: relative;
}
.tab .control a.active {
    color: #fff;
    pointer-events: none;
}
.tab .control a:after {                                 
    content: "";
    width: 50%;
    height: 4px;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 0;
    background-image: none;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.tab .control a.active:after {
    background-color: #fff;
}
.tab-content {
    position: relative;
    height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
}
.tab-content.active {
    opacity: 1;
    visibility: visible;
    height: auto;
    overflow: visible;
}
.change-account.favorites {
    float: left; 
    margin-top: -14px;
    margin-left: 15px
}
.change-account .input {
    color: #000;
    position: relative;
    display: inline-block;
    vertical-align: baseline;
}
.change-account .input .ic {
    line-height: 1;
    position: absolute;
    left: 0; top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.change-account .select {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    line-height: normal;
    width: 175px;
}
.change-account .select .select2-container--default .select2-selection--single {
    outline: 0;
    margin-top: 2px;
}
.change-account .select .select2-container .select2-selection--single .select2-selection__rendered[title] {
    background-color: #f8f8f8;
}
.change-account .select .select2-container .select2-results__option[aria-selected],
.change-account .select .select2-container--default .select2-results__option--highlighted[aria-selected] {
/*    white-space: nowrap;*/
}
.account-management-summary {
    margin-top: 20px;
}
.account-management-summary.no-t {
    margin-top: 10px;
}
.account-management-summary-list {
/*
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
*/
    border-radius: 10px;
    border: 1px solid #eee;
    margin: 10px 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.account-management-summary-list .top {
    background: rgb(0,168,80);
    background: linear-gradient(90deg, rgba(0,168,80,1) 0%, rgba(57,131,92,1) 100%);
/*    background-color: #00a950;*/
    padding: 10px 20px;
    position: relative;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    width: 100%;
    display: inline-block;
    word-break: break-word;
    min-height: 83px;
}

.account-management-summary-list .top.height-4 {
    min-height: 101px;
}

.account-management-summary-list .top .obj {
    position: absolute;
    bottom: 0;
    left: 10%;
/*    display: none;*/
}
.account-management-summary-list .top .obj.right {
    left: auto;
    right: -3px;
}
.account-management-summary-list .top .obj img {
    height: 64px;
}
.account-management-summary-list .top .heading {
    margin-bottom: 5px;
    color: #fff;
    margin-top: 4px;
    font-size: 15px;
}

.account-management-summary-list .top .heading.more-t {
    margin-top: 14px;
    position: relative;
    z-index: 1;
}
.account-management-summary-list .top .heading .txt-small {
    font-weight: normal;
    font-size: 12px;
}
.account-management-summary-list .top .num {
    font-size: 22px;
    font-weight: bold;
}
.account-management-summary-list .top .detail {
    line-height: 1;
    color: #fff;
    margin-top: 8px;
}
.account-management-summary-list .top .heading.ct-small,
.account-management-summary-list .top .detail.ct-small { font-size: 13px; }
.account-management-summary-list .top .detail.visa {
    font-size: 12px;
    margin-top: 0;
}
.account-management-summary.summary-credit .account-management-summary-list .top { 
    background: rgb(70,89,104);
    background: linear-gradient(90deg, rgba(70,89,104,1) 0%, rgba(35,45,52,1) 100%);
/*    background-color: #2c3a42;*/
}
.account-management-summary-list .middle {
    width: 100%;
    padding: 0;
    display: inline-block;
}
.account-management-summary-list .middle.hv-bg {
    background-color: #f5f5f5;
}
.account-management-summary-list .middle.hv-border {
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
.account-management-summary-list .middle.less-pad {
    padding: 0 15px;
}
.account-management-summary-list .middle.less-t {
    margin-top: -5px;
}
.account-management-summary-list .middle .list-5 { width: 20%; float: left; }
.account-management-summary-list .middle .list {
    font-size: 14px;
}
.account-management-summary-list.min-h .middle .list {
    margin-bottom: 0;
    min-height: 45px;
    overflow: hidden;
}
.account-management-summary-list.min-h .middle .list.more-t {
    margin-top: 22px;
}
.account-management-summary-list.min-h .middle .list.more-less-t {
    margin-top: 16px;
}
.account-management-summary-list.min-h .middle .list p {
    margin: 8px 0;
}
.account-management-summary-list .middle .list.less-margin {
    margin: 2px 0;
}
.account-management-summary-list .middle .list .num {
    font-size: 18px;
    font-weight: bold;
    margin-top: 15px;
}
.account-management-summary-list .middle .list .num.less-t {
    margin-top: 6px;
}
.account-management-summary-list .middle .list .num span {
    font-size: 10px;
}
.account-management-summary-list .middle .list span {
    font-size: 17px;
    font-weight: bold;
    color: #333;
    display: block;
}
.account-management-summary-list .middle .list span.c-big {
    font-size: 22px;
}
.account-management-summary-list .bottom {
    height: 30px;
    line-height: 30px;
    position: relative;
    background-color: #FAFAFA;
    text-align: center;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
.account-management-summary-list .bottom a {
    color: #4DCC89;
    font-size: 14px;
    margin: 0 8px;
    font-weight: bold;
}
.account-management-summary-list .bottom a .ic {
    color: #4DCD8A;
    vertical-align: baseline;
    margin-right: 8px;
}
.account-management-summary-list .bottom .link-right {     position: absolute;
    right: -3px;
    top: 4px;
    margin: 0; 
}
.account-management-summary-list .bottom .link-right a { margin: 0; }
.account-management-summary-list .bottom .link-right .ic { font-size: 20px; color: #ccc; }
.account-management-link {
    position: absolute;
    top: 26px;
    right: 15px;
    z-index: 9;
}

.account-management-summary-list .account-inactive {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.account-management-summary-list .account-inactive .icon {
    text-align: center;
    margin: 0 auto 10px;
}
.account-management-summary-list .account-inactive .icon img {
    width: 38px;
}
.account-management-summary-list .account-inactive {
    text-align: center;
    padding: 20px;
    min-height: 108px;
}
.account-management-summary-list .account-inactive .desc {
    font-size: 14px;
}
.account-management-slider .slick-slide {
    outline: 0;
}
.account-management-slider .slick-dots li {
    width: 8px;
    height: 8px;
}
.account-management-slider .slick-dots li button {
    width: 8px;
    height: 8px;
}
.account-management-slider .slick-dots li button:before {
    width: 8px;
    height: 8px;
    line-height: 8px;
    background-color: #4DCD8A;
    content: "";
    border-radius: 50%;
}
.account-management-slider .slick-prev:before, 
.account-management-slider .slick-next:before {
    color: #4DCD8A;
    font-size: 12px;
    font-family: 'iconfont' !important;
    margin-top: 12px;
    display: inline-block;
}
.account-management-slider .slick-prev:before {
    content: "\e938";
}
.account-management-slider .slick-next:before {
    content: "\e907";
}
.account-management-slider .slick-prev {
    top: 35%;
    left: -10px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
     -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    z-index: 9;
}
.account-management-slider .slick-next {
    top: 35%;
    right: -10px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
     -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    z-index: 9;
}
.account-management-menu {
    background: #FAFAFA;
    padding: 10px 20px;
    position: relative;
    z-index: 3;
    margin-top: -5px;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
.account-management-menu .list li {
    display: inline-block;
    font-weight: bold;
    color: #999;
    margin-right: 15px;
}
.account-management-menu .list li .ic {
    vertical-align: baseline;
    color: #4DCD8A;
    margin-right: 5px;
}
.account-type-inactive .list li .ic {
    color: #ccc;
}
.account-type-inactive .list li a {
    color: #ccc;
    pointer-events: none;
}
.interbank-account { position: relative; cursor: pointer; }
.interbank-account-info.more-info {
    text-align: right;
}
td.interbank-account-info.more-info>a>i {
    margin-right: -5px;
}
.account-info-options .interbank-account-detail {
    min-width: 160px;
}
.interbank-account .interbank-account-detail {
    position: absolute;
    top: 48px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #fff;
    padding: 10px;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    font-size: 13px;
}
.interbank-account .arrow {
    position: absolute;
    top: 40px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #eee transparent;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
.interbank-account:hover .arrow,
.interbank-account:hover .interbank-account-detail { opacity: 1; }
.table tbody tr td.interbank-account-info {
    overflow: visible;
}
.interbank-account-info { position: relative; cursor: pointer; }
.interbank-account-info .interbank-account-detail {
    position: absolute;
    top: 48px;
    right: 10px;
    background-color: #fff;
    padding: 10px;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    display: none;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    text-align: left;
    font-size: 13px;
    z-index: 1;
}
.interbank-account-info .arrow {
    position: absolute;
    top: 40px;
    left:46%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #eee transparent;
    display: none;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
/*
.interbank-account-info:hover .arrow,
.interbank-account-info:hover .interbank-account-detail { display: block; }
*/
.account-info-options .arrow {
    top: 23px;
    left: 35%;
}
.account-info-options .interbank-account-detail {
    top: 31px;
    right: 0;
    padding-top: 15px;
}
.account-info-options .account-action {
    font-size: 13px;
    line-height: 18px;
    color: #777777;
    font-style: normal;
    font-weight: 400;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.account-info-options .account-action:hover {
    font-size: 13px;
    line-height: 18px;
    color: #4dcc89;
    font-style: normal;
    font-weight: 400;
}
.interbank-account-info small { font-size: 70%; }
.transfer-wrapper.account-management {
    margin-top: 10px;
    max-width: 900px;
}
.choice-group-own-card-payment .choice {
    margin-top: 10px;
}
.choice-other.inline-choice {
    width: 50%;
}
.input-own-card-payment {
    width: 50%; 
}
.input-calendar {
    position: absolute;
    right: 10px;
    top: 5px;
}
.input-calendar .ic {
    font-size: 15px;
    color: #22C77D;
}
.pay-the-card {
    width: 100%;
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 6px;
    display: inline-block;
}
.pay-the-card .left {
    float: left;
}
.pay-the-card .left .image {
    display: inline-block;
    vertical-align: middle;
}
.pay-the-card .left .detail {
    display: inline-block;
    vertical-align: middle;
    padding-left: 5px;
    font-size: 13px;
}
.pay-the-card .right {
    float: right;
    text-align: right;
}
.card-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.card-detail-top {
    display: flex;
    align-items: center;
    width: 50%;
}

.card-detail {
    padding-left: 10px;
}

.pay-the-card .right .card-name {
    text-transform: uppercase;
}
.pay-the-card .card-name-label {
    font-size: 12px;
}
.pay-the-card .card-name {
    font-size: 15px;
}
.card-detail .detail .card-name-label {
    font-size: 13px;
}
.card-detail .detail .card-number {
    font-size: 13px;
}
/*========== Account Management - END ==========*/

/*========== Cheque - START ==========*/
.select-transfer-wrapper.width-auto .select-transfer {
    width: auto;
    float: left;
}
.select-transfer-wrapper.width-auto .select-transfer-list .caption {
    padding-right: 15px;
    font-weight: bold;
}
.select-transfer-wrapper.width-auto .select-transfer-list .caption span {
    font-size: 10px;
    background-color: #EB0000;
    color: #fff;
    width: 15px;
    height: 15px;
    line-height: 18px;
    text-align: center;
    border-radius: 50%;
    display: inline-block;
}
.cheque-more-detail {
    position: relative;
}
.cheque-more-detail .arrow {
    position: absolute;
    top: 22px;
    right: 20px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #eee transparent;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
.cheque-more-detail .cheque-more {
    position: absolute;
    top: 30px;
    right: 0;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    padding: 15px;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
.cheque-more-detail .cheque-more .list {
    margin-top: 10px;
    margin-left: 20px;
}
.cheque-more-detail .cheque-more .list li {
    list-style-type: disc;
    margin-bottom: 6px;
}
.cheque-more-detail:hover .arrow,
.cheque-more-detail:hover .cheque-more { opacity: 1; }
.fieldset-cheque .fields {
    border-top: 1px solid #ccc;
    padding-top: 20px;
}
.fieldset-cheque .fields:first-child,
.fieldset-cheque .fields:last-child {
    border-top: 0;
}
.cheque-more-detail.cheque-more-detail-accordion {
    width: 65%;
    float: right;
}
.cheque-more-detail.cheque-more-detail-accordion .arrow-accordion {
    position: absolute;
    top: -10px;
    right: 20px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #eee transparent;
    opacity: 1;
}
.cheque-more-detail.cheque-more-detail-accordion .cheque-more-accordion-topic {
    cursor: pointer;
    float: right;
    position: relative;
    margin-right: 20px;
}
.cheque-more-detail.cheque-more-detail-accordion .cheque-more-accordion-topic:after {
    content: "\e906";
    font-family: 'iconfont';
    font-size: 10px;
    color: #4DCD8A;
    position: absolute;
    right: -20px;
    top: 3px;
}
.cheque-more-detail.cheque-more-detail-accordion .cheque-more-accordion {
    padding: 15px;
    float: right;
    position: relative;
    display: none;
    text-align: right;
}
.cheque-more-detail.cheque-more-detail-accordion .cheque-more-accordion .list {
    margin-top: 5px;
}
.cheque-info {
    position: relative;
}
.cheque-info .icon-info {
    position: absolute; 
    right: 10px;
    top: 45%; 
    -webkit-transform: translateY(-50%); 
    transform: translateY(-50%);
}
.cheque-arrow {
    width: 100%;
    display: inline-block;
    text-align: right;
}
.cheque-arrow a {
    width: 32px;
    height: 32px;
    line-height: 32px;
    color: #999;
    text-align: center;
    overflow: hidden;
    text-decoration: none !important;
    display: inline-block;
    border: 1px solid #eee;
}
.cheque-arrow a:hover {
    color: #00A850;
}
.cheque-arrow .prev,
.cheque-arrow .next {
    position: relative;
}
.cheque-arrow .prev:before,
.cheque-arrow .next:after {
    display: inline-block;
    vertical-align: top;
    font-family: 'iconfont';
    font-size: 12px;
    position: absolute;
    right: 10px;
}
.cheque-arrow .prev:before {
    content: "\e938";
}
.cheque-arrow .next:after {
    content: "\e938";
    transform: rotate(-180deg);
}
/*========== Cheque - END ==========*/

/*========== Dashboard - START ==========*/
.favorites {
    display: inline-block;
    margin-top: 15px;
}
.favorites .favorite li {
    width: 74px;
    height: 115px;
    overflow: hidden;
    display: inline-block;
    text-align: center; 
    margin-right: 15px; 
    font-size: 11px;
    font-weight: bold;
    color: #999;
    vertical-align: middle;
    margin-bottom: 10px;
    position: relative;
    word-break: break-word;
}
.favorites .favorite li:last-child { margin-right: 0; }
.favorites .favorite .favorite-image-result {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    margin-bottom: 0;
    border: 3px solid #eee;
    object-fit: cover;
}
.favorites .favorite li .ic {
    width: 30px;
    height: 30px;
    line-height: 30px;
    display: inline-block;
    text-align: center;
    background-color: #fff;
     -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    border-radius: 50%;
    color: #4DCD8A;
    margin-top: 15px;
}
.favorites .favorite li .ic-edit {
    position: absolute;
    right: 4px;
    bottom: 50px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 10px;
    -webkit-box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    cursor: pointer;
}
.favorites .favorite li .favorite-edit {
    width: 60px;
    position: absolute;
    right: 6px;
    top: 57px;
    background-color: #fff;
    padding: 5px;
    -webkit-box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 5px 1px rgba(0,0,0,0.2);
    text-align: left;
    display: none;
}
.favorites .favorite li .favorite-edit .ic {
    width: auto;
    height: auto;
    line-height: 1;
    background-color: transparent;
    box-shadow: none;
    margin-top: -6px;
    display: inline-block;
    margin-right: 4px;
}

.favorites .favorite .custom-file-upload {
    position: relative;
}

.favorites .favorite .custom-file-upload .file-upload-input {
    width: 58px;
    height: 58px;
    border-radius: 100px;
    margin-bottom: 10px;
    border: 3px solid #eee;
    padding: 0;
    color: transparent;
    margin-bottom: 0;
    background: transparent;
}

.favorites .favorite .custom-file-upload .file-upload-input::placeholder {
    color: transparent;
}

.favorites .favorite .custom-file-upload img {
    height: auto;
    max-width: 26px;
    border: 0;
    border-radius: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-bottom: 0;
}

.favorites .favorite .favorite-name {
    margin-top: 10px;
}
.favourite-name .summary .image.no-pic img {
    border: none;
    width: 100%;
    max-width: 26px;
    height: auto;
    border-radius: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.no-pic-wrapper {
    width: 60px;
    height: 60px;
    border: 2px solid #e2e2e2;
    border-radius: 50%;
}
.favourite-name .summary .image.no-pic {
    width: 60px;
    height: 60px;
    border: 2px solid #e2e2e2;
    border-radius: 50%;
    position: relative;
}

.favourite-name .summary .image.no-pic.no-border {
    border: none;
}

.favorites .favorite .custom-file-upload .file-upload-action {
    display: none;
}

.favorites .placeholder {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    margin-bottom: 0;
    border: 3px solid #eee;
    object-fit: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.favorites .placeholder .img-placeholder {
    max-width: 26px;
    height: auto;
    margin: 0 auto;
}

.dashboard-tooltip {
    position: relative;
}
.dashboard-tooltip .detail {
    position: absolute;
    top: 48px;
    right: 0;
    background-color: #fff;
    padding: 10px;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    font-size: 13px;
    width: 200px;
    z-index: 2;
    text-align: center;
}
.dashboard-tooltip .arrow {
    position: absolute;
    top: 40px;
    right: 35px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #999 transparent;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
.dashboard-tooltip:hover .detail,
.dashboard-tooltip:hover .arrow { opacity: 1; }
.profiles {
    width: 100%;
    display: inline-block;
    font-size: 0;
}
.profiles .num {
    font-size: 25px;

}
.profiles .profile:first-child {
    width: 23%;
    border-right: 1px solid #eee;
    margin-right: 2%;
}
.profiles .profile {
    width: 25%;
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
}
.profiles .profile img {
    width: 65px;
    border: 3px solid #232D34;
    border-radius: 50%;
    margin-right: 10px;
}
/*========== Dashboard - END ==========*/

/*========== Credit Card - START ==========*/
.credit-card-details {
    background-color: #FAFAFA;
    padding: 30px;
    border-radius: 6px;
    position: relative;
}
.credit-card-detail {
    margin-left: -20px;
    margin-right: -20px;
}
.credit-card-detail .credit-card-detail-list {
    padding: 0 20px;
    position: relative;
}
.credit-card-detail-list .heading {
    position: relative;
}
.credit-card-details-show { display: none; }
.credit-card-details-wrapper {
    background-color: #F6F5FA;
    padding: 30px;
    margin-bottom: 10px;
}
.credit-card-details-wrapper.bg-white {
    padding: 0;
    background: #fff;
}
.credit-card-details-wrapper .credit-card-details-form {
    max-width: 600px;
}
.credit-card-detail-list .heading .credit-card-details-info {
    background-color: #fff;
    padding: 30px;
    width: 320px;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    border-radius: 6px;
    position: absolute;
    top: -203px;
    left: -40px;
    z-index: 1;
    opacity: 0;
    font-size: 14px;
    font-weight: normal;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
.credit-card-detail-list .heading .credit-card-details-info .heading {
    margin-bottom: 10px;
}
.credit-card-detail-list .heading .arrow {
    position: absolute;
    top: -15px;
    left: 73px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 8px 0 8px;
    border-color: #999 transparent transparent transparent;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}
.credit-card-detail-list .heading:hover .credit-card-details-info,
.credit-card-detail-list .heading:hover .arrow {
    opacity: 1;
}
/*========== Credit Card - END ==========*/

/*========== Favourite - START ==========*/
.favourite-name {
    width: 100%;
    display: inline-block;
}
.favourite-name .heading {
    width: auto;
    display: inline-block;
    vertical-align: middle;
}
.favourite-name .summary {
    width: auto;
    display: inline-block;
    vertical-align: middle;
    background-color: transparent;
}
.add-favourite-form .file-upload-wrapper { 
    text-align: center;
    width: 80px;
    height: 80px;
    position: relative;
    margin: 0 auto 10px;
}
.add-favourite-form .file-upload-wrapper .file-upload-input {
    padding-left: 10px;
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: transparent !important;
    cursor: pointer;
    border-width: 2px;
    color: transparent;
}
.add-favourite-form .file-upload-wrapper .file-upload-action .btn {
    display: flex;
    font-size: 13px !important;
    width: 20px !important;
    height: 20px !important;
    position: absolute;
    bottom: 12px;
    right: 13px;
    background: #4dcd8a;
    color: #fff;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    line-height: 0 !important;
    min-width: auto !important;
}

.add-favourite-form .file-upload-wrapper .file-upload-action .btn .ic-pencil {
    display: block !important;
}

.add-favourite-form .file-upload-wrapper .file-upload-action .btn label{
    display: none !important;
}

.add-favourite-form .file-upload-wrapper .file-upload-action {
    position: inherit;
}
.add-favourite-form .file-upload-wrapper .file-upload-input::placeholder {
    color: transparent;
}
.add-favourite-form .custom-file-upload {
    position: relative;
    margin-top: 10px;
}
.add-favourite-form .custom-file-upload .obj {
    width: 33px;
    height: auto;
    position: absolute;
    top: 50%; left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.add-favourite-form .custom-file-upload.no-top {
    margin-top: 0;
}
.add-favourite-success { 
    text-align: center;
    background-color: #F6F5FA;
    padding: 30px 20px;
    border-radius: 6px;
}
.add-favourite-success .image {

    width: 60px;
    margin: auto;
}
.add-favourite-success .image img {
    border-radius: 50%;
    border: 1px solid #eee;
    margin-bottom: 20px;
    width: 60px;
    height: 60px;
    object-fit: cover;
}

.add-favourite-success .image.no-pic img {
    border: none;
    width: 100%;
    max-width: 26px;
    height: auto;
    border-radius: 0;
    margin: 0;
}

.add-favourite-success .image.no-pic {
    width: 60px;
    height: 60px;
    border: 3px solid #e2e2e2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.add-favourite-success .caption .heading {
    font-size: 14px;
    word-break: break-word;
}
#add-favourite .heading .ic,
#popup-step-two .heading .ic {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin-top: -10px;
    display: inline-block;
    color: #fff;
    margin-right: 10px;
    font-size: 15px;
}
#popup-edit-account .popup-modal-dismiss,
#popup-cancel .popup-modal-dismiss {
    display: none;
}
#popup-edit-account h3 {
    font-size: 20px;
}
#popup-edit-account .table-overflow {
    overflow: hidden;
}
/*========== Favourite - END ==========*/

/*========== Bill Payment - START ==========*/
.heading-hv-ic .ic {
    display: inline-block;
    margin-top: -6px;
    margin-right: 6px;
}
.payment-logo-list {
    padding: 0 20px;
    margin-top: 20px;
}
.payment-logo-list .image img {
    width: 55px;
    margin: auto;
    margin-bottom: 15px;
}
.payment-logo-list .list {
    text-align: center;
    /* display: inline-block; */
    padding: 0 5px;
}
.payment-logo-list .list .caption .heading {
    font-weight: normal;
    font-size: 14px;
    height: 35px;
    overflow: hidden;
}
.payment-logo-list .list .image a {
    display: block;
}
.payment-logo-slider .slick-list .slick-track {
    margin-left: 0;
}
.payment-logo-slider .slick-slide {
    outline: 0;
}
.payment-logo-slider .slick-dots li {
    width: 8px;
    height: 8px;
}
.payment-logo-slider .slick-dots li button {
    width: 8px;
    height: 8px;
}
.payment-logo-slider .slick-dots li button:before {
    width: 8px;
    height: 8px;
    line-height: 8px;
    background-color: #4DCD8A;
    content: "";
    border-radius: 50%;
}
.payment-logo-slider .slick-prev:before, 
.payment-logo-slider .slick-next:before {
    color: #4DCD8A;
    font-size: 12px;
    font-family: 'iconfont' !important;
    margin-top: 12px;
    display: inline-block;
}
.payment-logo-slider .slick-prev:before {
    content: "\e938";
}
.payment-logo-slider .slick-next:before {
    content: "\e907";
}
.payment-logo-slider .slick-prev {
    top: 35%;
    left: -10px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    z-index: 9;
}
.payment-logo-slider .slick-next {
    top: 35%;
    right: -10px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    z-index: 9;
}
.payment-list {
    border: 1px solid #eee;
    padding: 10px;
    border-radius: 5px;
    margin: 10px 0;
    cursor: pointer;
}
.payment-list:hover {
    border: 1px solid #4DCD8A;
}
.payment-list .image {
    display: inline-block;
    vertical-align: middle;
}
.payment-list .image .ic {
    color: #4DCD8A;
    font-size: 40px;
}
.payment-list .image img {
    width: 40px;
}
.payment-list .caption {
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}
.payment-list .caption .heading {
    font-size: 14px;
    font-weight: normal;
}
.bill-payment-serach {
    width: 100%;
    text-align: right;
    display: inline-block;
    margin: 10px 0;
}
.popup-bill-payments {
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
}
.popup-bill-payment-lists {
    margin-top: 10px;
    padding: 0 20px;
    height: 300px;
    overflow-x: auto;
}
.popup-bill-payment-lists::-webkit-scrollbar {
    width: 5px;
}
.popup-bill-payment-lists::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.popup-bill-payment-lists::-webkit-scrollbar-thumb {
    background-color: darkgrey;
    outline: 1px solid slategrey;
}
.popup-bill-payment-lists .lists {
    border-bottom: 1px solid #eee;
    position: relative;
}
.popup-bill-payment-lists .lists .image {
    display: inline-block;
    vertical-align: middle;
}
.popup-bill-payment-lists .lists .image img {
    width: 40px;
}
.popup-bill-payment-lists .lists .caption {
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    padding: 15px 0;
}
.popup-bill-payment-lists .lists .caption .heading { font-size: 13px; }
.popup-bill-payment-lists .lists .caption .desc { margin-top: 0; }
.popup-bill-payment-lists .lists .star {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    cursor: pointer;
}
.popup-bill-payment-lists .lists .star .ic { font-size: 15px; }
.popup-bill-payment-lists .lists .star.selected .ic {
    color: #4DCD8A;

}
.popup-bill-payment-lists .no-result {
    text-align: center;
    margin-top: 50px;
}
.bill-search-select .select {
    margin-top: 10px;
}
.bill-search-select .select2-container--default .select2-selection--single {
    border: 0;
    background-color: #f8f8f8;
}
.bill-search-select .select2-container .select2-selection--single .select2-selection__rendered[title] {
    background-color: #f8f8f8;
}
.bill-search-select .select2-container--default .select2-selection--single .select2-selection__arrow {
    width: 40px;
    height: 40px;
}
/*========== Bill Payment - END ==========*/

/*========== Register - START ==========*/
.successful-detail.register-detail {
    border-bottom: 0;
    display: table;
    table-layout: fixed;
    font-size: 0;
    padding-top: 0;
    line-height: 1.4;
}
.successful-detail.register-detail .topic {
    font-size: 15px;
    color: #000;
    display: table-cell;
    vertical-align: middle;
    float: none;
}
.successful-detail.register-detail .result {
    font-weight: normal;
    color: #7D8992;
    display: table-cell;
    vertical-align: middle;
    float: none;
}
/*========== Register - END ==========*/

/*========== Products Register - START ==========*/
.products-register-content .top {
    background: rgb(0,168,80);
    background: linear-gradient(90deg, rgba(0,168,80,1) 0%, rgba(97,214,153,1) 100%);
    padding: 20px 30px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.products-register-content .top.individual {
    background: rgb(70,89,104);
    background: linear-gradient(90deg, rgba(35,45,52,1) 0%, rgba(70,89,104,1) 100%);
}
.products-register-content .bottom {
    padding: 30px;
}
.products-register-content .bottom .image {
    margin-bottom: 25px;
}
.products-register-content .bottom .image img {
    border-radius: 6px;
    width: 100%;
}
.products-register-content .bottom .caption .heading {
    margin-bottom: 10px;
}
.products-register-content .bottom .products-list { margin-bottom: 40px; }
/*========== Products Register - END ==========*/

/*========== Setting - START ==========*/
.mainpage-setting-menu {
    border-bottom: 1px solid #eee;
    height: 50px;
    line-height: 30px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
}
.mainpage-setting-menu li {
    padding: 10px 0;
    display: inline-block;
    color: #333;
    font-weight: bold;
    font-size: 14px;
    position: relative;
    margin-right: 20px;
}
.mainpage-setting-menu li:last-child {
    margin-right: 0;
}
.mainpage-setting-menu li:after {
    content: "";
    width: 100%;
    height: 5px;
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: none;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.mainpage-setting-menu li.active:after, 
.mainpage-setting-menu li:hover:after {
    background-image: linear-gradient(to right, #00a850 0%, #61d699 100%);
}
.mainpage-setting-menu.ct-r {
    white-space: inherit;
    overflow-y: inherit;
    text-align: right;
    margin-top: -40px;
}
.btn-remove {
    width: 24px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
    text-align: center;
    background-color: #fff;
    color: #EB0000;
    border-radius: 50%;
    text-decoration: none !important;
}
.btn-remove:hover,
.btn-remove:focus {
    color: #fff;
    background-color: #EB0000;
    
}
.btn-remove .ic { margin-right: 0 !important; }
.btn-add {
    width: 24px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
    text-align: center;
    background-color: #4DCD8A;
    color: #fff;
    border-radius: 50%;
    text-decoration: none !important;
}
.btn-add:hover {
    color: #fff;
}
.btn-add .ic { margin-right: 0 !important; }
.remove-list {
    margin-top: 20px;
}
.remove-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 20px;
}
.remove-list li:before {
    content: "\e93d";
    font-family: 'iconfont' !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    line-height: 18px;
    display: inline-block;
    text-align: center;
    background-color: #EE0000;
    color: #fff;
    border-radius: 50%;
    text-decoration: none !important;
    font-size: 8px;
}
.add-list {
    margin-top: 20px;
}
.add-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 20px;
}
.add-list li:before {
    content: "\e913";
    font-family: 'iconfont' !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    line-height: 18px;
    display: inline-block;
    text-align: center;
    background-color: #4DCD8A;
    color: #fff;
    border-radius: 50%;
    text-decoration: none !important;
    font-size: 8px;
}
.link-back {
    color: #fff;
    font-weight: bold;
    margin-left: 28px;
    margin-bottom: 30px;
    display: inline-block;
}
.link-back .ic {
    font-size: 10px;
    display: inline-block;
    margin-top: -2px;
}
.link-back:hover,
.link-back:focus {
    color: #fff;
}
.setting-security .setting-security-tooltip {
    max-width: 580px;
    padding: 20px;
    position: absolute;
    top: 65px;
    left: 0;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    padding: 15px 25px;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    z-index: 1;
}
.setting-security .setting-security-tooltip .list {
    margin-top: 15px;
    margin-left: 15px;
}
.setting-security .setting-security-tooltip .list li {
    list-style-type: disc;
    margin-bottom: 6px;
}
.setting-security {
    border-top: 1px solid #eee;
    margin-top: 30px;
    padding-top: 20px;
    position: relative;
}
.setting-security.noline {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
}
.setting-security .topic {
    margin-top: 10px;
}
.setting-security .topic .ic {
    vertical-align: bottom;
}
.setting-security .details {
    width: 100%;
   border-bottom: 1px solid #eee;
    display: inline-block;
    padding-bottom: 20px;
    margin-top: 20px;
}
.setting-security .details.no-bt {
    padding-bottom: 0;
}
.setting-security .details:last-child {
    border-bottom: 0;
}
.setting-security .details .detail {
    width: 50%;
    float: left;
}
.setting-security .details .detail .heading {
    font-weight: bold;
    font-size: 13px;
}
.setting-security .details .detail .address {
    color: #999;
    word-break: break-word;
}
.setting-security .details .detail .note {
    font-size: 13px;
    color: #999;
}
.setting-security .details .detail:last-child {
    text-align: right;
}
.setting-security-slider { 
    margin: 30px 0 50px 0;
}
.setting-security-slider .caption {
    text-align: center;
    margin-top: 20px;
}
.setting-security-slider .caption .heading {
    font-size: 13px;
}
.setting-security-slider .slick-slide {
    outline: 0;
}
.setting-security-slider .slick-dots li {
    width: 8px;
    height: 8px;
}
.setting-security-slider .slick-dots li button {
    width: 8px;
    height: 8px;
}
.setting-security-slider .slick-dots li button:before {
    width: 8px;
    height: 8px;
    line-height: 8px;
    background-color: #4DCD8A;
    content: "";
    border-radius: 50%;
}
.setting-security-slider .slick-prev:before, 
.setting-security-slider .slick-next:before {
    color: #4DCD8A;
    font-size: 12px;
    font-family: 'iconfont' !important;
    margin-top: 12px;
    display: inline-block;
}
.setting-security-slider .slick-prev:before {
    content: "\e938";
}
.setting-security-slider .slick-next:before {
    content: "\e907";
}
.setting-security-slider .slick-prev {
    top: 35%;
    left: -10px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
     -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    z-index: 9;
}
.setting-security-slider .slick-next {
    top: 35%;
    right: -10px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
     -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    z-index: 9;
}
.search-results {
    display: none;
}
.partially-radio {
    border: 1px solid #eee;
    padding: 25px;
}
.partially-radio .num {
    color: #aaa;
    font-size: 20px;
}
.partially-radio .num span {
    color: #4DCD8A;
}
.form.form-search {
    width: 100%;
    max-width: 220px;
    display: inline-block;
}
.form.form-search .fields .field {
    position: relative;
}
.form.form-search .fields .button-search {
    position: absolute;
    right: 10px;
    top: 8px;
    color: #22C77D;
}
.form.form-search .fields .button-search .ic {
    font-size: 20px;
}
.popup-select-category {
    border: 1px solid #eee;
    padding: 30px;
    text-align: center;
    border-radius: 10px;
    cursor: pointer;
}
.popup-select-category .icon {
    margin-bottom: 20px;
}
.popup-select-category .icon .ic {
    font-size: 50px;
}
.popup-select-category:hover {
    border: 1px solid #4DCD8A;
}
.popup-select-category:hover .icon .ic,
.popup-select-category:hover .caption .heading a {
    color: #4DCD8A;
}
/*========== Setting - END ==========*/

/*========== Tooltip - START ==========*/
.tooltip {
    position: relative;
    display: inline-block;
}
.tooltip .tooltiptext {
    visibility: hidden;
    width: 260px;
    background-color: #fff;
    color: #333;
    border-radius: 6px;
    padding: 18px;
    position: absolute;
    z-index: 1;
    bottom: 160%;
    left: 50%;
    margin-left: -132px;
    opacity: 0;
    transition: opacity 0.3s;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.3;
     -webkit-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    -o-box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
    box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2);
}
.tooltip .tooltiptext.cheque-width {
    width: 150px;
    margin-left: -78px;
}
.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 8px;
    border-style: solid;
    border-color: #999 transparent transparent transparent;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}
.tooltip .ic {
    color: #4CCD8A;
}
.tooltip-info {
    position: absolute;
    right: 10px;
    top: 30px;
}
/*========== Tooltip - END ==========*/
.download-app {
    padding-left: 25px;
    font-size: 12px;
    color: #999;
    display: table;
}
.download-app span {
    display: table-cell;
    vertical-align: middle;
}
.download-app .image {
    margin-top: 10px;
    display: table-cell;
    vertical-align: middle;
    padding-left: 15px;
}
.download-app .image a {
    margin-right: 8px;
}
.download-app .image a:last-child {
    margin-right: 0;
}
.form.international-funds-transfer-form input, 
.form.international-funds-transfer-form select,
.form.international-funds-transfer-form textarea {
    text-transform: uppercase;
}
.form.international-funds-transfer-form fieldset {
    padding-top: 15px;
    padding-bottom: 15px;
}
.form.international-funds-transfer-form .action {
    margin-top: 25px;
}
.transfer-wrapper.international-funds-transfer-wrapper {
    padding: 20px;
}

.search-item .input-search-wrap {
    padding-right: 30px;
}
.search-item .input-search-wrap input {
    margin-top: -10px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-size: 15px;
}
.search-item .input-search-wrap .input-search {
    top: 2px;
    right: 40px;
}

/* K Web Shopping Card - START */
.k-web-condition {
    height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 20px;
}
.k-web-condition.more-height {
    height: 400px;
}
.k-web-condition::-webkit-scrollbar {
    width: 5px;
}
.k-web-condition::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.k-web-condition::-webkit-scrollbar-thumb {
    background-color: darkgrey;
    outline: 1px solid slategrey;
}
.k-web-condition ol,
.k-web-condition ul {
    margin-left: 25px;
    margin-top: 20px;
}
.k-web-condition ol li {
    list-style-type: decimal;
    margin-bottom: 10px;
}
.k-web-condition ul li {
    list-style-type: disc;
    margin-bottom: 10px;
}
.k-web-shopping-card-non-cards {
    width: 100%;
    display: table;
    font-size: 0;
    background-color: #fff;
    border-radius: 10px;
    overflow: hidden;
}
.k-web-shopping-card-non-cards .k-web-shopping-card-non-card {
    width: 50%;
    display: table-cell;
    vertical-align: middle;
    position: relative;
    overflow: hidden;
    height: 550px;
}
.k-web-shopping-card-non-cards .k-web-shopping-card-non-card .caption {
    padding: 50px;
}
.k-web-shopping-card-non-cards .k-web-shopping-card-non-card .caption .category {
    font-size: 16px;
    color: #333;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-weight: bold;
    margin-bottom: 10px;
}
.k-web-shopping-card-non-cards .k-web-shopping-card-non-card .caption .desc {
    font-size: 14px;
    color: #777;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    margin-top: 15px;
}
.k-web-shopping-card-non-cards .k-web-shopping-card-non-card .caption .link {
    text-decoration: underline;
    font-size: 14px;
    color: #777;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    font-weight: normal;
}

.k-web-shopping-card-non-cards .k-web-shopping-card-non-card .image img {
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomright: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.k-web-shopping-card-non-card .image img {
    min-height: 550px;
    object-fit: cover;
    position: absolute;
    top: 0;
    /* top: 50%;
    left: 0;
    -ms-transform:  translateY(-50%);
    -webkit-transform: translateY(-50%);
          transform: translateY(-50%); */
}

.k-web-shopping-card-non-cards .heading-logo {
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
}

.k-web-shopping-card-non-cards .heading-logo .img-inline {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 10px;
}

.btn-detail {
    float: right; 
    margin-top: 9px;
    margin-right: 10px;
    font-size: 14px;
}

.k-web-shopping-card-non-card .action .btn {
    min-width: 130px;
    max-width: 130px;
    margin-bottom: 10px;
    margin-right: 20px;
}

.k-web-shopping-card-non-card .action .link .ic {
    font-size: 8px;
    vertical-align: middle;
    margin-bottom: 2px;
    display: inline-block;
    margin-right: 3px;
}

.k-web-shopping-card-non-card .action {
    margin-top: 60px;
}

/* K Web Shopping Card - END */

/* Non Table - START */
.visible-ip-pro { display: none !important; }
.recent-transaction-non-tabel-detail { display: none; }
.non-table { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table .top,
.non-table .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table .list .btn-edit .ic { margin-top: -4px; }
.non-table .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table .list a {
    text-decoration: underline;
}
.non-table .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table .bottom .list p:first-child {
    display: none;
}
.non-table .list:first-child { width: 9%; }
.non-table .list:nth-child(2) { width: 8%; }
.non-table .list:nth-child(3) { width: 9%; }
.non-table .list:nth-child(4) { width: 13%; }
.non-table .list:nth-child(5) { width: 10%; }
.non-table .list:nth-child(6) { width: 9%; }
.non-table .list:nth-child(7) { width: 11%; }
.non-table .list:nth-child(8) { width: 11%; }
.non-table .list:nth-child(9) { width: 20%; }
.non-table .list:nth-child(9) { text-align: right; }
.non-table .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
} 
.non-table-02 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-02 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-02 .top,
.non-table-02 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-02 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-02 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-02 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-02 .list .btn-edit .ic { margin-top: -4px; }
.non-table-02 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-02 .list a {
    text-decoration: underline;
}
.non-table-02 .list a.noline {
    text-decoration: none;
}
.non-table-02 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-02 .bottom .list p:first-child {
    display: none;
}
.non-table-02 .list:first-child { width: 11.8%; }
.non-table-02 .list:nth-child(2) { width: 11.8%; }
.non-table-02 .list:nth-child(3) { width: 11.8%; }
.non-table-02 .list:nth-child(4) { width: 11.8%; }
.non-table-02 .list:nth-child(5) { width: 11.8%; }
.non-table-02 .list:nth-child(6) { width: 11.8%; }
.non-table-02 .list:nth-child(7) { width: 11.8%; }
.non-table-02 .list:nth-child(8) { width: 11.8%; }
.non-table-02 .list:nth-child(9) { width: 5%; }
.non-table-02 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-02 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-02 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-02 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-02 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-03 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-03 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-03 .top,
.non-table-03 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-03 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-03 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-03 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-03 .list .btn-edit .ic { margin-top: -4px; }
.non-table-03 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-03 .list a {
text-decoration: underline;
}
.non-table-03 .list a.noline {
text-decoration: none;
}
.non-table-03 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-03 .bottom .list .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-03 .bottom .list p:first-child {
    display: none;
}
.non-table-03 .list:first-child { width: 14.285%; }
.non-table-03 .list:nth-child(2) { width: 14.285%; }
.non-table-03 .list:nth-child(3) { width: 14.285%; }
.non-table-03 .list:nth-child(4) { width: 14.285%; }
.non-table-03 .list:nth-child(5) { width: 14.285%; }
.non-table-03 .list:nth-child(6) { width: 14.285%; }
.non-table-03 .list:nth-child(7) { width: 14.285%; }
.non-table-03 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-03 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-03 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-03 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-03 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-04 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-04 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-04 .top,
.non-table-04 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-04 .bottom .lists.bg-gray {
    background-color: #F7F7F7;
}
.non-table-04 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-04 .list .btn-edit .ic { margin-top: -4px; }
.non-table-04 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-04 .list a {
    text-decoration: underline;
}
.non-table-04 .list a.noline {
    text-decoration: none;
}
.non-table-04 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-04 .bottom .list .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-04 .bottom .list p:first-child {
    display: none;
}
.non-table-04 .list:first-child { width: 10%; }
.non-table-04 .list:nth-child(2) { width: 17%; }
.non-table-04 .list:nth-child(3) { width: 15%; }
.non-table-04 .list:nth-child(4) { width: 15%; }
.non-table-04 .list:nth-child(5) { width: 20%; }
.non-table-04 .list:nth-child(6) { width: 18%; }
.non-table-04 .list:nth-child(7) { width: 5%; }
.non-table-04 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-04 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-04 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-04 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-04 .bottom .lists .sc-btn .link {
    font-size: 15px;
    padding-left: 5px;
    text-decoration: underline;
    float: left;
}                               
.non-table-04 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-05 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-05 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-05 .top,
.non-table-05 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-05 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-05 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-05 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-05 .list .btn-edit .ic { margin-top: -4px; }
.non-table-05 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-05 .list a {
text-decoration: underline;
}
.non-table-05 .list a.noline {
text-decoration: none;
}
.non-table-05 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-05 .bottom .list .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-05 .bottom .list p:first-child {
    display: none;
}
.non-table-05 .list:first-child { width: 5%; }
.non-table-05 .list:nth-child(2) { width: 11.125%; }
.non-table-05 .list:nth-child(3) { width: 12.125%; }
.non-table-05 .list:nth-child(4) { width: 12.125%; }
.non-table-05 .list:nth-child(5) { width: 12.125%; }
.non-table-05 .list:nth-child(6) { width: 12.125%; }
.non-table-05 .list:nth-child(7) { width: 12.125%; }
.non-table-05 .list:nth-child(8) { width: 12.125%; }
.non-table-05 .list:nth-child(9) { width: 11.125%; }
.non-table-05 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-05 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-05 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-05 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-05 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-06 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-06 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-06 .top,
.non-table-06 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}

.non-table-06 .bottom .notice {
    display: block;
    padding: 10px;
}

.non-table-06 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}

.non-table-06 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-06 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-06 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-06 .list .btn-edit .ic { margin-top: -4px; }
.non-table-06 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-06 .list a {
text-decoration: underline;
}
.non-table-06 .list a.noline {
text-decoration: none;
}
.non-table-06 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-06 .bottom .list .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-06 .bottom .list p:first-child {
    display: none;
}
.non-table-06 .list:first-child { width: 16.66666%; }
.non-table-06 .list:nth-child(2) { width: 16.66666%; }
.non-table-06 .list:nth-child(3) { width: 16.66666%; }
.non-table-06 .list:nth-child(4) { width: 16.66666%; }
.non-table-06 .list:nth-child(5) { width: 16.66666%; }
.non-table-06 .list:nth-child(6) { width: 16.66666%; }
.non-table-06 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-06 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-06 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-06 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-06 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-07 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-07 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-07 .top,
.non-table-07 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-07 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-07 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-07 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-07 .list .btn-edit .ic { margin-top: -4px; }
.non-table-07 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-07 .list a {
text-decoration: underline;
}
.non-table-07 .list a.noline {
text-decoration: none;
}
.non-table-07 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-07 .bottom .list .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-07 .bottom .list p:first-child {
    display: none;
}
.non-table-07 .list:first-child { width: 17%; }
.non-table-07 .list:nth-child(2) { width: 13%; }
.non-table-07 .list:nth-child(3) { width: 17%; }
.non-table-07 .list:nth-child(4) { width: 19%; }
.non-table-07 .list:nth-child(5) { width: 17%; }
.non-table-07 .list:nth-child(6) { width: 17%; }
.non-table-07 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-07 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-07 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-07 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-07 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-08 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-08 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-08 .top,
.non-table-08 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-08 .bottom .notice {
    display: block;
    padding: 10px;
}
.non-table-08 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}
.non-table-08 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-08 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-08 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-08 .list .btn-edit .ic { margin-top: -4px; }
.non-table-08 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-08 .list a {
text-decoration: underline;
}
.non-table-08 .list a.noline {
text-decoration: none;
}
.non-table-08 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-08 .bottom .list .ic {
    font-size: 10px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-08 .bottom .list p:first-child {
    display: none;
}
.non-table-08 .list:first-child { width: 20%; }
.non-table-08 .list:nth-child(2) { width: 15%; }
.non-table-08 .list:nth-child(3) { width: 35%; }
.non-table-08 .list:nth-child(4) { width: 15%; }
.non-table-08 .list:nth-child(5) { width: 15%; }
.non-table-08 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-08 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-08 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-08 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-08 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-09 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-09 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-09 .top,
.non-table-09 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-09 .bottom .notice {
    display: block;
    padding: 10px;
}
.non-table-09 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}
.non-table-09 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-09 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-09 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-09 .list .btn-edit .ic { margin-top: -4px; }
.non-table-09 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-09 .list a {
text-decoration: underline;
}
.non-table-09 .list a.noline {
text-decoration: none;
}
.non-table-09 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-09 .bottom .list .ic {
    font-size: 15px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-09 .bottom .list p:first-child {
    display: none;
}
.non-table-09 .list:first-child { width: 6%; }
.non-table-09 .list:nth-child(2) { width: 23.5%; }
.non-table-09 .list:nth-child(3) { width: 23.5%; }
.non-table-09 .list:nth-child(4) { width: 23.5%; }
.non-table-09 .list:nth-child(5) { width: 23.5%; }
.non-table-09 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-09 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-09 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-09 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-09 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-10 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-10 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-10 .top,
.non-table-10 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-10 .bottom .notice {
    display: block;
    padding: 10px;
}
.non-table-10 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}
.non-table-10 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-10 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-10 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-10 .list .btn-edit .ic { margin-top: -4px; }
.non-table-10 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-10 .list a {
text-decoration: underline;
}
.non-table-10 .list a.noline {
text-decoration: none;
}
.non-table-10 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-10 .bottom .list .ic {
    font-size: 15px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-10 .bottom .list p:first-child {
    display: none;
}
.non-table-10 .list:first-child { width: 6%; }
.non-table-10 .list:nth-child(2) { width: 22%; }
.non-table-10 .list:nth-child(3) { width: 22%; }
.non-table-10 .list:nth-child(4) { width: 22%; }
.non-table-10 .list:nth-child(5) { width: 22%; }
.non-table-10 .list:nth-child(6) { width: 6%; }
.non-table-10 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-10 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-10 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-10 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-10 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-11 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-11 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-11 .top,
.non-table-11 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-11 .bottom .notice {
    display: block;
    padding: 10px;
}
.non-table-11 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}
.non-table-11 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-11 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-11 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-11 .list .btn-edit .ic { margin-top: -4px; }
.non-table-11 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-11 .list a {
text-decoration: underline;
}
.non-table-11 .list a.noline {
text-decoration: none;
}
.non-table-11 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-11 .bottom .list .ic {
    font-size: 15px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-11 .bottom .list p:first-child {
    display: none;
}
.non-table-11 .list:first-child { width: 6%; }
.non-table-11 .list:nth-child(2) { width: 29.333333%; }
.non-table-11 .list:nth-child(3) { width: 29.333333%; }
.non-table-11 .list:nth-child(4) { width: 29.333333%; }
.non-table-11 .list:nth-child(5) { width: 6%; }
.non-table-11 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-11 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-11 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-11 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-11 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-12 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-12 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-12 .top,
.non-table-12 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-12 .bottom .notice {
    display: block;
    padding: 10px;
}
.non-table-12 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}
.non-table-12 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-12 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-12 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-12 .list .btn-edit .ic { margin-top: -4px; }
.non-table-12 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-12 .list a {
text-decoration: underline;
}
.non-table-12 .list a.noline {
text-decoration: none;
}
.non-table-12 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-12 .bottom .list .ic {
    font-size: 15px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-12 .bottom .list p:first-child {
    display: none;
}
.non-table-12 .list:first-child { width: 10%; }
.non-table-12 .list:nth-child(2) { width: 45%; }
.non-table-12 .list:nth-child(3) { width: 45%; }
.non-table-12 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-12 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-12 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-12 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-12 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-13 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-13 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-13 .top,
.non-table-13 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-13 .bottom .notice {
    display: block;
    padding: 10px;
}
.non-table-13 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}
.non-table-13 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-13 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-13 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-13 .list .btn-edit .ic { margin-top: -4px; }
.non-table-13 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-13 .list a {
text-decoration: underline;
}
.non-table-13 .list a.noline {
text-decoration: none;
}
.non-table-13 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-13 .bottom .list .ic {
    font-size: 15px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-13 .bottom .list p:first-child {
    display: none;
}
.non-table-13 .list:first-child { width: 23.5%; }
.non-table-13 .list:nth-child(2) { width: 23.5%; }
.non-table-13 .list:nth-child(3) { width: 23.5%; }
.non-table-13 .list:nth-child(4) { width: 23.5%; }
.non-table-13 .list:nth-child(5) { width: 6%; }
.non-table-13 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-13 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-13 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-13 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-13 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-13 .bottom .list .interbank-account-info .interbank-account-detail {
    white-space: nowrap;
    top: 28px;
}
.non-table-13 .bottom .list .interbank-account-info .arrow { top: 20px; }
.non-table-13 .bottom .list .interbank-account-info .interbank-account-detail .show {
    display: block !important;
}
.non-table-14 { 
    width: 100%;
    display: inline-block;
    border: 1px solid #eee;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-14 .top {
    width: 100%;
    display: inline-block;
    background-color: #00a850;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.non-table-14 .top,
.non-table-14 .bottom {
    width: 100%;
    display: table;
    table-layout: fixed;
    font-size: 0;
}
.non-table-14 .bottom .notice {
    display: block;
    padding: 10px;
}
.non-table-14 .bottom .notice p {
    display: block;
    font-size: 15px;
    line-height: 1.4;
}
.non-table-14 .bottom .lists.full {
    padding: 10px 0;
    font-size: 15px;
}
.non-table-14 .bottom .lists:nth-child(even) { background-color: #F7F7F7; }
.non-table-14 .bottom .lists:nth-child(odd) { background-color: #fff; }
.non-table-14 .list {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-weight: bold;
    padding: 10px 5px;
    text-align: center;
    font-size: 14px;
    word-break: break-word;
}
.non-table-14 .list .btn-edit .ic { margin-top: -4px; }
.non-table-14 .list .btn-close .ic {
    margin-right: 0 !important;
    font-size: 10px;
    margin-top: -4px;
    display: inline-block;
}
.non-table-14 .list a {
text-decoration: underline;
}
.non-table-14 .list a.noline {
text-decoration: none;
}
.non-table-14 .bottom .list {
    color: #777;
    font-weight: normal;
    word-break: break-word;
}
.non-table-14 .bottom .list .ic {
    font-size: 15px;
    vertical-align: baseline;
    margin-right: 5px;
}
.non-table-14 .bottom .list p:first-child {
    display: none;
}
.non-table-14 .list:first-child { width: 6%; }
.non-table-14 .list:nth-child(2) { width: 14.66666%; }
.non-table-14 .list:nth-child(3) { width: 14.66666%; }
.non-table-14 .list:nth-child(4) { width: 14.66666%; }
.non-table-14 .list:nth-child(5) { width: 14.66666%; }
.non-table-14 .list:nth-child(6) { width: 14.66666%; }
.non-table-14 .list:nth-child(7) { width: 14.66666%; }
.non-table-14 .list:nth-child(8) { width: 6%; }

@media (min-width: 768px) {
    .non-table-14.cols-7 .list:nth-child(2) { width: 17.6%; }
    .non-table-14.cols-7 .list:nth-child(3) { width: 17.6%; }
    .non-table-14.cols-7 .list:nth-child(4) { width: 17.6%; }
    .non-table-14.cols-7 .list:nth-child(5) { width: 17.6%; }
    .non-table-14.cols-7 .list:nth-child(6) { width: 17.6%; }
    .non-table-14.cols-7 .list:nth-child(7) { width: 6%; }
    .non-table-14.cols-7 .list:nth-child(8) { width: 0%; }
}
@media (min-width: 768px) {
    .non-table-14.cols-9 .list:nth-child(2) { width: 10.57%; }
    .non-table-14.cols-9 .list:nth-child(3) { width: 12.57%; }
    .non-table-14.cols-9 .list:nth-child(4) { width: 12.57%; }
    .non-table-14.cols-9 .list:nth-child(5) { width: 12.57%; }
    .non-table-14.cols-9 .list:nth-child(6) { width: 10.57%; }
    .non-table-14.cols-9 .list:nth-child(7) { width: 11.57%; }
    .non-table-14.cols-9 .list:nth-child(8) { width: 18.57%; }
    .non-table-14.cols-9 .list:nth-child(9) { width: 3%; }
}
@media (min-width: 768px) {
    .non-table-14.cols-9.equal .list { width: 12.125%; }
    .non-table-14.cols-9.equal .list:nth-child(9) { width: 3%; }
}

.non-table-14.small p,
.non-table-14.small label,
.non-table-14.small span {
    font-size: 12px;
}

.non-table-14.small button label {
    font-size: 11px;
}

.input.non-table-input {
    max-width: 300px;
    margin: auto;
}
.input.non-table-input input {
    border: none;
    color: #777;
    background-color: #f7f7f7;
}
.input.non-table-input .select.select2-parent {
    background-color: #f7f7f7;
    border-radius: 5px;
}
.input.non-table-input .select2-container--default .select2-selection--single {
    border: none;
    overflow: visible;
    background-color: transparent;
}
.input.non-table-input .select2-container .select2-selection--single .select2-selection__rendered {
    color: #777;
    display: table-cell;
    overflow: visible;
    line-height: 1.2;
    padding-right: 20px;
    height: 40px;
    vertical-align: middle;
    background-color: transparent;
}
.non-table-input .file-upload-action .btn .ic-pencil {
    display: none;
}
.non-table-input .file-upload-wrapper .file-upload-action .btn {
    width: 75px;
    height: 25px;
    line-height: 25px;
}
.non-table-input .custom-file-upload.show-detail {
    float: right;
    width: 94px;
}

.non-table-input .detail-show {
    padding-right: 25px;
}

.non-table-input .detail-show a {
    text-decoration: unset;
}

@media (max-width: 767px) {
    .input.non-table-input:not(.table-input) {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
        height: 40px;
    } 

    .input.non-table-input:not(.table-input) .select.select2-parent {
        max-width: 200px;
        margin-left: auto;
        padding: 10px;
    }
    .input.non-table-input:not(.table-input) .select2-container--default .select2-selection--single {
        height: 20px;
    }
    
    .input.non-table-input:not(.table-input) .select2-container .select2-selection--single .select2-selection__rendered {
        height: 20px;
    }    
    .input.non-table-input:not(.table-input) .select-arrow .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 20px;
        width: 20px;
    }    
    .input.non-table-input:not(.table-input) .select-arrow .select2-container--default .select2-selection--single .select2-selection__arrow ::before {
        line-height: 20px;
    }    
}

.non-table-14 .bottom .lists .detail {
    float: left;
    font-size: 15px;
    margin-top: 20px;
    margin-left: 10px;
}
.non-table-14 .bottom .lists .paginations-wrapper {
    width: 100%;
    display: inline-block;
    padding-right: 5px;
}
.non-table-14 .bottom .lists .sc-btn {
    width: 100%;
    display: inline-block;
    text-align: right;
    padding: 10px 5px 10px 0;
}
.non-table-14 .bottom .lists .sc-btn .btn {
    margin-left: 5px;
}
.non-table-14 .bottom .lists .paginations {
    float: right;
    clear: inherit;
    margin-top: 10px;
    margin-bottom: 10px;
}
.non-table-14 .bottom .list .interbank-account-info .interbank-account-detail {
    white-space: nowrap;
    top: 28px;
}
.non-table-14 .bottom .list .interbank-account-info .arrow { top: 20px; }
.non-table-14 .bottom .list .interbank-account-info .interbank-account-detail .show {
    display: block !important;
}
.interbank-account-detail .menu-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    width: 100%;
    white-space: nowrap;
}
@media (min-width: 768px) {
    .non-table-4-col .list { width: 25% !important; }

    .non-table-5-col .list:first-child { width: 6%; }
    .non-table-5-col .list:nth-child(2) { width: 22%; }
    .non-table-5-col .list:nth-child(3) { width: 22%; }
    .non-table-5-col .list:nth-child(4) { width: 22%; }
    .non-table-5-col .list:nth-child(5) { width: 22%; }
    .non-table-5-col .list:nth-child(6) { width: 6%; }
}
.non-table-rounded, .non-table-rounded .bottom .lists:last-child {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.non-table-paginations {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 5px;
    margin-top: 10px;
    font-size: 12px;
}
@media (max-width: 768px) {
    .non-table-paginations {
        flex-direction: column;
        justify-content: center;
        align-items: flex-end;
    }
}
/* Non Table - END */

/* New Style for Inline - START */
.btn.btn-small-fix { 
    width: 150px !important;
    height: 40px !important;
    line-height: 40px !important;
}
.btn.btn-small-fix-wrapped {
    width: unset !important;
    min-width: 150px;
    height: 40px !important;
    line-height: 1.25 !important;
    white-space: normal;
    padding-top: 2px;
    padding-bottom: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.select-custom.full,
.select-custom.full select,
.select-custom.full .select2-container { width: 100% !important; }
.display-none { display: none !important; }
.display-block { display: block !important; }
.white-popup-block .action.more-t {
    margin-top: 20px; 
    width: 100%; 
    display: inline-block;
}
.popup-bg-gray { background-color: #F4F3F9; border-radius: 10px; padding: 30px; }
.qr-summary.qr-fixedwidth {
    max-width: 450px;
    margin: auto;
    text-align: left;
}
.qr-summary h3 {
    font-size: 20px;
}
.ver-baseline {
    vertical-align: baseline !important;
}
.full { width: 100% !important; }
.space-btn-draft {
    margin: 10px 0 30px 0;
}
.space-btw-btn-draft { margin-left: 15px; }
.popup-content-style .mfp-content .sc-ct-bg-white.no-fix-height,
.summary-wrapper.no-fix-height {
    height: auto;
}
.clear {
    clear: both;
}
.otp-again .ic {
    vertical-align: baseline;
    margin-right: 5px;
}
/* New Style for Inline - END */
.remark {
    padding-top: 10px;
    font-weight: bold;
    font-size: 14px;
}
.remark .list {
    margin-top: 5px;
    margin-left: 16px;
    margin-bottom: 10px;
}
.remark .list li {
    list-style-type: none;
    font-weight: normal;
    margin-bottom: 6px;
}
.remark .list li:last-child {
    margin-bottom: 0;
}
.remark .list-step-two {
    margin-top: 5px;
    margin-left: 16px;
    margin-bottom: 10px;
}
.remark .list-step-two li {
    list-style-type: none;
    font-weight: normal;
    margin-bottom: 6px;
}
.remark .list-step-two li:last-child { margin-bottom: 0; }
.remark .ct-normal {
    font-weight: normal;
}

.note-small {
    font-size: 13px;
}

/* Products Register - Prompt Pay - START */
.transfer-wrapper.other-service-wrapper {
    padding: 40px 20px 20px 20px;
    position: relative;
}
.transfer-wrapper.other-service-wrapper .remove-link-wrapper {
    position: absolute;
    top: 15px;
    right: 20px;
}
.transfer-wrapper.other-service-wrapper .remove-link-wrapper.more-t {
    top: 30px;
}
.transfer-wrapper.other-service-wrapper .remove-link-wrapper .link-remove {
    font-size: 13px;
    color: #999;
    font-weight: bold;
}
.transfer-wrapper.other-service-wrapper .remove-link-wrapper .link-remove .ic {
    font-size: 12px;
    vertical-align: baseline;
}
.transfer-wrapper.other-service-wrapper .name-list {
    width: 100%;
    position: relative;
    margin-top: 15px;
}
.transfer-wrapper.other-service-wrapper .name-list .name {
    position: absolute;
    top: 0;
    left: 0;
}
.transfer-wrapper.other-service-wrapper .name-list .note {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 12px;
}
.prompt-pay-lists {
    width: 100%;
    display: table;
    font-size: 0;
    table-layout: fixed;
    background-color: #F6F5FA;
    padding: 20px;
    border-radius: 10px;
    margin-top: 15px;
    position: relative;
}
.prompt-pay-lists.unsuccessfully {
    width: 50%;
    margin: auto;
}
.prompt-pay-lists .left {
    width: 50%;
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;
}
.transfer-wrapper.other-service-wrapper .prompt-pay-lists .left { font-size: 16px; }
.prompt-pay-lists .image {
    width: 50px;
    display: inline-block;
    vertical-align: middle;
}
.prompt-pay-lists .caption {
    padding-left: 15px;
    display: inline-block;
    vertical-align: middle;
}
.prompt-pay-lists .caption .number {
    font-size: 18px;
    color: #30B671;
    font-weight: bold;
}
.prompt-pay-lists .caption.edit-id {
    width: 200px;
}
.prompt-pay-lists .caption .alert { 
    font-size: 10px;
    position: absolute;
    bottom: -18px;
}
.prompt-pay-lists .right {
    width: 50%;
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;
    text-align: center;
}
.prompt-pay-lists .right.no-center {
    text-align: left;
    padding-left: 30px;
}
.prompt-pay-lists .right.more-p-r {
    padding-right: 40px;
}
.prompt-pay-lists .right .action {
    margin-top: 5px;
}
.prompt-pay-lists-hv-icon img { vertical-align: bottom; border-radius: 50%; }
.transfer-wrapper.other-service-wrapper .action {
    width: 100%;
    display: inline-block;
}
.transfer-wrapper.other-service-wrapper .btn {
    width: 150px;
}
.transfer-wrapper.other-service-wrapper .btn.btn-fixed {
    width: auto;
    height: 32px;
    line-height: 32px;
}
.arrow-right {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.prompt-pay-lists-wrapper {
    padding-left: 30px;
}
.prompt-pay-lists .choice {
    position: absolute;
    left: -30px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}
.prompt-pay-lists .choice input.choice-input + .choice-name {
    min-height: 20px;
    min-width: 20px;
}
.prompt-pay-lists-alert {
    margin-top: 10px;
    font-size: 12px;
    color: #FF0000;
}
.prompt-pay-lists .edit {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 20px;
}
.prompt-pay-lists .edit .ic {
    font-size: 20px;
    color: #707070;
    margin-right: 5px;
}
.prompt-pay-lists .edit:last-child .ic {
    margin-right: 0;
}
.prompt-pay-lists .edit.more-t {
    top: 60%;
}
/* Products Register - Prompt Pay - END */

/* Announcement Bar - START */
.announcement-bar {
    width: 100%;
    height: 45px;
    line-height: 45px;
    background-color: #4DCD8A;
    position: fixed;
    z-index: 999;
    padding: 0 40px;
    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;
}
.announcement-bar .left {
    font-size: 14px;
    color: #fff;
    width: 85%;
    position: relative;
}
.announcement-bar .left > p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    transition: all .3s ease-in-out;
    line-height: 1.6;
}
.announcement-bar .left > p.show {
    white-space: pre-wrap;
    margin-bottom: 10px;
}
.announcement-bar .left .ic {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    display: none;
}
.announcement-bar .right {
    width: 15%;
    text-align: right;
}
.announcement-bar .right .link {
    font-size: 14px;
    font-weight: normal;
    color: #fff;
    text-decoration: underline;
}
.announcement-bar .right .ic {
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    margin-left: 10px;
    vertical-align: baseline;
}
.main.main-hv-announcement {
    padding-top: 40px;
    transition: all .3s ease-in-out;
}
.main.main-hv-announcement .column-main .header {
    top: 45px;
    transition: all .3s ease-in-out;
}
.popup-announcement-style .mfp-content .white-popup-block { padding: 0; }
.popup-announcement-style .mfp-content {
    max-width: 650px;
    background-color: #fff;
    padding: 40px;
    position: relative;
    -webkit-font-smoothing: antialiased;
    border-radius: 6px;
    box-shadow: inset 0 7px 0 #61D699;
}
.popup-announcement-style.mfp-close-btn-in .mfp-close {
    color: transparent;
}
.popup-announcement-style .mfp-content .popup-modal-dismiss {
    position: absolute;
    top: 0;
    right: -40px;
    width: 30px;
    height: 30px;
    background-color: transparent;
    border: 1px solid #fff;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    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;
}
.popup-announcement-style .mfp-content .popup-modal-dismiss .ic {
    font-size: 10px;
    color: #fff;
    line-height: 1;
}
#popup-announcement .content .announcement {
    border-bottom: 1px solid #61D699;
    padding-bottom: 15px;
    height: 100vh;
    max-height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 10px;
}
#popup-announcement .content .announcement::-webkit-scrollbar {
    width: 5px;
    border-radius: 50px;
    background-color: #999;
}
#popup-announcement .content .announcement::-webkit-scrollbar-track,
#popup-announcement .content .announcement::-webkit-scrollbar-thumb {
    border-radius: 50px;
    background-color: #efefef;
}
#popup-announcement .content .announcement::-webkit-scrollbar-track {
    background-color: #efefef;
    border-radius: 50px;
}
#popup-announcement .content .announcement::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: #999;
}
#popup-announcement .content .announcement::-webkit-scrollbar-thumb:hover {
    width: 5px;
    background-color: #efefef;
}
#popup-announcement .content .announcement .sc-heading { margin-bottom: 20px; }
#popup-announcement .content .announcement .heading {
    font-size: 18px;
    color: #333;
    line-height: 1.3;
}
#popup-announcement .content .announcement .date {
    font-size: 11px;
    color: #707070;
    margin-top: 10px;
}
#popup-announcement .content .announcement .detail p {
    margin-bottom: 20px;
    font-size: 13px;
    color: #707070;
}
.announcemens-slider .slick-slide {
    outline: 0;
}
.announcemens-slider .slick-dots li {
    width: 8px;
    height: 8px;
}
.announcemens-slider .slick-dots li button {
    width: 8px;
    height: 8px;
}
.announcemens-slider .slick-dots li button:before {
    width: 8px;
    height: 8px;
    line-height: 8px;
    background-color: #999;
    content: "";
    border-radius: 50%;
}
.announcemens-slider .slick-dots li.slick-active button:before {
    background-color: #4DCD8A;
}
.announcemens-slider .slick-prev, 
.announcemens-slider .slick-next {
    display: none;
}

/* .announcement-content-single {
    height: 100vh;
    max-height: 400px;
    margin-bottom: 0;
} */

.announcement-content-single .sc-heading {
    margin-bottom: 10px;
}

.announcement-content-single  .sc-heading .desc {
    color: #707070;
    font-size: 13px;
}
.announcement .link-more {
    text-decoration: underline;
    font-size: 13px;
}

.announcement .link-more:after {
    display: none;
}
#popup-announcement .content .announcement .announcement-content-single .sc-heading {
    margin-bottom: 0;
}
/* Announcement Bar - END */

/* Select Custom Modify - START */
.select-custom-modify-1 {
    width:38px !important;
    margin-top: -6px;
}
.select-custom-modify-2 {
    font-size:13px;
    font-weight: bold;
    position: absolute;
    top: -6px;
    left:45px;
}
.select-custom-modify-3 { 
    font-size:13px; 
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
    position: absolute;
    top: 8px;
    left:45px;
}
.select-custom-modify-4 { 
    width: auto;
    position: absolute;
    /* right: 30px; */
    right: 0;
    top: -10px; 
    text-align: right;
}
.select-custom-modify-41 {
    font-size:12px;
    line-height: 1;}
.select-custom-modify-42 {
    font-weight: bold;
    font-size:14pt;
    line-height: 1;
    display: inherit;
    margin-top: -15px;
    font-family: 'notosansthai', Helvetica, Arial, sans-serif;
}
.custom-select-wrapper span {
    position: static;
    line-height: 1.2;
    display: block;
}
.select-custom-left-col {
    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;
}

.custom-select-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
}

.select-cutom-inner-txt {
    margin-left: 10px;
}

.select-custom-right-col .select-custom-modify-4 {
    position: static;
    width: 100%;
    display: block;
}

.select-custom-right-col .select-custom-modify-4 span {
    margin: 0;
}

.select-custom-right-col .select-custom-modify-4 span:first-child {
    margin-bottom: 2px;
}
.select2-results__option .select-custom-right-col {
    display: none;
}
/* Select Custom Modify - END */

#popup-more-detail .content .list { margin-left: 20px; }
#popup-more-detail .content .list li {
    list-style-type: disc;
}
/*
#popup-more-detail { padding-right: 10px; }
#popup-more-detail .content {
    height: 500px;
    overflow-x: hidden;
    overflow-y: auto;
}
#popup-more-detail .content::-webkit-scrollbar {
    width: 5px;
    border-radius: 50px;
    background-color: #999;
}
#popup-more-detail .content::-webkit-scrollbar-track,
#popup-more-detail .content::-webkit-scrollbar-thumb {
    border-radius: 50px;
    background-color: #efefef;
}
#popup-more-detail .content::-webkit-scrollbar-track {
    background-color: #efefef;
    border-radius: 50px;
}
#popup-more-detail .content::-webkit-scrollbar-thumb {
    width: 5px;
    background-color: #999;
}
#popup-more-detail .content::-webkit-scrollbar-thumb:hover {
    width: 5px;
    background-color: #efefef;
}*/

/* Custom Text */
.error-qr-time {
    margin-top: 20px;
    margin-bottom: 15px;
}
.list .choice {
    text-align: left;
    padding-left: 20px;
}
.table-bottom {
    margin-top: 30px;
    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;
}

.table-bottom .action { margin-top:0; }

.summary-qr-desc-top { max-width: 394px; margin: 30px auto 0 50px;}
.no-click {
    pointer-events: none !important;
}
.step-two-heading > h3 {
    margin-bottom: 10px;
    font-size: 20px;
}
.step-two-heading > .heading-h4 {
    font-size: 18px;
}
.popup-content-style-type popup-style-alert .mfp-content {
    background: transparent;
}

.popup-content-style-type.popup-style-alert .mfp-content {
    background: transparent;
    padding: 0;
    max-width: 100%;
}

.popup-content-style-type.popup-style-alert .mfp-content .transfer-wrapper > div {
    padding: 30px;
    background: #fff;
    border-radius: 6px;
    max-width: 750px;
    margin: 0 auto;
}
.popup-content-style-type.popup-style-alert .transfer-wrapper {
    max-width: 100%;
    background: transparent;
}
.popup-content-style-type.popup-style-alert .mfp-content .transfer-wrapper > div.content-style-alert {
    max-width: 470px;
    padding: 40px 30px;
}

.popup-content-style-type.popup-style-alert a.popup-modal-dismiss {
    display: none;
}

.popup-content-style-type.popup-style-alert .mfp-content .transfer-wrapper > div.content-style-alert .action {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
}

.popup-content-style-type.popup-style-alert .mfp-content .transfer-wrapper > div.content-style-alert .action.a-center {
    justify-content: center;
}

.remark-sms {
    margin-top: 25px;
    font-size: 12px;
    color: #999;
}

.remark-sms ol > li {
    display: list-item;
    line-height: 1.4em;
    margin-bottom: 5px;
}

.remark-sms > ol {
    list-style: decimal;
    padding-left: 1.4em;
    margin-top: 0;
}

.remark-sms > p {
    margin-bottom: 5px;
}
.visible-device-qr {
    display: none;
}

.bg-theme-dark {
    background: linear-gradient(180deg, rgba(70,89,104,1) 0%, rgba(35,45,52,1) 100%);
}
.bg-theme-white {
    background: #fff;
}
.header-fullpage .logo {
    text-align: center;
}

.header-fullpage .logo img {
    height: 45px;
}

.header-fullpage {
    padding-top: 40px;
    padding-left: 50px;
    padding-right: 30px;
}
.sc-inner-fullpage {
    min-height: 100vh;
}
.mfp-container {
    padding-top: 20px;
}
ol.list-num {
    list-style: decimal;
    padding-left: 1.4em;
    font-size: 90%;
}

ol.list-num > li {
    margin-bottom: 4px;
}
ol.list-none {
    list-style: none;
    font-size: 90%;
}

ol.list-none > li {
    margin-bottom: 4px;
}


/* Table */

tr.th-mobile {
    display: none;
}

.list-account-bg {
    background-color: #F4F3F9;
    border-radius: 10px;
    padding: 10px 30px;
}
.list-account {
    display: block;
}

.list-account-item {
    display: flex;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid #E5E4E8;
    justify-content: space-between;
}

.list-account-left {
    width: 30%;
    font-size: 13px;
    color: #999;
}

.list-account-right {
    text-align: right;
    width: 70%;
    font-size: 14px;
}

.list-account-item:last-child {
    border-bottom: 0;
}

.popup-heading-icon {
    background-color: #4DCD8A;
    padding: 10px;
    border-radius: 50%;
    margin-top: 0;
    color: #fff;
    margin-right: 10px;
    font-size: 15px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 10px;
    font-size: 20px;
}

.icon.less-bt.icon-center .ic {
    margin: 0 auto !important;
}

.f-label-block {
    display: inline-block;
    margin-bottom: 10px;
}

.heading-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
}

.heading-img img {
    margin-right: 10px;
}
.card-two-col {
    overflow: hidden;
}

.card-two-col > .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.card-two-col > .row:before,
.card-two-col > .row:after {
    display: none;
}

.sc-heading-group {
    margin-bottom: 48px;
}

.img-col-bg {
    height: 100%;
    object-fit: cover;
}

.popup-step h3 {
    font-size: 20px;
}

.list .approver-name {
    color: #777;
    display: block;
    text-align: center;
}

.error-msg-required-notify {
    font-size: 12px;
    font-weight: 400;
}