﻿.swiper-wrapper {
    height:auto;
}

header .bar .row-b .hv-sub.support .dropdown-menu {
    max-width: 1720px;
    width: 120vw;
    transform: translate(20vw);
}

    header .bar .row-b .hv-sub.support .dropdown-menu .col:not(:first-child) {
        padding-left: 25px;
    }

    header .bar .row-b .hv-sub.support .dropdown-menu .col:not(:last-child) {
        padding-right: 25px;
    }


.attachment-row:has(.single-row) * {
    margin-bottom: 0px !important;

}

.attachment-row .col.single-row{
    width:100%;
}

.attachment-row .col.single-row {
    margin-right: 0;
}

/* (28/11/23) Comment From CMDF */
header .bar .row-b .dropdown-menu {
    transform: translate(70%);
    -webkit-transform: translate(70%);
    width: 90vw;
}

header .bar .row-b .hv-sub.support .dropdown-menu .col {
    max-width: 225px;
}

header .bar .row-b .hv-sub.support .dropdown-menu {
    max-width: 570px;
    width: 100vw;
    transform: translate(27%);
}

footer .col-logo a img {
    max-height: 35px;
}

footer .row-contact .col-subscribe .social a img {
    max-height:36px;
}


header .bar .row-b .dropdown-menu ul {
    max-width: 295px;
}

.page-intro .col-desc .txt-wrap {
    background-color: white;
}

.sidebar .item .txt {
    text-wrap: pretty;
}


header .bar .row-b .aboutUs .dropdown-menu {
    transform: translate(50%);
    -webkit-transform: translate(50%);
    width: 30vw;
}

    header .bar .row-b .aboutUs .dropdown-menu .col:not(:first-child) {
        padding-left : 0px;
        width:100%
    }

    header .bar .row-b .aboutUs .dropdown-menu .col:not(:last-child) {
        padding-right: 0px;
        border-right:0px;
    }


header .bar .row-b:not(:has(.member)) .hv-sub.support .dropdown-menu {
    transform: translate(20%);
}


header .bar .row-b:not(:has(.member)) .dropdown-menu {
    transform: translate(35%);
    max-width:1175px;

}

    header .bar .row-b:not(:has(.member)) .dropdown-menu .col:not(:last-child) {
        padding-right:25px;
    }

    header .bar .row-b:not(:has(.member)) .dropdown-menu .col:not(:first-child) {
        padding-left: 25px;
    }


header .bar .row-b:not(:has(.member)) .hv-sub.aboutUs .dropdown-menu .col:not(:last-child) {
    padding-right: 0px;
}

header .bar .row-b:not(:has(.member)) .hv-sub.aboutUs .dropdown-menu .col:not(:first-child) {
    padding-left: 0px;
}


    footer .row-bottom .col-disclaimer .links a {
        text-wrap: nowrap;
    }

footer .col-logo img {
    max-height: 50px;
}



header .bar .col-right .accessbility-option {
    align-items: baseline;
    display: flex;
}

    header .bar .col-right .accessbility-option a:not(:last-child) {
        margin-right: 23px;
    }

    header .bar .col-right .accessbility-option a.text-option.active {
        color: #c10101;
    }

    header .bar .col-right .accessbility-option a.text-option.small {
        font-size: 14px;
    }


    header .bar .col-right .accessbility-option a.text-option.middle {
        font-size: 16px;
    }

    header .bar .col-right .accessbility-option a.text-option.large {
        font-size: 18px;
    }

