body,
html {
    /* font-family: "Sukhumvit Set"; */
    font-family: "Kanit Regular", Arial, sans-serif;
    font-weight: 200;
    /* letter-spacing: 1px; */
    /* background: #081c2a; */
    font-smooth: always;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    position: relative;
    background: url(/assets/img/bg.png) top / cover repeat-y !important;
    background: rgb(10, 49, 77);
    background: linear-gradient( 180deg, rgba(10, 49, 77, 1) 0%, rgba(20, 18, 18, 1) 100%);
}

p {
    font-family: "Kanit Regular";
    font-weight: 200;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    /* font-family: "Kanit Bold"; */
    font-family: "Kanit Regular";
    font-weight: 700;
}

.logoEcg img {
    max-height: 70px;
    transition: all 0.3s ease 0s;
}

.navbarMain {
    background: #223a71;
    user-select: none;
}

.navbarMain.navbar-light .navbar-nav .nav-link {
    font-size: 1.125rem;
    color: #ffffff70;
    padding-left: 20px;
    padding-right: 20px;
    /* font-family: 'Kanit Regular'; */
    font-family: "Kanit Regular";
    font-weight: 200;
}

.navbarMain.navbar-light .navbar-nav .nav-link.active {
    color: #fff;
    /* font-family: 'Kanit Regular'; */
    font-family: "Kanit Regular";
    font-weight: 400;
}

.menuProfile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 55px;
    margin-right: 35px;
}

.menuProfile svg {
    color: #fff;
    font-size: 1.6rem;
}

.menuProfile img {
    height: 60px;
}

