/* 字型 */
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

body {
    font-family: 'Roboto','Open Sans',Arial,Helvetica,sans-serif;
}

section.page-header .breadcrumb>li+li:before {
    content: "•";
}

/* 欄位驗證 */
.error{
    color: #bf6464;
}

/* menu style */
section.featured-grid div.row>div a:hover {
    color: #333;
}
#topMain.nav-pills>li:hover>a, #topMain.nav-pills>li:focus>a {
    color: #1F262D;
    background-color: rgba(0,0,0,0);
}
.menu_new_sytle a{
    padding-top: 0px;
}
.menu_new_sytle a:hover{
    border-width: 3px;
    border-top-style: outset;
    border-color: #3072e0;
}
.menu_new_sytle li{
    float: left;
}
.dropdown-menu li{
    clear: both;
    width: 100%;
}



/* Index*/
    /* 第二區塊 */
    .index_info_2 a{
        color: #FFF !important;
        background-color: transparent;
    }

    .index_info_2 a:active{
        color: #333 !important;
        background-color: #fff !important;
        border-color: #fff !important;
    }   
    .index_info_2 a:hover{
        color: #333 !important;
        background-color: #fff !important;
        border-color: #fff !important;
    }   

    .index_info_2_a{
        border-color: #FFF;
    }
    .index_info_2_img{
        filter:brightness(70%);
    }
    
/* 大於992px以上的尺寸 */
@media (min-width: 992px){
    #header #topNav a.logo>img {
        max-height: 45px !important;
    }
    /* 一般螢幕時位移用 */
    .p_top_100{
        padding-top: 100px;
    }
}


/* 大於768px，小於911.99之間的尺寸，適用於平板 */
@media (min-width: 768px) and (max-width: 991.99px) { 

}

/* 大於576px，小於767.99之間的尺寸，適用於手機橫式時 */
@media (min-width: 576px) and (max-width: 767.99px) { 

}

/* 小於575.99的尺寸，適用一般手機 */
@media (max-width: 575.99px){ 
    
    #header #topNav a.logo>img {
        max-height: 45px !important;
        margin-top: 8px;
    }
    
    /* Index section */
    .index_section{
        border-bottom: rgba(0,0,0,0) 1px solid;
            padding: 15px 0;
    }
    /* 手機 Banner 放大*/
    .banner_img{
            width: 100%;
            overflow: hidden;
            position: relative;
    }
    .banner_img img{
            height: 200px  !important;;
            width: auto  !important;;
            top: 0;
            left: -47px;
            position: relative;
            transition: transform 0.3s;
            
    }
    .banner_img img:hover{
            transform: scale(1.1)
    }
    
    
    

}

/* 大於400px，小於575.99之間的尺寸，適用5.5吋左右螢幕，如iphone plus */
@media (min-width: 400px) and (max-width: 575.99px) { 

}

/* 大於370px，小於399.99之間的尺寸，適用4.8吋左右螢幕，如iphone*/
@media (min-width: 370px) and (max-width: 399.99px) { 

}

/* 大於370px，小於399.99之間的尺寸，適用4.7吋左右螢幕，如note4*/
@media (min-width: 350px) and (max-width: 369.99px) { 

}

/* 小於349.99的尺寸 */
@media (max-width: 349.99px){

}