﻿/*#region FOOTER */
.owl-nav.disabled, .owl-dots.disabled {
    display: none;
}

.gd_cover_item img {
    width: 100%;
}

.banner_smartgate__content img {
    width: auto;
    max-width: 100%;
}

.smg .modal-content {
    border-radius: 13px;
}

    .smg .modal-content::after {
        position: absolute;
        content: '';
        right: 0;
        transform-origin: 0 0;
        border-top: 90px solid #396CB5;
        border-left: 90px solid transparent;
    }

.smg .modal-header .close span {
    font-size: 2.5rem;
}

.smg .modal-content {
    border-radius: 13px;
    overflow: hidden;
}

.bic_login__buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.bic_login__button {
    line-height: 50px;
    height: 50px;
    background-color: #396CB5;
    color: #fff;
    flex: 0 0 45%;
    text-align: center;
    text-transform: uppercase;
}

.smg .modal-header {
    padding: 2.5rem 3.75rem 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

    .smg .modal-header .close {
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 1;
        color: #fff;
        opacity: 1;
    }

.smg .modal-body {
    padding: 0 3.75rem 5.5rem;
    margin-top: 5.25rem;
}

.modal-dialog.smg {
    max-width: 650px;
    top: 50%;
    left: 50%;
    margin: 0;
    transform: translate(-50%,-30%) !important;
}

.modal.show .modal-dialog.sm {
    transform: translate(-50%,-50%) !important;
}

.smg .modal-title {
    font-size: 1.875rem;
    color: #396CB5;
    text-transform: uppercase;
    font-weight: 500;
    line-height: 1.2;
}

.sm_notice {
    margin-top: 1rem;
    color: #777;
    font-style: italic;
    font-weight: 500;
}

.smg .modal-header span {
    font-size: 1.125rem;
    margin-top: 5px;
}

.chp_footer {
    background: #0D4A87 no-repeat bottom center;
    color: #fff;
    padding: 0;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

    .chp_footer::before {
        content: "";
        display: block;
        width: 614px;
        height: 582px;
        background-image: url("/Styles/images/icon-ft.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        position: absolute;
        top: 0;
        right: 40px;
        z-index: 1;
    }

.chp_ft_content {
    padding-top: 55px;
    padding-bottom: 130px;
}

.chp_ft__title {
    font-size: 30px;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    position: relative;
    margin-bottom: 70px;
    padding-bottom: 1rem;
}

    .chp_ft__title:before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 70px;
        height: 1px;
        background-color: #fff;
    }

._icon_social {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 20px 0 0;
    align-items: center;
}

.bicweb-social-icon.ft_fb,
.bicweb-social-icon.ft_youtube {
    width: 50px !important;
    height: 50px !important;
    border: 1px solid #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px !important;
}


._icon_social .bicweb-social-icon {
    width: 45px;
    height: 45px;
    margin-right: 1rem;
}

._icon_social .bicweb-social-icon {
    width: 60px;
    height: 60px;
    margin-right: 1rem;
}

    ._icon_social .bicweb-social-icon.ft_qr {
        background: url(icon/icon-qrcode.png) no-repeat center center;
    }

    ._icon_social .bicweb-social-icon.ft_bct {
        background: url(icon/icon-bct.png) no-repeat center center;
        width: 150px;
        margin: 0;
    }

.chp_ft__info, .chp_ft_contact {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}

    .chp_ft_contact .item:first-child {
        flex: 0 0 53%;
    }

    .chp_ft_contact .item:last-child {
        display: flex;
        flex-direction: column;
        align-content: center;
        justify-content: start;
    }

    .chp_ft_contact ._icon_social {
        justify-content: start;
    }

    .chp_ft__info strong {
        font-size: 16px;
        font-weight: 700;
        display: inline-block;
        min-width: auto;
    }

    .chp_ft__info p {
        margin-bottom: 1rem;
        position: relative;
        padding-left: 2rem;
    }

    .chp_ft_contact .item p {
        padding-left: 24px;
        position: relative;
    }


    .chp_ft__info p::after {
        position: absolute;
        left: 0;
        top: -3px;
        font-family: "Font Awesome 5 Pro";
        font-weight: 700;
        color: #fff;
        font-size: 17px;
    }

    .ft_mail.ft_mail_2::after{
        content: "\f007";
    }

.ft_add::after {
    content: "\f3c5";
}

.ft_phone::after {
    content: "\f879";
}

.ft_mail::after {
    content: "\f0e0";
}

.ft_fax::after {
    content: "\f1ac";
}

.chp_ft__info a {
    color: #fff;
}

    .chp_ft__info a:hover {
        color: var(--color-secondary);
    }

.chp_footer_copyright {
    color: #0D4A87;
    font-size: 15px;
    font-weight: 400;
    padding: 19px 0 50px;
    text-align: center;
    background: transparent;
    position: relative;
    z-index: 2;
}


    .chp_footer_copyright::before {
        content: "";
        display: block;
        width: 100%;
        height: 143px;
        background-image: url("/Styles/images/bg-bottom.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: -11;
    }


    .chp_footer_copyright a {
        color: #0D4A87;
        font-weight: 400;
    }

.chp_design {
    margin-left: 10px;
    border-left: 1px solid #fff;
    padding-left: 10px;
    line-height: 1;
}

.chp_copyright, .chp_design {
    display: inline-block;
    font-weight: 300;
}

    .chp_copyright a {
        font-weight: 500;
    }

#back-to-top {
    width: 40px;
    height: 40px;
    border: 2px solid var(--color-secondary);
    background: url(images/backtop.svg) no-repeat center center;
    background-size: 75% auto;
    position: fixed;
    bottom: 15px;
    right: 15px;
    display: none;
    cursor: pointer;
    z-index: 1000;
    border-radius: 10px;
}

/*fixed */
@media (min-width:1200px)  and (max-width:1280px){
    .chp_fixed_bar {
        top: 55% !important;
    }
}
@media (min-width:1366px) and (max-width:1440px) {
    .chp_fixed_bar {
        top: 53% !important;
    }
}
@media (min-width:1441px) and (max-width:1536px) {
    .chp_fixed_bar {
        top: 54% !important;
    }
}
@media (min-width:1921px) {
    .chp_fixed_bar {
        top: 49% !important;
    }
}
@media (min-width:1537px) and (max-width:1700px) {
    .chp_fixed_bar {
        top: 52% !important;
    }
}
.chp_fixed_bar {
    position: fixed;
    top: 52%;
    right: 0;
    z-index: 999;
    transform: translateY(-50%);
    margin-top: 30px;
}

    .chp_fixed_bar ul {
        padding: 0;
        margin: 0;
    }

        .chp_fixed_bar ul li {
            width: 61px;
            height: 61px;
            margin-bottom: 5px;
            text-align: center;
            list-style: none;
            display: flex;
            justify-content: center;
            align-items: center;
            border-top-left-radius: 10px;
            border-bottom-left-radius: 10px;
        }

            .chp_fixed_bar ul li a {
                font-size: 10px;
                color: #e6e8ec;
                text-transform: uppercase;
                line-height: 1.1;
                display: block;
                padding: 2px;
                background-color: #396CB5;
                background-repeat: no-repeat;
                background-position: top 12px center;
                width: 100%;
                height: 100%;
                position: relative;
                border-top-left-radius: 10px;
                border-bottom-left-radius: 10px;
            }

                .chp_fixed_bar ul li a:hover {
                    background-color: var(--color-secondary);
                }

                .chp_fixed_bar ul li a.cqn-eport {
                    background-image: url(icon/icon-eport-page.png);
                }

                .chp_fixed_bar ul li a.cqn-smg {
                    background-image: url(icon/icon_smg.png);
                    background-size: 25px;
                    background-position: 50% 23%;
                }

                .chp_fixed_bar ul li a.cqn-report {
                    background-image: url(icon/icon-facebook.png);
                }

                .chp_fixed_bar ul li a.cqn-inout {
                    background-image: url(icon/icon-youtube.png);
                }

                .chp_fixed_bar ul li a.cqn-service {
                    background-image: url(icon/report_hhp.png);
                    background-size: 20px;
                }

    /*                .chp_fixed_bar ul li a.cqn-eport:hover {
                    background-image: url(images/fixed-neo-alt.svg);
                }

                .chp_fixed_bar ul li a.cqn-report:hover {
                    background-image: url(images/fixed-book-alt.svg);
                }

                .chp_fixed_bar ul li a.cqn-inout:hover {
                    background-image: url(images/fixed-tau-alt.svg);
                }

                .chp_fixed_bar ul li a.cqn-service:hover {
                    background-image: url(images/fixed-setup-alt.svg);
                }*/

    .chp_fixed_bar li span {
        display: block;
        line-height: 1.3;
        color: #fff;
        padding: 35px 0 0;
        white-space: nowrap;
        font-size: 11px;
        font-weight: 500;
        text-transform: none;
        text-align: center;
    }

    .chp_fixed_bar li:hover span {
        transform: rotateY(0deg);
        visibility: visible;
        opacity: 1;
    }

    .chp_fixed_bar ul li.active {
        transform: translateX(61px);
    }

.show_icon {
    background: #e6e8ec url(images/backtop.svg) no-repeat center center;
    padding: 4px 8px;
    margin-bottom: 5px;
    color: #fff;
    border-radius: 0 2px 2px 0;
    position: relative;
    width: 30px;
    height: 30px;
    float: right;
    display: block;
    background-size: 70%;
    transform: rotate(90deg);
    cursor: pointer;
}

    .show_icon.active {
        transform: rotate(-90deg);
    }

/*#endregion */
@media screen and (min-width:1600px) {
    .vi .chp_ft_contact .ft_add strong,
    .vi .chp_ft_contact .ft_phone strong,
    .vi .chp_ft_contact .ft_email strong {
        min-width: auto;
     
    }
}

@media screen and (min-width: 1440px) and (max-width: 1600px) {
    .chp_ft_contact .item {
        flex: 0 0 50%;
    }

        .chp_ft_contact .item:last-child {
            padding-left: 30px;
        }
}

@media screen and (min-width: 1200px) and (max-width: 1439px) {
    .chp_ft_contact .item {
        flex: 0 0 50%;
    }

        .chp_ft_contact .item:last-child {
            padding-left: 30px;
        }
}

@media screen and (min-width:768px) and (max-width:1024px) {
    .chp_fixed_bar ul li {
        width: 50px;
        height: 50px;
    }

        .chp_fixed_bar ul li a {
            background-position: top 10px center;
        }

    .chp_fixed_bar li span {
        padding: 30px 0 0;
    }

    .chp_ft_contact .item {
        flex: 0 0 48%;
    }

    .chp_ft__info strong {
        min-width: 0;
        margin-right: 8px;
    }
}

@media screen and (max-width:991px) {
}

@media screen and (max-width:767px) {
    .chp_ft__title{
        margin-bottom:2rem;
    }
    .chp_footer_copyright, .chp_footer_copyright a {
        color: #fff;
        font-size:15px;
    }
    .chp_ft_contact .item:last-child {
        display: flex;
        flex-direction: row;
        align-content: center;
        justify-content: start;
    }
    .chp_ft_contact .item:first-child {
        flex: 0 0 100%;
    }
    .chp_ft_content {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .chp_footer::before,
    .chp_footer_copyright::before {
        display: none;
    }
    .chp_fixed_bar ul li,
    .chp_fixed_bar ul li a {
        border-radius: 0;
    }
    .chp_ft__info, .chp_ft_contact .item {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .chp_brand {
        padding: 0;
    }


    /*EIR_SEARCH*/
    .serch_empty {
        padding: 0 15px;
        text-align: center;
        color: #ec3030;
        font-weight: 500;
        font-size: 1.25rem;
    }

    .table.phone_table td span i {
        font-weight: 600;
        color: #396CB5;
        margin-right: 2px;
    }

    .gd_cover_item .gd_absolute {
        -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        -o-transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        max-width: 100%;
        top: 50%;
        color: #fff;
        position: absolute;
        left: 50%;
        width: 100%;
        padding: 0 10px;
    }

    .gd_cover_item .gd_text {
        color: #fff;
        font-weight: 800;
        display: block;
        text-transform: uppercase;
        text-align: center;
        font-size: 1.875rem;
        line-height: 1;
        text-shadow: 0 0 5px #555;
        width: 100%;
    }

    .page-thuytrieu {
        margin-bottom: 50px;
    }

        .page-thuytrieu .phone_table tbody td {
            padding: 5px 15px;
        }

    .chp_page__content iframe {
        border: none;
    }

    #bangthuytrieu {
        max-width: 85vw;
        margin: auto;
    }

    .table-bordered th, .table-bordered td {
        border: 1px solid #dee2e6;
    }

    .table.phone_table thead th {
        background: #102a4b;
        color: #fff;
        text-transform: uppercase;
        padding: 16px 10px;
        vertical-align: middle;
        border-left: 1px solid #fff;
        text-align: center;
    }

    .table.phone_table td {
        text-align: center;
        border: 1px solid #dee2e6;
    }

        .table.phone_table td span {
            cursor: pointer;
        }

    .phone_table tbody tr:nth-child(2n+1) {
        background-color: #e3f4fc;
    }

    .tabla_mareas_marea_hora {
        position: relative;
        width: 100%;
        font-size: 1em;
        color: #1d84bf;
        font-weight: 700;
        padding-top: 3px;
        padding-left: 1px;
    }

    .tabla_mareas_marea_altura {
        position: relative;
        font-size: .9em;
        height: 20px;
        float: left;
        line-height: 20px;
        text-align: left;
        padding-left: 15px;
        color: #777;
        font-weight: 500;
    }

    .tabla_mareas_hora_bajamar {
        color: #d44f53;
    }

    .tabla_mareas_marea_bajamar_pleamar {
        position: relative;
    }

    .icon-ic_bajamar_tabla::before {
        content: "\f0d7";
        color: #ef5350;
        position: absolute;
        font-size: 1em;
        left: 0;
        top: 0;
        font-family: "Font Awesome 5 Pro";
        font-weight: bold;
    }

    .icon-ic_pleamar_tabla::before {
        content: "\f0d8";
        color: #29b6f6;
        position: absolute;
        font-size: 1em;
        left: 0;
        top: 0;
        font-family: "Font Awesome 5 Pro";
        font-weight: bold;
    }

    .modal-dialog.getfile {
        max-width: 55vw;
    }
}

@media screen and (max-width:575px) {

    .smg .modal-body {
        padding: 0 1.5rem 2rem;
        margin-top: 1.25rem;
    }

    .bic_login__buttons {
        flex-wrap: wrap;
    }

    .bic_login__button {
        flex: 0 0 100%;
        margin-top: 10px;
    }

    .modal-dialog.smg {
        max-width: 95%;
    }

    .smg .modal-title {
        font-size: 1.25rem;
        text-align: center;
    }

    .chp_ft__title {
        font-size: 22px;
    }

    .chp_ft__info strong {
        min-width: 0;
        margin-right: 10px;
    }

    .chp_footer {
        background: var(--color-primary);
        margin-bottom: 60px;
    }

    .chp_ft_logo {
        display: none;
    }

    .chp_ft__info .item > strong {
        font-weight: 500;
        line-height: 1.42;
    }

    .chp_design {
        margin-left: 0;
        border: none;
        padding-left: 0;
    }

    .chp_fixed_bar.chp_fixed {
        bottom: 0;
        transform: none;
        top: auto;
        width: 100%;
        margin: 0;
        background-color: #0e2440;
    }

    .chp_fixed_bar ul {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

    .show_icon {
        position: absolute;
    }

    .chp_fixed_bar ul li {
        padding: 0;
        margin: 0;
        height: 60px;
        width: 25%;
    }

        .chp_fixed_bar ul li a {
            background-position: top 12px center;
            background-size: 18px;
            padding-top: 5px;
        }

            .chp_fixed_bar ul li a.cqn-service {
                background-size: 15px;
            }

    .chp_fixed_bar li span {
        padding-top: 30px;
    }

    #back-to-top {
        bottom: 65px;
        width: 35px;
        height: 35px;
        right: 10px;
    }
}

@media screen and (max-width:414px) {
}

@media screen and (max-width:375rem) {
}

@media screen and (max-width:320px) {
}

.ft_hotline {
    padding-left: 0 !important;
    position: unset !important;
    font-weight: 700;
    font-size: 32px;
    line-height: 24px;
    font-style: normal;
}


.bicweb-social-icon.ft_fb:hover,
.bicweb-social-icon.ft_youtube:hover {
    border-color: var(--color-secondary);
    background-color: var(--color-secondary);
}


@media (min-width:1921px){
    .chp_copyright {
        margin-left: -5rem;
    }
}
