/*消除 chrome firefox safari  點選 input, textarea  加邊框的效果 */
input,textarea{outline:none;resize: none;}
/*去除 chrome  firefox safari 超連接底線*/
a,a:hover,a:link,a:visited{text-decoration: none !important;}
li{list-style-type:none;}
textarea,select,input,button,div,span,a,td,th,ol,ul,li,h1,h2,h3,h4,h5,h6,article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section,dl, dt, dd,table, caption, tbody, tfoot, thead, tr, th, td,fieldset, form, label, legend{
    font-family: Microsoft JhengHei;
}

body {
    background-color:#EEF0F3;
    font-family: Microsoft JhengHei;
    overflow-y:scroll;
    overflow-x: hidden;
}

/*捲軸底色*/
body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #FFFFFF;
}
/*捲軸寬度*/
body::-webkit-scrollbar {
    width:10px;
    background-color: transparent;
}
/*捲軸本體顏色*/
body::-webkit-scrollbar-thumb {
    background-color: #606060;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}


.heightauto{
    height:auto!important;
    height:100%;
    min-height:700px;
}

.tabled, .tabled * {margin: 0 auto; padding: 0;position:relative;}
.tabled {display: table; width: 100%; border-collapse: collapse;position:relative;}
.tabled-tr {display: table-row; height:auto;position:relative;}
.tabled-th {display: table-cell;height: 100%;border: 0px solid gray;vertical-align: middle;position:relative;}
.tabled-td {display: table-cell; height: 100%;border: 0px solid gray; vertical-align: middle;position:relative;}


.menu_item img {
    display: block;
    width:auto;
    height:auto;
    margin: 0 auto;
    border: none;
}

.menu_item p {
    font-size:16px;
    color: #333;
}

.fixedbottom {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 100;
}

.footer {
    height: 2.13333rem;
    background: #fff;
    position: fixed;
    height:60px;
    z-index:100;
    bottom: 0;
    left: 0;
    width: 100%;
    -moz-box-shadow: 0 0 10px 0 rgba(155,143,143,0.6);
    -webkit-box-shadow: 0 0 10px 0 rgba(155, 143, 143, 0.6);
    box-shadow: 0 0 10px 0 rgba(155, 143, 143, 0.6);
}
.footer ul{
    width:100%;
    padding: 0;
    margin: 0;
}
.footer ul li {
    float: left;
    text-align: center;
    width:25%;
}

.footer ul li p{
    color: #666666;
}

.icon_tps img {
    width: 100%;
    height: 100%;
}

.footer ul li .yello {
    color: #524381;
}

.footer ul li .yello p{
    color: #524381;
    font-weight: bold;
}

.footer ul li a .icon {
    margin-top:3px;
    font-size: 14px;
}

.icon_tps {
    display: block;
    margin: 0 auto;
    width: 32px;
    height:32px;
}

.frp-title {
    font-size: 16px;
    font-weight: bold;
    color: #333;
}

.frp-price {
    font-size: 16px;
    font-weight: normal;
    color: #666;
}


.index_footer2 {
    font-size:16px;
    color: #666;
}

.modaldialog{
    --bs-modal-zindex: 1055;
    --bs-modal-width: 500px;
    --bs-modal-padding: 1rem;
    --bs-modal-color: var(--bs-body-color);
    --bs-modal-bg: var(--bs-body-bg);
    --bs-modal-border-color: var(--bs-border-color-translucent);
    --bs-modal-border-width: var(--bs-border-width);
    --bs-modal-border-radius: var(--bs-border-radius-lg);
    --bs-modal-box-shadow: var(--bs-box-shadow-sm);
    --bs-modal-inner-border-radius: calc(var(--bs-border-radius-lg) - (var(--bs-border-width)));
    --bs-modal-header-padding-x: 1rem;
    --bs-modal-header-padding-y: 1rem;
    --bs-modal-header-padding: 1rem 1rem;
    --bs-modal-header-border-color: var(--bs-border-color);
    --bs-modal-header-border-width: var(--bs-border-width);
    --bs-modal-title-line-height: 1.5;
    --bs-modal-footer-gap: 0.5rem;
    --bs-modal-footer-bg: ;
    --bs-modal-footer-border-color: var(--bs-border-color);
    --bs-modal-footer-border-width: var(--bs-border-width);
    position: fixed;
    left: 0;
    bottom:0;
    z-index:1055;
    display: none;
    width: 100%;
    height:auto;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0;
}


.mask{
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    position:fixed;
    z-index:1054;
    background:#000;
    -moz-opacity:0.6;
    -khtml-opacity: 0.6;
    opacity:0.6;
    filter:alpha(opacity=6);
    zoom:1;
    display:none;
}



#btn_top{
    position: fixed;
    bottom: 70px;
    right: 10px;
    display: none;
}