header .bar .row-b .hv-sub::before {
    content: '';
    position: absolute;
    width: 150px;
    height: 10px;
    left: 70%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

header .bar {
    padding-top:32px;
    padding-bottom:15px;
}

header .bar .row-b > div {
    padding-bottom:20px;
}
@media screen and (min-width: 1180px) {
    header .bar .col-right .accessbility-option:after {
        content: "|";
        margin: 0 14px;
        display: inline-block;
    }
}

@media screen and (max-width: 1179px) {
    header .bar .col-right .accessbility-option {
        display: none;
    }

    .sidebar .item a {
        background-color:white;
    }
}


header .bar .row-b .member .name {
    padding-bottom: 20px
}



/* (08/01/24) login button comments  */
header .bar .row-t .member .btn-login {
    display: inline-block;
    padding: 10px 16px;
    color: #ffffff;
    background-color: #0C8295;
    border-radius: 8px;
    font-weight: 500;
}


header .bar .row-t .member:before {
    content: "";
    position: relative;
    top: 7px;
    width: 1px;
    height: 32px;
    background-color: #414042;
    display: inline-block;
    margin: 0 28px;
}

header .bar .col-right {
    font-size: 1.15em;
}

@media screen and (max-width: 1179px) {
    header .bar .row-t .member .btn-login {
        display: none;
    }

    header .bar .row-t .member:before {
        display: none;
    }
}

@media screen and (min-width: 992px) and (max-width: 1416px) {
    header .bar .col-right .system {
        max-width: 200px;
    }

    header .bar .col-right {
        font-size: 1.00em;
    }
        header .bar .col-right .accessbility-option a:not(:last-child) {
            margin-right:15px;
        }

    header .bar .row-t .member:before {
        margin:0 10px;
    }
} 


/* (21/01/2024) header login Info*/
header .bar .row-t .member .name {
    position: relative;
    padding-right: 30px;
    padding-top: 5px;
    padding-bottom: 20px;
    cursor: pointer;
}

    header .bar .row-t .member .name:before {
        content: "";
        position: absolute;
        display: block;
        background-image: url(/assets/img/icon/chevron-down-black.svg);
        background-repeat: no-repeat;
        background-size: contain;
        width: 30px;
        height: 30px;
        right: 0;
        top: 5px;
        left: auto;
        opacity: 1;
        background-color: transparent;
    }

    header .bar .row-t .member .name > span {
        color: #0C8295;
        font-weight: 500;
        letter-spacing: 1px;
        line-height: 1.6;
    }


    header .bar .row-t .member .name ul {
        position: absolute;
        top: 33px;
        list-style-type: none;
        padding-left: 25px;
        margin-top: 6px;
        display: none;
        left:-44px;
    }

        header .bar .row-t .member .name ul li {
            margin-bottom: 4px;
        }



        header .bar .row-t .member .name ul a {
            display: inline-block;
            padding: 12px 32px;
            background-color: #ffffff;
            border-radius: 16px 0px 16px 16px;
            border: 1px solid #414042;
            letter-spacing: 0.4px;
            line-height: 2;
            font-weight: 500;
            color: #58595B;
            min-width: 200px;
        }

header .bar .row-t a {
    position: relative;
/*    padding: 8px;
*/    transition: all 0.3s ease-in-out;
}


header .bar .row-t .member .name ul a span {
    transition: all 0.3s ease-in-out;
}

header .bar .row-t .member .name ul li {
    margin-bottom: 4px;
}

header .bar .row-t .member .name:hover ul {
    display: block;
    z-index:99;
}



header .bar .row-t .member .name ul a:hover {
    opacity: inherit;
    color: rgba(0, 0, 0, 0.5);
}

@media screen and (max-width: 1179px) {
    header .bar .row-t .member {
        display:none;
    }

}

@media screen and (min-width: 992px) and (max-width: 1416px) {
    header .bar .row-t .member .name:before {
        top: 2.5px;
    }

    header .bar .row-t .member .name {
        bottom:5;
    }
}



/*(21/01/24) 箭咀未對齊*/
header .mobile-menu .col-t ul > li.hv-sub .arrow:before {
    top:-5px;
}

/*(21/01/24) change font size*/
header .second-layer .listing ul > li .title {
    font-size: 1.25em;
}

/*(21/01/24) */
@media screen and (max-width: 991px) {
    .popup#funding-suggestion .background {
        min-height: 500px;
    }
}

/* (26/01/24) */
header .bar .col-right .member {
    display:flex;
    white-space:nowrap;
}

header .bar .col-right .lang {
    white-space:nowrap;
}

footer .row-contact .col-contact .item.item-tel {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: nowrap;
}

    footer .row-contact .col-contact .item.item-tel > span {
        flex-wrap: wrap;
    }

.com-book .action .btn-container .com-btn {
    padding:8px 0.37vw;
}

@media screen and (max-width: 991px) {
    .com-book .action .btn-container .com-btn {
        padding: 8px 0.8vw;
    }
}

@media screen and (max-width: 1179px) {
    header .bar .col-right .member{
        display:none;
    }
}


.status[data-type=tobecarriedout] {
    border: 1px solid #c8c062;
    background-color: #fffcd6;
    color: #c8c062;
}


/*(23/02/24) 20/2 comments*/
footer .row-contact h3 {
    font-size: 1.25em;
}

footer .row-contact .col-contact .item {
    font-size: 14px;
}

footer .wrap {
    /*padding: 24px 0 32.5px;*/
    /* (23/02/24) update padding */
    padding: 12px 0 6px;
}

footer .row-contact {
    padding-bottom: 12px;
}

footer .row-bottom {
    padding-top: 11px;
}

.headroom {
    will-change:unset;
}

/* (16/05/2024) Modify the flex property of menu header */
.hv-sub .dropdown-menu .row:has(.col ul) {
    flex-wrap: nowrap;
}