﻿
/*----------------------_Layout Header----------------------*/
/*Title Logo*/
.sinoah_logo {
    width: 200px;
}

.box-shadow {
    box-shadow: 0 0.25rem 0.75rem rgb(0 0 0 / 5%);
}


/*----------------------_Layout Footer----------------------*/
.footer {
    text-align: center;
    background-color: black;
    /*position: absolute;*/
    /*position:fixed;*/
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px;
}

/*下底色塊*/
.footerBase {
    content: "";
    height: 10px;
    width: 100%;
    display: block;
    background: linear-gradient( 90deg, #63a7cc 30.4785%,rgba(0, 0, 0, 0) 10.4785%), 
                linear-gradient( 90deg, #70ba2d 52.15788%, rgba(0, 0, 0, 0) 30.15788%), 
                linear-gradient( 90deg, #fac01a 100%, rgba(0, 0, 0, 0) 100%);
}


/*----------------------共用參數----------------------*/
.body_width {
    max-width: 80%;
    /*background-color: darkgray;*/
    margin: 0px auto; /*水平置中*/
}

/*分頁Title Name標題圖片*/
@media (min-width: 100px) and (max-width: 860px) {
    .tabs_img_width {
        max-width: 100%;
        margin: 0px auto; /*水平置中*/
    }
}
/*分頁Title Name標題圖片*/
@media (min-width: 861px) {
    .tabs_img_width {
        max-width: 80%;
        margin: 0px auto; /*水平置中*/
    }
}


@media (min-width: 768px) {
    .body_page_hander {
        height: 70px;
        /*background-color: aqua;*/
    }
}

@media (min-width: 100px) and (max-width: 767px) {
    .body_page_hander {
        height: 64px;
        /*background-color: aqua;*/
    }
}

@media (min-width: 100px) and (max-width: 575px) {
    /*持續到解析度100都是25%*/
    .col-sm-3 {
        flex: 0 0 auto;
        width: 50%;
    }
}

/*大綱標題*/
h3 span {
    font-size: 18px;
}


/*----------------------頁籤索引 Tab index----------------------*/
.tabs_page_index {
    height: 30px;
    /*background-color: #f7f7f7;*/
}
.tabs_page_img {
    height: 40vh;
    max-height: 40vh;
}

.arrows {
    white-space: nowrap;
}

    .arrows li {
        display: inline-block;
        line-height: 26px;
        margin: 0 9px 0 -10px;
        padding: 0 20px;
        position: relative;
    }

        .arrows li::before,
        .arrows li::after {
            border-right: 1px solid #666666;
            content: '';
            display: block;
            height: 50%;
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            z-index: -1;
            transform: skewX(45deg);
        }

        .arrows li::after {
            bottom: 0;
            top: auto;
            transform: skewX(-45deg);
        }

        .arrows li:last-of-type::before,
        .arrows li:last-of-type::after {
            display: none;
        }

        .arrows li a {
            font: bold 14px Sans-Serif; /*頁籤字體大小*/
            letter-spacing: -1px;
            text-decoration: none;
        }

        .arrows li:nth-of-type(1) a {
            color: hsl(0, 0%, 70%);
        }

        .arrows li:nth-of-type(2) a {
            color: hsl(0, 0%, 65%);
        }

        .arrows li:nth-of-type(3) a {
            color: hsl(0, 0%, 50%);
        }

        .arrows li:nth-of-type(4) a {
            color: hsl(0, 0%, 45%);
        }
