.mfoFooter {
    width: 100%;
    background-color: #FF8F08;
    display: flex;
    flex-direction: column;
}
.mfoFooter__content {
    margin: 0 auto;
    max-width: 95%;
    width: 1720px;
    padding: 100px 0 60px 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 46px;
}

.mfoFooter__content--btnGroup {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 56px;
}
.mfoFooter__content--btnGroup > .mfoBtn-plain {
    width: 208px;
    height: 75px;
    background-color: transparent;
    border: 2px solid #FFFFFF;
    border-radius: 8px;
    font-size: 25px;
    color: white;
    cursor: pointer;
}

.mfoFooter__content--list {
    /* width: calc(100% - 234px); */
    display: flex;
    flex-direction: row;
    gap: 52px;
    justify-content: space-between;
}
.mfoFooter__content--list > .listBlock {
    display: flex;
    align-items: flex-start;
    gap: 52px;
    flex-direction: column;
    width: calc(25% - 50px);
}
.mfoFooter__content--list > .listBlock > .listBlock__main {
    min-width: 100%;
    padding: 0 4px 24px 4px;
    border-bottom: 1px dashed #FFFFFF;
    box-sizing: border-box;
    /*font-size: 24px;
    line-height: 35px;*/
    font-size: 20px;
    line-height: 1.4;
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mfoFooter__content--list > .listBlock > .listBlock__child {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 10px;
    color: white;
    flex-direction: column;
    min-width: 100%;
}
.mfoFooter__content--list > .listBlock > .listBlock__child a {
    color: white;
    display: block;
    width: 100%;
    line-height: 32px;
    padding: 5px 10px;
    font-size: 19px;
}
.mfoFooter__content--list > .listBlock > .listBlock__child a:hover {
    color: #FF8F08;
    display: block;
    background-color: #FFFFFF;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='40' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='11.5705' height='2.8877' rx='1.44385' transform='matrix(0.662022 0.749485 -0.673729 0.738979 10.0938 0.25)' fill='%23FF8F08'/%3e%3crect x='0.25' y='7.54688' width='14.5879' height='2.91758' rx='1.45879' fill='%23FF8F08'/%3e%3crect width='11.5607' height='2.89017' rx='1.44508' transform='matrix(0.667891 -0.744259 0.667891 0.744259 8.03125 15.6016)' fill='%23FF8F08'/%3e%3c/svg%3e ");
    background-position: right center;
    background-repeat: no-repeat;
}

.mfoFooter__linkGroup {
    width: 100%;
    padding: 19px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 48px;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    background-color: #fff;
    cursor: pointer;
}

.mfoFooter__linkGroup a:hover{
    color: #CE2874;
}

.mfoFooter__copyright {
    width: 100%;
    padding: 9px;
    box-sizing: border-box;
    text-align: center;
    background-color: #E2E2E2;
    font-weight: 400;
    /*font-size: 15px;
    line-height: 22px;*/
    font-size: 12px;
    color: #707070;
}
.mfoFooter__copyright P{
    color: #707070; 
}
.mfoFooter__toolbar {
    display: none;
}

.mfoFooter.mfoFooterBlack{
    background-color: #1B1B1B;
    color: #fff;
    font-size: 16px;    
}
.mfoFooter.mfoFooterBlack .mfoFooter__content{
    max-width: 1200px;
    width: 1200px;
}
.mfoFooter.mfoFooterBlack .mfoFooter__content{
    padding: 52px 0 52px 0;
}
.mfoFooter.mfoFooterBlack .mfoFooter__copyright{
    background-color: #1B1B1B;
    color: #868686;
    border-top: 1px solid #868686;
}
.mfoFooter.mfoFooterBlack .mfoFooter__copyright p{
    font-size: 14px;
}
.mfoFooter.mfoFooterBlack .two_cols{
    display: flex;
    flex-wrap: wrap;
}
.mfoFooter.mfoFooterBlack .two_cols .col01{
    width: calc(100% - 850px);
}
.mfoFooter.mfoFooterBlack .two_cols .col02{
    width: 850px;
}
.mfoFooter.mfoFooterBlack .footer_society{
    margin-top: 25px;
    display: flex;
    flex-wrap: wrap;
}
.mfoFooter.mfoFooterBlack .footer_society a{
    display: inline-block;
    position: relative;
    margin-right: 20px;
}
.mfoFooter.mfoFooterBlack .footer_society .society_list{
    display: flex;
}
.mfoFooter.mfoFooterBlack .footer_society a:last-child{
    margin-right: 0;
}
.mfoFooter.mfoFooterBlack .footer_society a img:nth-child(2){
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}
.mfoFooter.mfoFooterBlack .footer_society a:hover  img:nth-child(1){
    opacity: 0;
}
.mfoFooter.mfoFooterBlack .footer_society a:hover  img:nth-child(2){
    opacity: 1;
}
.mfoFooter.mfoFooterBlack .footer_info{
    margin-top: 30px;
}
.mfoFooter.mfoFooterBlack .footer_info p{
    color: #fff;
    font-size: 16px;    
    font-weight: 400;
    line-height: 1.6;
}
.mfoFooter.mfoFooterBlack .footer_info b{
    font-weight: 700;
}
.mfoFooter.mfoFooterBlack .footer_info a{
    color: #fff;
}
.mfoFooter.mfoFooterBlack .links_list_div .links-cols{
    display: flex;
    flex-wrap: wrap;
}
.mfoFooter.mfoFooterBlack .links_list_div .links-cols .col{
    width: calc(100% / 4);    
}
.mfoFooter.mfoFooterBlack .links_list_div .sub-title{
    font-size: 18px;    
    font-weight: 600;
    color: #fff;
    padding: 25px 0 25px 0;
    position: relative;
}
.mfoFooter.mfoFooterBlack .links_list_div .sub-links{
    max-width: 212.5px;
}
.mfoFooter.mfoFooterBlack .links_list_div .sub-links a{
    display: block;
    font-size: 16px; 
    font-weight: 400;
    color: #868686;
    padding: 9px 10px 16px 0;
    line-height: 1.4;
    word-break: break-all;
}
.mfoFooter.mfoFooterBlack .links_list_div .sub-links a:hover,.mfoFooter.mfoFooterBlack .links_list_div .sub-links a:active{
    color: #fff;
}

.go_top{
    width: 60px;
    height: 60px;
    position: fixed;
    right: 30px;
    bottom: 30px;   
    z-index: 554;    
   
}
.go_top img{
    width: 100%;  

}
.body_mobile_had_bottom_fixed_bar .go_top{
    /*bottom: 70px; */
    bottom: 80px;/**fixed bar 有兩種尺寸，有上下頁的比較大，所以調整高度**/
}
@media (max-width: 1366px) {

    .mfoFooter__content {
        padding: 70px 0 50px 0;
    }

    .mfoFooter__content--list > .listBlock > .listBlock__main {
        padding: 0 4px 12px 4px;
        font-size: 20px;
    }

    .mfoFooter__content--list > .listBlock {
        gap: 32px;
    }

    .mfoFooter__content--list > .listBlock > .listBlock__child {
        gap: 5px;
    }

    .mfoFooter__content--list > .listBlock > .listBlock__child a {
        font-size: 16px;
    }

    .mfoFooter.mfoFooterBlack .two_cols .col01{
        width: calc(100% - 830px);
    }
    .mfoFooter.mfoFooterBlack .two_cols .col02{
        width: 830px;
    }

}
@media (max-width: 1300px) {
    .mfoFooter.mfoFooterBlack .mfoFooter__content{
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }
}
@media (max-width: 1200px) {
    .mfoFooter.mfoFooterBlack .two_cols{
        display: block;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 100%;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col02{
        width: 100%;
        margin-top: 75px;
    } 
    .mfoFooter.mfoFooterBlack .footer_info{
        margin-top: 0;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .links-cols{
        margin: 0 auto;     
        justify-content: center;
        width: max-content;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .links-cols .col{
        padding: 0 15px;
        max-width: calc(100vw / 4 - 30px);
        width: fit-content;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .links-cols .col .sub-links{
        width: max-content;
        max-width: 200px;
    }
}
@media (max-width: 1080px) {

    .mfoFooter__content {
        padding: 50px 0 30px 0;
    }

    .mfoFooter__content--list > .listBlock > .listBlock__main {
        padding: 0 4px 10px 4px;
        font-size: 18px;
    }

    .mfoFooter__content--list > .listBlock {
        gap: 25px;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01{
        width: fit-content;
        margin: 0 auto;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01 .sub-col02{
        margin-left: 100px;
    }
    

}

@media (max-width: 820px) {
    .mfoFooter.mfoFooterBlack .mfoFooter__content{
        padding-left: 45px;
        padding-right: 45px;
        padding-top: 70px;
        padding-bottom: 50px;
        max-width: 100%;
    }    
    .mfoFooter.mfoFooterBlack .links_list_div .sub-links{
        display: none;
        width: 100%;
        max-width: 100%;
        
    }
    .mfoFooter.mfoFooterBlack .links_list_div .sub-links a{
        padding-right: 0;
        padding-bottom: 9px;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .col.active  .sub-links{
        display: block;
        width: 100%;
        max-width: 100%;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .col.active  .sub-title i{
        transform: rotate(180deg);
    }  
    .mfoFooter.mfoFooterBlack .links_list_div .links-cols{
        display: block;
        width: 100%;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .links-cols .col{
        width: 100%;
        padding: 0;
        max-width: 100%;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .sub-title{
        cursor: pointer;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .sub-title i{
        background-image: url(../assets/icons/icon_arrow_down_white.svg);
        background-position: center;
        background-repeat: no-repeat;
        width: 24px;
        height: 24px;
        display: inline-block;
        position: absolute;
        right: 0;
        top: 22px;
    }
    .mfoFooter.mfoFooterBlack .mfoFooter__copyright p{
        font-size: 12px;
    }
    .go_top{
        right: 20px;
    }
}

@media (max-width: 768px) {

    /*.mfoFooter.active{
        margin-bottom:70px ;
    }*/

    .mfoFooter__content--list {
        gap: 25px;
    }

    .mfoFooter__content--list > .listBlock{
        width: calc(25% - 10px);
    }


}



@media (max-width: 767px) {
    .mfoFooter__content {
        padding: 40px 0px 0px 0px;
        max-width: 75%;
    }

    .mfoFooter__content--btnGroup {
        flex-direction: column;
        gap: 16px;
    }
    .mfoFooter__content--btnGroup > .mfoBtn-plain {
        width: 260px;
        height: 45px;
        border-width: 1px;
        font-size: 18px;
    }
    .mfoFooter__content--list {
        width: 100%;
        display: block;
    }
    .mfoFooter__content--list > .listBlock {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .mfoFooter__content--list > .listBlock > .listBlock__main {
        min-width: 100%;
        max-width: 100%;
        padding: 0;
        font-size: 24px;
        border: none;
    }
    .mfoFooter__content--list > .listBlock > .listBlock__main p {
        margin: 0 auto;
    }
    .mfoFooter__content--list > .listBlock > .listBlock__child {
        width: 100%;
        font-size: 14px;
        gap: 0px;
        padding-top: 10px;
        border-top: 1px dashed white;
        margin-bottom: 50px;
    }
    .mfoFooter__content--list > .listBlock > .listBlock__child a {
        margin: 0 auto 0px;
        text-align: center;
        font-size: 14px;
        line-height: 24px;
    }

    .mfoFooter__linkGroup {
        padding: 18px 11px;
        flex-direction: column;
        font-size: 13px;
        line-height: 28px;
        gap: 6px;
    }
    
    .mfoFooter__copyright {
        padding: 4px;
        font-size: 13px;
        line-height: 28px;
    }
    .mfoFooter__copyright P{
        font-size: 13px;
        line-height: 28px;
    }
    .mfoFooter__toolbar {
        width: 100%;
        padding: 10px 20px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        gap: 11px;
    }
    .mfoFooter__toolbar--btn {
        width: 100%;
        height: 49px;
        border-radius: 50px;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        color: white;
    }
    .mfoFooter__toolbar--btn:first-child {
        background-color: #DE5398;
        border: 2px solid #DE5398;
    }
    .mfoFooter__toolbar--btn:last-child {
        background-color: #624BEE;
        border: 2px solid #624BEE;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01{
        width: 100%;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01 .sub-col02{
        margin-left: 0;
    }
    .go_top{
        width: 40px;
        height: 40px;    
        right: 15px;    
    }
    .body_mobile_had_bottom_fixed_bar .mfoFooter.mfoFooterBlack{
        /*padding-bottom: 70px;*/
    }
    .body_mobile_had_bottom_fixed_bar  .go_top{
        bottom: 80px;
        right: 20px;
    }
    .body_mobile_had_bottom_fixed_bar .step_button_container  + .mfoFooter.mfoFooterBlack{
        padding-bottom: 0;
    }
    .body_mobile_had_bottom_fixed_bar .step_button_container  + .mfoFooter.mfoFooterBlack +  .go_top{
        bottom: 80px;
    }
}


@media (max-width: 640px) {
    .mfoFooter.mfoFooterBlack .mfoFooter__content{
        padding: 40px 48px;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01{
        display: block;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col02{
        margin-top: 20px;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01 .footer_logo{
        text-align: center;
    }
    .mfoFooter.mfoFooterBlack .two_cols .col01 .footer_logo img{
        /* height: 40px; */
    }
    .mfoFooter.mfoFooterBlack .footer_society{
        justify-content: center;
    }
    .mfoFooter.mfoFooterBlack .footer_info{
        margin-top: 20px;
    }
    .mfoFooter.mfoFooterBlack .footer_info p{
        font-size: 14px;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .sub-title{
        font-size: 14px;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .sub-links a{
        font-size: 12px;
        padding: 6px 0;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .sub-links a:hover{
        color: #868686 !important;
    }
    .mfoFooter.mfoFooterBlack .links_list_div .sub-links a:active{
        color: #fff !important;
    }
    .body_Mobile_device .mfoFooter.mfoFooterBlack .links_list_div .sub-links a:hover{
        color: #868686 !important;
    }
    .body_Mobile_device .mfoFooter.mfoFooterBlack .links_list_div .sub-links a:active{
        color: #fff !important;
    }
}