.navbarMain.navbar-light .navbar-nav {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.notifications {
    position: relative;
    margin-right: 30px;
}

.notifications .colorRed {
    width: 17px;
    height: 17px;
    background: #eb2f06;
    position: absolute;
    right: -8px;
    border-radius: 100px;
    top: -2px;
    border: 3px solid #223a71;
}

.profileDropdown {
    margin-left: 30px;
    margin-top: -12px;
}

.profileDropdown svg {
    font-size: 1.8rem;
}

footer {
    background: #08142a;
    padding-right: 20px;
    padding-left: 20px;
}

footer a {
    text-decoration: none;
    font-size: 1.2rem;
}

footer p {
    color: #fff !important;
    text-transform: uppercase;
    font-size: 1.2rem;
}

.mainBody {
    height: auto;
    padding-top: 100px;
    max-height: unset;
    padding-bottom: 130px;
}

.mainBody .breadCrumbNav {
    padding-left: 3rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.mainBody .breadCrumbNav li {
    font-size: 1.25rem;
    color: #fff;
    font-weight: 100;
}

.mainBody .breadCrumbNav li a {
    color: #6f7980;
    text-decoration: none;
}

.mainBody .navBarBack {
    padding-left: 3rem;
}

.mainBody .navBarBack a {
    font-size: 1.5rem;
    font-weight: 600;
    color: #4187f3;
    text-decoration: none;
}

.mainBody .contentProfile {
    margin-top: -5.5rem;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}

.mainBody .contentProfile .profileImageCard {
    padding: 4.25rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.mainBody .contentProfile .profileImageCard .profileImage {
    text-align: center;
    width: 100%;
}

.mainBody .contentProfile .profileImageCard .profileImage .borderImg {
    border: 12px solid rgba(149, 142, 118, 0.2);
    border-radius: 100%;
    margin: 0 auto;
    width: 15rem;
    height: 15rem;
    position: relative;
}

.mainBody .contentProfile .profileImageCard .profileImage .borderImg>img {
    width: 100%;
    border-radius: 100%;
    background: #4188f368;
    padding: 12px;
}

.mainBody .contentProfile .profileImageCard .profileImage .borderImg .btnUploadIcon {
    width: 3.125rem;
    height: 3.125rem;
    background: #081c2a;
    border-radius: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    right: 0.225rem;
    bottom: 0.225rem;
}

.mainBody .contentProfile .profileImageCard .profileImage .borderImg .btnUploadIcon img {
    width: 1.375rem;
    height: 1.375rem;
}

.mainBody .contentProfile .profileImageCard h3 {
    font-size: 2.625rem;
    font-weight: bold;
    margin-top: 2rem;
    color: #fff;
}

.mainBody .contentProfile .documentCard {
    padding: 30px;
    color: #fff;
}

.mainBody .contentProfile .documentCard .row {
    padding-bottom: 20px;
    margin-bottom: 25px;
    cursor: pointer;
}

.mainBody .contentProfile .documentCard .row h4 {
    font-weight: bold;
    font-size: 1.5rem;
}

.mainBody .contentProfile .documentCard .row .arrowRight {
    text-align: right;
    font-size: 1.5rem;
}

.mainBody .boxInput {
    padding: 30px 80px;
}

.mainBody .boxInput .input-group {
    position: relative;
}

.mainBody .boxInput .input-group input {
    background: transparent;
    border: none;
    color: #fff;
    border-bottom: 1px solid #585e63;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-left: 55px;
    border-radius: 0;
    font-size: 1.125rem;
    height: 4rem;
    padding-right: 40px;
    mix-blend-mode: difference;
    font-weight: 200;
}

.mainBody .boxInput .input-group .iconFront {
    height: 20px;
    position: absolute;
    top: 20px;
    left: 10px;
}

.mainBody .boxInput .input-group .iconLine {
    height: 23px;
    position: absolute;
    top: 20px;
    left: 10px;
}

.mainBody .boxInput .input-group .iconFront.key {
    width: 26px;
    height: auto;
}

.mainBody .boxInput .input-group .iconBack {
    height: 20px;
    position: absolute;
    top: 20px;
    right: 10px;
}

.mainBody .box-title-center.subTitle h3 {
    font-size: 1.75rem !important;
}

.mainBody .cardGlass {
    position: relative;
    /* From https://css.glass */
    background: #425edd14;
    border-radius: 20px;
    /* -webkit-box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); */
    /* box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); */
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    /* padding-bottom: 1.5rem; */
    margin-bottom: 2.5rem;
    padding: 1rem;
}

.box-home-my-port {
    border: 3px solid rgba(255, 255, 255, 0.05);
}

.cardGlassCalendar {
    margin-top: 1rem !important;
    padding: 2rem !important;
}

.mainBody .underline {
    border-bottom: 1px solid #5b5d61;
}

.profileEap .data2 {
    margin-top: 2rem;
}


/*# sourceMappingURL=styles.css.map */

.slick-initialized .slick-slide {
    height: auto;
}

.doc-title {
    font-weight: 700;
}


/* Contract Detail */

#display-image {
    width: 400px;
    height: 225px;
    border: 1px solid black;
    background-position: center;
    background-size: cover;
}

.clubCorrelation a {
    color: #4187f3;
    /* text-decoration: underline; */
}

.center {
    text-align: center;
}

.modal-backdrop {
    position: relative;
}


/* .contractDetail .modal-body {
    padding: 0px !important;
} */


/* .modal-dialog {
    max-width: 100% !important;
    margin: 0 auto !important;
}
.modal-dialog {
    position: relative;
    width: auto ;
    pointer-events: none;
} */

.modal-modal {
    background: rgba(80, 80, 80, 0.8) !important;
    backdrop-filter: blur(8px);
}

.center-al {
    text-align: center;
}

.contractDetail .box-title-center {
    /* margin-top: 75px; */
    margin-top: 0;
}

.contentContract {
    margin-top: 1rem;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
}

#contract_ecg .close span {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.5;
}

#contract_ecg .close {
    border-radius: 50%;
    padding: 1rem;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
}

body.modal-open {
    height: unset;
    overflow-y: hidden;
}

.contractDetail #staticBackdrop .modal-body {
    height: 100%;
    overflow-x: hidden;
}

.background_success {
    background: rgba(27, 61, 60) !important;
    border-radius: 1rem;
    padding: 2rem;
}

.header_success {
    font-size: 25px;
    color: #0e9282;
    font-weight: 600;
}

.body_success {
    font-size: 20px;
}

.background_success .backattach-sec {
    background: #ffffff;
    font-weight: 600;
    color: black !important;
}

.model_font_weight {
    font-weight: 600;
}

.model_img_ful {
    width: 100%;
    height: auto;
}

.contractDetail .nav-progress {
    background: rgb(127 127 127 / 10%);
    border-radius: 1rem;
}

#data-content {
    margin-bottom: 2rem;
}

.slick-slider {
    display: flex;
}

.investor-port-mainbody .cardGlass .title-glass {
    padding: 3.85rem 3rem;
    font-weight: bold;
    color: #4187f3;
    font-size: 2rem;
}


/* .documentCard {
    width: 70%;
    margin: 0 auto;
} */

.boxChartsplit {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 166px;
    padding-left: 4rem;
    padding-right: 4rem;
}

.eapPortChart {
    margin-top: 5rem;
}