/*
響應式表格
*/

@media only screen and (max-width: 600px) {

    .menu_item img {
        width:50px;
        height:50px;
    }

    #no-more-tables table,
    #no-more-tables thead,
    #no-more-tables tbody,
    #no-more-tables th,
    #no-more-tables td,
    #no-more-tables tr {
        display: block;
    }

    #no-more-tables thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }


    #no-more-tables tr {
        border-bottom: 1px dashed #000;
    }
    #no-more-tables td {
        border: none;
        border-bottom: 1px dashed #eee;
        position: relative;
        padding-left: 30%;
        white-space: normal;
        text-align:left;
    }

    #no-more-tables td:before {
        /*position:relative;*/
        position:absolute;
        top: 0px;
        left: 0px;
        width:10%;
        padding:0px;
        white-space: nowrap;
        float:left;
        word-break: normal;
    }

    #no-more-tables td:before {
        width:10%;
        content: attr(data-title);
        border-right: 0px dashed #eee;
        color:black;
        padding-left:0px;
        padding-top:8px;
        font-weight: bold;
        word-break: normal;
    }

    .paginationatt {
         --bs-pagination-padding-x:unset;
         --bs-pagination-padding-y:unset;
         --bs-pagination-font-size:unset;
         --bs-pagination-color:unset;
         --bs-pagination-bg:unset;
         --bs-pagination-border-width:unset;
         --bs-pagination-border-color:unset;
         --bs-pagination-border-radius:unset;
        /*
         --bs-pagination-hover-color:unset;
         --bs-pagination-hover-bg:unset;
         --bs-pagination-hover-border-color:unset;

         --bs-pagination-focus-color:unset;
         --bs-pagination-focus-bg:unset;
         --bs-pagination-focus-box-shadow:unset;

         --bs-pagination-active-color:unset;
         --bs-pagination-active-bg:unset;
         --bs-pagination-active-border-color:unset;
         */

         --bs-pagination-disabled-color:unset;
         --bs-pagination-disabled-bg:unset;
         --bs-pagination-disabled-border-color:unset;


    }

    .paginationatt .page-item{
        border: darkgray 1px solid;
        width: 38px;
        height: 38px;
        line-height: 38px;
        margin: 2px;
        border-radius: 20px;
        -moz-border-radius:20px;
        -webkit-border-radius:20px;
        -khtml-border-radius:20px;
        -o-border-radius:20px;
        text-align: center;
        font-size: 15px;
    }

    .paginationatt .disabled{
        width: 38px;
        height: 38px;
        line-height: 38px;
        background-color:#dee2e6;
        color: rgba(33, 37, 41, 0.75);
        border-radius: 20px;
        -moz-border-radius:20px;
        -webkit-border-radius:20px;
        -khtml-border-radius:20px;
        -o-border-radius:20px;
        text-align: center;
        font-size: 15px;
    }

    .active>.page-link, .page-link.active {
        z-index: 3;
        color: var(--bs-pagination-active-color);
        background-color: var(--bs-pagination-active-bg);
        border-color: var(--bs-pagination-active-border-color);
        border-radius: 20px;
        -moz-border-radius:20px;
        -webkit-border-radius:20px;
        -khtml-border-radius:20px;
        -o-border-radius:20px;
    }

}