.chartCommissMain {
    margin-bottom: -170px;
    margin-top: 115px;
    padding: 0 5rem;
}

.eapPortChart .btn-mission {
    height: 50px;
    min-width: 80px;
    background-color: transparent;
    color: #fff;
    border-color: #fff;
    padding-left: 1rem;
    padding-right: 1rem;
    font-size: 1.5rem;
    font-weight: 500;
}

.investDesign .nav-investment .nav-item .nav-link,
.investDesign .nav-justified .nav-item .nav-link {
    width: 100%;
    height: 45px;
    font-size: 1.125rem;
    font-family: "Kanit Regular";
}

.contractDetail .cardGlass {
    /* padding: 3rem; */
    padding: 5rem;
}

.position-card-ivp h4,
.position-card-ivp h3 {
    font-family: "Kanit Regular";
}

.position-card-ivp h3 {
    font-size: 2rem !important;
    font-weight: 700;
}

.agentPort .box-image-grag-drop .cardGlass .title-team-port,
.agentPort .box-image-grag-drop .cardGlass h2 {
    font-family: "Kanit Regular";
}

.agentPort .box-image-grag-drop .cardGlass h4,
.agentPort .box-image-grag-drop .cardGlass p {
    font-family: "Kanit Light";
    font-weight: 500;
    opacity: 0.75;
}

.mainBody .clubHomeImageCard .title-right h1 {
    font-family: "Kanit Medium";
}


/* .mainBodyHomeInside ,.agentPort,.investDesign,.invReservation,.mainCategory,.mainInterested,.invmentDetail {
    padding-bottom: 200px !IMPORTANT;
} */

.dropzone img,
.dropzone div {
    pointer-events: none !important;
    object-fit: cover !important;
    border-radius: unset !important;
    max-height: unset !important;
}

.swal2-container.swal2-center>.swal2-popup {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    justify-self: center;
    background-size: cover !important;
    background-position: center !important;
    padding: 1.25rem;
    background: url(/assets/img/swal_bg.png);
    background-color: #fff;
}

.swal2-popup {
    display: none;
    position: relative;
    box-sizing: border-box;
    grid-template-columns: minmax(0, 100%);
    width: 28em;
    max-width: 100%;
    padding: 0 0 1.25em;
    border: none;
    border-radius: 20px;
    background: #fff;
    color: #545454;
    font-family: inherit;
    font-size: 1rem;
    /* min-height: 480px; */
}

.swal2-actions {
    width: 100% !important;
}

.swal2-styled.swal2-confirm {
    border: 0;
    border-radius: 5px;
    background: initial;
    background-color: #4187f3;
    color: #fff;
    font-size: 1em;
    display: flex !important;
    width: 100%;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.swal2-styled {
    box-shadow: none !important;
}

.swal2-html-container {
    z-index: 1;
    justify-content: center;
    margin: 1.25em 2em 2em;
    padding: 0;
    overflow: auto;
    font-weight: normal;
    line-height: normal;
    text-align: center;
    word-wrap: break-word;
    word-break: break-word;
    color: #9fa3a6 !important;
    font-family: inherit !important;
    font-size: 1rem !important;
}

.swal2-title {
    padding: 0.8em 1em 1rem;
}

.investDesign .tab-radius {
    background: #eceded;
    width: 90%;
    height: auto;
    border-radius: 15px 15px;
    margin: auto;
}

.investDesign .nav-investment {
    padding: 6px;
}

.investDesign .nav-investment .nav-link.active,
.investDesign .nav-investment .show>.nav-link {
    color: #fff;
    height: 55px;
    background-color: #4187f3;
    border-radius: 12px;
}

.investDesign .nav-investment .nav-item .nav-link,
.investDesign .nav-justified .nav-item .nav-link {
    width: 100%;
    height: 40px;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.investDesign .nav-investment .nav-link {
    color: #081c2a;
}

.investDesign .nav-investment .nav-link:focus,
.investDesign .nav-investment .nav-link:hover {
    color: #081c2a;
}

.investDesign .nav-investment .nav-link.active:focus,
.investDesign .nav-investment .nav-link.active:hover {
    color: #fff;
}

.input-zone {
    position: relative;
}

.input-amount {
    position: absolute;
    top: 12px;
    right: 15px;
    height: 60px;
    width: 350px;
    font-size: 1.5rem;
    padding: 0 2rem;
    border: none;
    text-align: center;
    font-weight: bold;
}

.input-amount:focus-visible {
    outline: unset;
}

.btn-payoff-choose.active,
.btn-payoff-choose2.active {
    background-color: #4187f3;
    color: #fff;
    opacity: 100%;
    font-weight: 600;
}

.btn-peref.active,
.btn-perefx.active {
    background-color: #4187f3;
    color: #fff;
    opacity: 100%;
    font-weight: 600;
}

.btn-peref2.active,
.btn-perefx2.active {
    background-color: #4187f3;
    color: #fff;
    opacity: 100%;
    font-weight: 600;
}

.btn-payoff-choose:hover,
.btn-payoff-choose2:hover {
    background-color: #4187f3;
    color: #fff;
}

.btn-peref:hover,
.btn-perefx:hover {
    background-color: #4187f3;
    color: #fff;
}

.btn-peref2:hover,
.btn-perefx2:hover {
    background-color: #4187f3;
    color: #fff;
}

.btn-calculate {
    background-color: #4187f3;
    font-size: 1.25rem;
    font-weight: bold;
    border-radius: 10px;
    color: #fff;
}

.btn-calculate:hover {
    background-color: #4187f3;
    color: #fff;
}

.badge-recommend {
    position: absolute;
    font-size: 18px;
    margin-left: 38%;
    top: -20px;
    border-top-right-radius: 20px;
    border-bottom-left-radius: 20px;
}

.btn-choose-plan:hover,
.btn-choose-plan2:hover {
    background-color: #4187f3;
    color: #fff;
}

.btn-choose-plan.active,
.btn-choose-plan2.active {
    background-color: #4187f3;
    color: #fff;
}

.btn-investment-booking {
    background-color: #4187f3;
    border: 2px solid #4187f3;
    color: #ffffff;
    font-size: 1.25rem;
    font-weight: bold;
    width: 30%;
    border-radius: 10px;
}

.btn-edit:hover {
    color: #ffffff;
    background-color: #fff;
}

.select-amount1.selected,
.select-amount2.selected {
    background-color: #4187f3;
    color: #fff;
}

.font_weight_money {
    font-weight: 650;
}


/* * { */


/* Disable spam click to highlight */


/* user-select: none; */


/* -moz-user-select: none; */


/* firefox specific */


/* -webkit-user-select: none; */


/* Chrome, Opera and Safari*/


/* -ms-user-select: none; */


/* IE, ms-edge */


/* } */

#investor_list_1 option,
#investor_list_2 option {
    font-size: 1rem;
}

#investor_list_1:focus-visible,
#investor_list_2:focus-visible {
    outline: unset !important;
}

#investor_list_1 option[value=""],
#investor_list_2 option[value=""] {
    color: #757575;
}

.mainBody .contentProfile .boxInput {
    padding: 4rem;
    padding-bottom: 4rem !important;
}

.mainBody .contentProfile .documentCard {
    padding: 4rem;
    padding-bottom: 1rem !important;
}

.showProfile .sestpadding-card {
    width: 70%;
    margin: 0 auto;
}

.box-image-grag-drop {
    /* margin-top: 4rem !important; */
}

.agentPort .mypayoff {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    margin: 0 auto;
}

.agentPort .mypayoff .progress-box {
    padding: 0;
    margin: 0px;
}

.dropdown-item {
    font-size: 1.25rem;
}

.modal {
    background: transparent;
    backdrop-filter: blur(8px);
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff !important;
    background-clip: padding-box;
    border: unset;
    border-radius: 20px !important;
    outline: 0;
}

.modal .close span {
    float: right;
    font-size: 2.5rem !important;
    font-weight: 700;
    line-height: 1;
    color: #000 !important;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.5;
}

.modal .close {
    border-radius: 50%;
    padding: 0 !important;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
}

.modal-header .modal-title {
    font-size: 1.75rem;
    font-weight: bold;
    /* color: #fff; */
}

.btn-upload3 {
    background: #4187f3 !important;
    color: #fff !important;
    font-size: 1.25rem;
}

.dz-clickable .font-size-p1,
.dz-clickable .text-in-dropzone,
.dz-clickable .font-size-p2,
.dz-clickable .cloudIcon,
.my-great-dropzone .mydropzone {
    pointer-events: none;
}

.dz-clickable {
    height: 100%;
}

.dz-clickable .font-size-p2 {
    font-size: 18px;
    margin-bottom: 7rem;
}

.uploadBank .btn-upload3 {
    width: 350px;
}

.uploadBank .thumbnail-card {
    height: unset !important;
}

.navbar>.container,
.navbar>.container-fluid {
    height: 100px;
}

#Contact-now .col-10 {
    color: #000;
}

#Contact-now .circle,
#Contact-now img {
    background-color: rgb(255 255 255 / 15%);
    border-radius: 50%;
    width: 2.5rem;
    height: 2.5rem;
    margin-right: 6px;
    object-fit: contain;
    padding: 0;
    position: relative;
    top: 7px;
}


/* Go Live */

.Maincontent .cardHeader .boxLeft .btnAppDownload {
    display: none !important;
}

.Maincontent .cardHeader .boxRight {
    align-items: center;
}

.Maincontent .cardHeader .boxRight img {
    height: 567px;
    display: block !important;
    z-index: 1;
    position: absolute;
    right: -140px;
    top: 297px;
}

.Maincontent .cardHeader .boxLeft .textRedefine {
    width: 65%;
    /* margin-top: 4.5rem; */
}

.Maincontent .cardHeader .boxLeft {
    position: absolute;
    top: 300px;
}

.text-golive {
    color: #ffffff;
    font-family: "Kanit Regular";
    font-weight: 400;
    font-size: 1.5625rem;
    margin: 2rem 0;
    margin-right: 1rem;
    text-align: right;
    line-height: 1.5;
}

.line-goline {
    margin: 2rem 0;
    margin-right: 1rem;
    margin-bottom: 0;
}

.Maincontent .boxLeft .readMore {
    margin-top: 0rem !important;
    border-width: 1px !important;
}

.cardHeader .boxLeft .mouseBox {
    display: flex;
    flex-direction: row;
    border-radius: 20px;
    align-items: center;
}

.box-buttom-detail {
    margin-bottom: 50px;
}

.box-buttom-detail .box-buttom-sum p {
    font-size: 1rem;
    font-weight: 200;
    margin-bottom: unset;
    color: #bec3cc;
}

.box-buttom-detail .box-buttom-sum h3 {
    font-size: 1.375rem;
    font-weight: 700;
    margin-bottom: unset;
    color: #fff;
}

.box-buttom-detail .box-buttom-sum {
    display: flex;
    flex-direction: row;
    min-height: 100px;
    align-items: center;
    border-radius: 20px;
    background: #d8dcff5e;
}

.box-buttom-detail .box-buttom-sum .box-left {
    text-align: center;
    text-align: center;
    display: flex;
    width: 100%;
    flex-direction: column;
}

.box-buttom-detail .box-buttom-sum .box-right {
    text-align: center;
    text-align: center;
    display: flex;
    width: 100%;
    flex-direction: column;
}

.renewPage .input-amount {
    position: relative;
    top: 1px;
    right: 0px;
    height: 45px;
    width: 280px;
    font-size: 1.25rem;
    padding: 0 2rem;
    border: none;
    text-align: center;
    font-weight: bold;
    border: 2px solid #efefef;
    border-radius: 12px;
}

.renewPage .btn-circle-sm {
    width: 18px;
    height: 18px;
    line-height: 35px;
    font-size: 0.9rem;
    margin: 3px;
}

.renewPage .btn-circle-sm img {
    width: 10px;
}

.renewPage .box-amount-up-down {
    display: flex;
    flex-direction: column;
    align-items: end;
}

.renewPage .total_investment {
    flex-direction: row;
    display: flex;
    align-items: center;
    justify-content: end;
    position: relative;
    top: -8px;
    right: -6px;
}

.renewPage .input-group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
    justify-content: end;
}

.renewPage .btn-select {
    margin-top: unset;
    width: 100%;
    max-width: 350px;
    height: 34px;
    border-radius: 5px;
    background-color: rgb(0 0 0 / 0%);
    border: unset;
    color: #000;
    font-size: 1.25rem;
    font-weight: 700;
    text-align: end;
    appearance: none;
}

.renewPage .btn-select::after {
    display: none;
}

.text-dark {
    color: #000 !important;
}

.contract_bank_account {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 350px;
    margin-left: auto;
    border-radius: 15px;
    padding: 10px;
    margin-bottom: 10px;
}

.contract_bank_account .box-logo img {
    width: 75px;
    height: 75px;
}

.contract_bank_account .box-bank-detail {
    margin-left: 16px;
    text-align: left;
}

.contract_bank_account .box-bank-detail p {
    font-size: 1.25rem;
    color: #fff;
    font-weight: 200;
}

.contract_bank_account .box-bank-detail span {
    font-size: 1rem;
    color: #b4b9bc;
    font-weight: 200;
}

.text-gray {
    color: #A0A0A0;
}