body {
    font-family: '微軟正黑體','新細明體' !important;
    padding: 0px;
    margin: 0px;
    height: 100%;
    width: 100%;
    background:#fafafa
}

.body-content {
    min-height: 90vh;
}

a:hover {
    text-decoration: none;
}

.text_indent {
    text-indent: 2em;
}

.text_over {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.img_full {
    width: 100vh;
    height: 100vh;
}

/* vertical line */
.verticalLine_lightGray {
    border-right: 1px solid #dddddd;
}

.verticalLine_white {
    border-right: 1px solid #FFF;
}

@media (max-width: 768px) {
    .verticalLine_lightGray {
        border-right: none;
    }

    .verticalLine_white {
        border-right: none;
    }
}

/* custom label tips style */
.label-primary {
    background-color: #f5d4d7;
    color: #681420;
    /*border-radius: 5px 5px;*/
    /*font-size: 12px;
    font-family: '微軟正黑體';*/
}

    .label-primary[href]:hover,
    .label-primary[href]:focus {
        background-color: #FFFFFF;
    }

/* custom grid system (5 column) */
.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}


.col-xs-15 {
    width: 20%;
    float: left;
}

@media (min-width: 768px) {
    .col-sm-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

.page_main_title {
    color: #2f426a;
    font-weight: 700;
}

.page_search_title {
    padding-right: 6px;
    letter-spacing: 1px;
}

.page_item_title {
    border-left: 10px solid #d3949c;
}

/*--- nopadding ---*/
.nopadding {
    padding: 0 !important;
    margin: 0 !important;
}

/*--- box shadow ---*/
.boxShadow {
    box-shadow: 1px 1px 6px 1px rgba(20%,20%,40%,0.3);
}

/*--- navbar style ---*/
.navbar-custom {
    background: #72443B; /* Old browsers */
    /*background: -moz-linear-gradient(top, #6c3965 0%, #522865 47%, #381665 100%);*/ /* FF3.6-15 */
    /*background: -webkit-linear-gradient(top, #6c3965 0%,#522865 47%,#381665 100%);*/ /* Chrome10-25,Safari5.1-6 */
    /*background: linear-gradient(to bottom, #6c3965 0%,#522865 47%,#381665 100%);*/ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6c3965', endColorstr='#381665',GradientType=0 ); /* IE6-9 */
    /*background-color: #680a00;
    background-color: rgba(62, 111, 163, 0.70);
    border: 0px none;
    border-bottom: 1px #c0c0c0 solid;
    box-shadow: 4px 4px 12px 4px rgba(20%,20%,20%,0.5);
    transition: 0.5s;*/
}

    .navbar-custom .navbar-brand {
/*        background: rgba(60, 46, 75, 0.80);*/
        color: #FFF;
        transition: 0.5s;
        font-size: 22px;
        margin:5px 0;
    }

    /*.navbar-custom .navbar-brand:hover,
        .navbar-custom .navbar-brand:focus {
            color: #FFF;
            background-color: #681420;
        }*/

    .navbar-custom .navbar-text {
        color: #000;
    }

    .navbar-custom .navbar-nav > li > a {
        color: #FFF;
        border-radius:5px;
        margin:2px;
    }

        .navbar-custom .navbar-nav > li > a:hover,
        .navbar-custom .navbar-nav > li > a:focus {
            color: #6c3965;
            background-color: #FFF;
        }

    .navbar-custom .navbar-nav > .active > a,
    .navbar-custom .navbar-nav > .active > a:hover,
    .navbar-custom .navbar-nav > .active > a:focus {
        color: #FFF;
        background-color: #680a00;
    }

    .navbar-custom .navbar-nav > .disabled > a,
    .navbar-custom .navbar-nav > .disabled > a:hover,
    .navbar-custom .navbar-nav > .disabled > a:focus {
        color: #cccccc;
        background-color: transparent;
    }

    .navbar-custom .navbar-toggle {
        border-color: #dddddd;
    }

        .navbar-custom .navbar-toggle:hover,
        .navbar-custom .navbar-toggle:focus {
            background-color: #dddddd;
        }

        .navbar-custom .navbar-toggle .icon-bar {
            background-color: #cccccc;
        }

    .navbar-custom .navbar-collapse,
    .navbar-custom .navbar-form {
        border-color: #ddd;
    }

    .navbar-custom .navbar-nav > .dropdown > a:hover .caret,
    .navbar-custom .navbar-nav > .dropdown > a:focus .caret {
        border-top-color: #c0c0c0;
        border-bottom-color: #c0c0c0;
    }

    .navbar-custom .navbar-nav > .open > a,
    .navbar-custom .navbar-nav > .open > a:hover,
    .navbar-custom .navbar-nav > .open > a:focus {
        background-color: #C7B79D;
        color: #FFF;
    }

        .navbar-custom .navbar-nav > .open > a .caret,
        .navbar-custom .navbar-nav > .open > a:hover .caret,
        .navbar-custom .navbar-nav > .open > a:focus .caret {
            border-top-color: #c0c0c0;
            border-bottom-color: #c0c0c0;
        }

    .navbar-custom .navbar-nav > .dropdown > a .caret {
        border-top-color: #ffffff;
        border-bottom-color: #ffffff;
    }


@media (max-width: 767) {
    .navbar-custom .navbar-nav .open .dropdown-menu > li > a {
        color: #ffffff;
    }

        .navbar-custom .navbar-nav .open .dropdown-menu > li > a:hover,
        .navbar-custom .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #c0c0c0;
            background-color: transparent;
        }

    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a,
    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-custom .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #c0c0c0;
        background-color: #355f8b;
    }

    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a,
    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-custom .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #cccccc;
        background-color: transparent;
    }
}

.navbar-custom .navbar-link {
    color: #680a00;
}

    .navbar-custom .navbar-link:hover {
        color: #c0c0c0;
    }

/*--- table style manage ---*/
.table_manage {
    width: 100%;
    margin-bottom: 20px;
}

    .table_manage tbody tr {
        border: 0;
    }

    .table_manage tr:nth-child(odd) {
        background: #f7f7f7;
    }

    .table_manage tr:nth-child(even) {
        background-color: #cfd3dc;
    }

    .table_manage tr:hover {
        background: #e4e4e4;
    }

    .table_manage th {
        background: #576685;
        padding: 15px 10px;
        border-spacing: 10px 10px;
        letter-spacing: 1px;
    }

        .table_manage th, .table_manage th > a {
            color: #fffeff;
            transition: .5s;
        }

            .table_manage th > a:hover {
                text-decoration: none;
                color: #e3e6ea;
                transition: .5s;
            }

            .table_manage th > a:focus {
                text-decoration: none;
            }

            .table_manage th > a::after {
                font-family: FontAwesome;
                content: "\f0dc";
                margin-left: 3px;
            }

    .table_manage > tbody > tr > td {
        padding: 15px 10px;
        border-spacing: 10px 10px;
        color: #2f4f70;
    }

    .table_manage th, td {
        text-align: center;
    }

    .table_manage > tbody > tr > th {
        background: #8393b4;
    }

/* - -- - - */
table.tableStyle02 {
    width: 100%;
}

    table.tableStyle02 tr th {
        padding-right: 10px;
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        background: #681420;
        color: #FFF;
        text-align: center;
        border-bottom: 6px #FFF solid;
    }

        table.tableStyle02 tr th a {
            text-decoration: underline;
            color: #595757;
        }


    table.tableStyle02 tr {
        border: 0;
    }

        table.tableStyle02 tr td {
            padding-right: 10px;
            padding-left: 10px;
            padding-top: 10px;
            padding-bottom: 10px;
            border-bottom: 6px #FFF solid;
        }

/*table.tableStyle02 tr:hover {
        background-color: #681420;
        color: #FFF;
    }

    table.tableStyle02 tr td a:hover {
        text-decoration: underline;
    }*/



table.attritubeStyle {
    width: 100%;
    table-layout: fixed;
}

    table.attritubeStyle tr th {
        border: 0;
        border: 3px solid white;
        padding-right: 10px;
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        background: #e0e0e0;
        color: #000;
        border-spacing: 10px 10px;
        text-align: center;
        width: 20%;
    }


    table.attritubeStyle tr td {
        border: 0;
        border-right: 2px solid transparent;
        border-left: 2px solid transparent;
        /*border-bottom: 1px solid #C9C7C5;*/
        padding-right: 10px;
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        border-spacing: 10px 10px;
        color: rgba(51, 51, 51, 1);
    }


table.tableStyle_news tr {
    border: 0;
    border-bottom: 1px solid #d3949c;
}

    table.tableStyle_news tr:hover {
        background: rgba(104,20,32,0.3);
       
    }

    table.tableStyle_news tr td {
        border: 0;
        padding-right: 10px;
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
        border-spacing: 10px 10px;
    }

        table.tableStyle_news tr td a {
            color: #000;
        }

    table.tableStyle_news tr:hover a {
        color: #FFF;
    }


table.weatherStyle {
    width: 100%;
    table-layout: fixed;
}

    table.weatherStyle tr td {
        padding-top: 5px;
        padding-bottom: 5px;
        border-left: 2px solid #FFF;
        border-right: 2px solid #FFF;
    }

    table.weatherStyle img {
        margin: 0px auto;
    }

/*--- table style ---*/
.table_primary {
    width: 100%;
    margin-bottom: 20px;
}

    .table_primary tbody tr {
        border: 0;
    }

    .table_primary tr:nth-child(odd) {
        background: #f7f7f7;
    }

    .table_primary tr:nth-child(even) {
        background-color: #cfd3dc;
    }

    .table_primary tr:hover {
        background: #e4e4e4;
    }

    .table_primary th {
        background: #576685;
        padding: 20px 20px;
        border-spacing: 10px 10px;
        letter-spacing: 1px;
    }

        .table_primary th, .table_primary th > a {
            color: #fffeff;
            transition: .5s;
        }

            .table_primary th > a:hover {
                text-decoration: none;
                color: #e3e6ea;
                transition: .5s;
            }

            .table_primary th > a:focus {
                text-decoration: none;
            }

            .table_primary th > a::after {
                font-family: FontAwesome;
                content: "\f0dc";
                margin-left: 3px;
            }

    .table_primary > tbody > tr > td {
        padding: 20px 10px;
        border-spacing: 10px 10px;
        color: #2f4f70;
    }

    .table_primary th, td {
        text-align: center;
    }

/*--- table style use in survey page ---*/
.table_survey {
    width: 100%;
    margin-bottom: 20px;
}

    .table_survey tbody tr {
        border: 0;
    }

    .table_survey tr:nth-child(odd) {
        background: #E3D7BC;
    }

    .table_survey tr:nth-child(even) {
        background-color: #F2EBDC;
    }

    .table_survey tr:hover {
        background: #C3C1BB;
    }

    .table_survey th {
        background: #A8946D;
        padding: 20px 20px;
        border-spacing: 10px 10px;
        letter-spacing: 1px;
    }

        .table_survey th, .table_survey th > a {
            color: #fffeff;
            transition: .5s;
        }

            .table_survey th > a:hover {
                text-decoration: none;
                color: #e3e6ea;
                transition: .5s;
            }

            .table_survey th > a:focus {
                text-decoration: none;
            }

            .table_survey th > a::after {
                font-family: FontAwesome;
                content: "\f0dc";
                margin-left: 3px;
            }

    .table_survey > tbody > tr > td {
        padding: 20px 10px;
        border-spacing: 10px 10px;
        color: #2f4f70;
        border: 0.5px solid #ddd;
    }

    .table_survey th, td {
        text-align: center;
    }

/* --- table style --- */
.table-boch {
    font-family: 微軟正黑體;
    border-color: #f6d9db;
}

    .table-boch td {
        border-color: #f6d9db !important;
        line-height: 33px !important;
    }

    .table-boch th {
        background-color: #d3949c;
        color: #fff;
        font-weight: bolder;
        border-color: #f6d9db !important;
        text-align: center;
    }

    .table-boch tr:nth-child(even) {
        background-color: #fff;
        font-size: 16px;
    }

    .table-boch tr:nth-child(odd) {
        background-color: #fff7f8;
        font-size: 16px;
    }


/* tab style */
.nav-tabs-style01 {
    border-bottom: 1px solid #d3949c;
}

    .nav-tabs-style01 > li.active > a, .nav-tabs-style01 > li.active > a:focus, .nav-tabs-style01 > li.active > a:hover {
        color: #FFF;
        background-color: #d3949c;
        /*border: 1px solid #d3949c;
        border-bottom-color: transparent;*/
        border: .5px solid #d3949c;
    }

    .nav-tabs-style01 > li > a {
        color: #94535b;
        border: .5px solid #d3949c;
        font-size: 16px;
    }

    .nav-tabs-style01 > li:hover > a {
        background: #f2d7d7;
    }

    .nav-tabs-style01 > li {
        width: 25%;
        text-align: center;
        background-color: #f8e9e9;
    }


/* div row style */
div.style01_th .row {
    padding: 10px 0px;
    background: gray;
    color: white;
    text-align: center;
    border: 1px solid #6E6D6C;
}

    div.style01_th .row a {
        color: white;
    }

        div.style01_th .row a:hover {
            text-decoration: underline;
        }

        div.style01_th .row a::after {
            font-family: FontAwesome;
            content: "\f0dc";
            margin-left: 3px;
        }

div.style01_td .row {
    padding: 5px 0px;
    text-align: center;
    border-left: 1px solid #6E6D6C;
    border-right: 1px solid #6E6D6C;
    border-bottom: 1px solid #6E6D6C;
}

    div.style01_td .row div {
        vertical-align: middle !important;
    }

    div.style01_td .row:hover {
        background: #C9C7C5;
    }


/* button style */
.btn-solidMain {
    color: #FFF;
    background-color: #681420;
    border-color: #681420;
}

    .btn-solidMain:hover,
    .btn-solidMain:focus,
    .btn-solidMain:active,
    .btn-solidMain.active,
    .open .dropdown-toggle.btn-solidMain {
        color: #681420;
        background-color: transparent;
        border-color: #681420;
    }

    .btn-solidMain:active,
    .btn-solidMain.active,
    .open .dropdown-toggle.btn-solidMain {
        background-image: none;
    }

    .btn-solidMain.disabled,
    .btn-solidMain[disabled],
    fieldset[disabled] .btn-solidMain,
    .btn-solidMain.disabled:hover,
    .btn-solidMain[disabled]:hover,
    fieldset[disabled] .btn-solidMain:hover,
    .btn-solidMain.disabled:focus,
    .btn-solidMain[disabled]:focus,
    fieldset[disabled] .btn-solidMain:focus,
    .btn-solidMain.disabled:active,
    .btn-solidMain[disabled]:active,
    fieldset[disabled] .btn-solidMain:active,
    .btn-solidMain.disabled.active,
    .btn-solidMain[disabled].active,
    fieldset[disabled] .btn-solidMain.active {
        background-color: #681420;
        border-color: #681420;
    }

    .btn-solidMain .badge {
        color: #3D7878;
        background-color: #FFF;
    }


/* button style main */
.btn-main {
    color: #FFF;
    background-color: #681420;
    padding-left: 50px;
    padding-right: 50px;
    font-weight: 700;
    border: 1px solid #681420;
}

    .btn-main:hover,
    .btn-main:focus,
    .btn-main:active,
    .btn-main.active,
    .open .dropdown-toggle.btn-main {
        color: #681420;
        background-color: #FFF;
    }

    .btn-main:active,
    .btn-main.active,
    .open .dropdown-toggle.btn-main {
        background-image: none;
    }

    .btn-main.disabled,
    .btn-main[disabled],
    fieldset[disabled] .btn-main,
    .btn-main.disabled:hover,
    .btn-main[disabled]:hover,
    fieldset[disabled] .btn-main:hover,
    .btn-main.disabled:focus,
    .btn-main[disabled]:focus,
    fieldset[disabled] .btn-main:focus,
    .btn-main.disabled:active,
    .btn-main[disabled]:active,
    fieldset[disabled] .btn-main:active,
    .btn-main.disabled.active,
    .btn-main[disabled].active,
    fieldset[disabled] .btn-main.active {
        background-color: #3D7878;
    }

    .btn-main .badge {
        color: #3D7878;
        background-color: #FFF;
    }


/* btn style secord */
.btn-second {
    color: #FFF;
    background-color: #f24040;
    border-color: #f24040;
}

    .btn-second:hover,
    .btn-second:focus,
    .btn-second:active,
    .btn-second.active,
    .open .dropdown-toggle.btn-second {
        color: #FFF;
        background-color: #ac2424;
        border-color: #ac2424;
    }

    .btn-second:active,
    .btn-second.active,
    .open .dropdown-toggle.btn-second {
        background-image: none;
    }

    .btn-second.disabled,
    .btn-second[disabled],
    fieldset[disabled] .btn-second,
    .btn-second.disabled:hover,
    .btn-second[disabled]:hover,
    fieldset[disabled] .btn-second:hover,
    .btn-second.disabled:focus,
    .btn-second[disabled]:focus,
    fieldset[disabled] .btn-second:focus,
    .btn-second.disabled:active,
    .btn-second[disabled]:active,
    fieldset[disabled] .btn-second:active,
    .btn-second.disabled.active,
    .btn-second[disabled].active,
    fieldset[disabled] .btn-second.active {
        background-color: #f24040;
        border-color: #f24040;
    }

    .btn-second .badge {
        color: #f24040;
        background-color: #FFF;
    }

/* btn style secord */
.btn-third {
    color: #FFF;
    background-color: #454075;
    border-color: #454075;
}

    .btn-third:hover,
    .btn-third:focus,
    .btn-third:active,
    .btn-third.active,
    .open .dropdown-toggle.btn-third {
        color: #454075;
        background-color: transparent;
        border-color: #454075;
    }

    .btn-third:active,
    .btn-third.active,
    .open .dropdown-toggle.btn-third {
        background-image: none;
    }

    .btn-third.disabled,
    .btn-third[disabled],
    fieldset[disabled] .btn-third,
    .btn-third.disabled:hover,
    .btn-third[disabled]:hover,
    fieldset[disabled] .btn-third:hover,
    .btn-third.disabled:focus,
    .btn-third[disabled]:focus,
    fieldset[disabled] .btn-third:focus,
    .btn-third.disabled:active,
    .btn-third[disabled]:active,
    fieldset[disabled] .btn-third:active,
    .btn-third.disabled.active,
    .btn-third[disabled].active,
    fieldset[disabled] .btn-third.active {
        background-color: #454075;
        border-color: #454075;
    }

    .btn-third .badge {
        color: #454075;
        background-color: #FFF;
    }

/* button style pager */
.btn-pager {
    color: #681420;
    background-color: transparent;
    border-color: transparent;
}

    .btn-pager:hover,
    .btn-pager:focus,
    .btn-pager:active,
    .btn-pager.active,
    .open .dropdown-toggle.btn-pager {
        color: #FFF;
        background-color: #681420;
        border-color: transparent;
    }

    .btn-pager:active,
    .btn-pager.active,
    .open .dropdown-toggle.btn-pager {
        background-image: none;
    }

    .btn-pager.disabled,
    .btn-pager[disabled],
    fieldset[disabled] .btn-pager,
    .btn-pager.disabled:hover,
    .btn-pager[disabled]:hover,
    fieldset[disabled] .btn-pager:hover,
    .btn-pager.disabled:focus,
    .btn-pager[disabled]:focus,
    fieldset[disabled] .btn-pager:focus,
    .btn-pager.disabled:active,
    .btn-pager[disabled]:active,
    fieldset[disabled] .btn-pager:active,
    .btn-pager.disabled.active,
    .btn-pager[disabled].active,
    fieldset[disabled] .btn-pager.active {
        color: #FFF;
        background-color: #681420;
        border-color: transparent;
    }

    .btn-pager .badge {
        color: #FFF;
        background-color: #681420;
    }

/* button style for search (circle) */
.btn-search_circle {
    color: #FFF;
    background-color: #d3949c;
    border-color: #d3949c;
    border-radius: 50%;
    padding: 6px 10px;
}

.btn-search-circle:hover,
.btn-search-circle:focus,
.btn-search-circle:active,
.btn-search-circle.active,
.open .dropdown-toggle.btn-search-circle {
    color: #d3949c;
    background-color: transparent;
    border-color: #d3949c;
}

.btn-search-circle:active,
.btn-search-circle.active,
.open .dropdown-toggle.btn-search-circle {
    background-image: none;
}

.btn-search-circle.disabled,
.btn-search-circle[disabled],
fieldset[disabled] .btn-search-circle,
.btn-search-circle.disabled:hover,
.btn-search-circle[disabled]:hover,
fieldset[disabled] .btn-search-circle:hover,
.btn-search-circle.disabled:focus,
.btn-search-circle[disabled]:focus,
fieldset[disabled] .btn-search-circle:focus,
.btn-search-circle.disabled:active,
.btn-search-circle[disabled]:active,
fieldset[disabled] .btn-search-circle:active,
.btn-search-circle.disabled.active,
.btn-search-circle[disabled].active,
fieldset[disabled] .btn-search-circle.active {
    background-color: #d3949c;
    border-color: #d3949c;
}

.btn-search-circle .badge {
    color: #3D7878;
    background-color: #FFF;
}

/*--- button style (detail page use) ---*/
.btn-darkBlue {
    color: #FFF;
    background-color: #30426a;
    border-color: #30426a;
}

    .btn-darkBlue:hover,
    .btn-darkBlue:focus,
    .btn-darkBlue:active,
    .btn-darkBlue.active,
    .open .dropdown-toggle.btn-darkBlue {
        color: #FFF;
        background-color: #69799c;
        border-color: #69799c;
    }

    .btn-darkBlue:active,
    .btn-darkBlue.active,
    .open .dropdown-toggle.btn-darkBlue {
        background-image: none;
    }

    .btn-darkBlue.disabled,
    .btn-darkBlue[disabled],
    fieldset[disabled] .btn-darkBlue,
    .btn-darkBlue.disabled:hover,
    .btn-darkBlue[disabled]:hover,
    fieldset[disabled] .btn-darkBlue:hover,
    .btn-darkBlue.disabled:focus,
    .btn-darkBlue[disabled]:focus,
    fieldset[disabled] .btn-darkBlue:focus,
    .btn-darkBlue.disabled:active,
    .btn-darkBlue[disabled]:active,
    fieldset[disabled] .btn-darkBlue:active,
    .btn-darkBlue.disabled.active,
    .btn-darkBlue[disabled].active,
    fieldset[disabled] .btn-darkBlue.active {
        background-color: #24355b;
        border-color: #24355b;
    }

    .btn-darkBlue .badge {
        color: #454075;
        background-color: #FFF;
    }

/*--- button style (detail page use) ---*/
.btn-pink {
    color: #FFF;
    background-color: #d3949c;
    border-color: #d3949c;
}

    .btn-pink:hover,
    .btn-pink:focus,
    .btn-pink:active,
    .btn-pink.active,
    .open .dropdown-toggle.btn-pink {
        color: #ddb0b6;
        background-color: transparent;
        border-color: #ddb0b6;
    }

    .btn-pink:active,
    .btn-pink.active,
    .open .dropdown-toggle.btn-pink {
        background-image: none;
    }

    .btn-pink.disabled,
    .btn-pink[disabled],
    fieldset[disabled] .btn-pink,
    .btn-pink.disabled:hover,
    .btn-pink[disabled]:hover,
    fieldset[disabled] .btn-pink:hover,
    .btn-pink.disabled:focus,
    .btn-pink[disabled]:focus,
    fieldset[disabled] .btn-pink:focus,
    .btn-pink.disabled:active,
    .btn-pink[disabled]:active,
    fieldset[disabled] .btn-pink:active,
    .btn-pink.disabled.active,
    .btn-pink[disabled].active,
    fieldset[disabled] .btn-pink.active {
        background-color: #c27f88;
        border-color: #c27f88;
    }

    .btn-pink .badge {
        color: #454075;
        background-color: #FFF;
    }


/*--- hr ---*/
hr.style02 {
    border-top: 1px solid #C9C7C5;
}

/*--- padding ---*/
.padding_T10 {
    padding-top: 10px;
}

.padding_T20 {
    padding-top: 20px;
}

.padding_T30 {
    padding-top: 30px;
}

.padding_B10 {
    padding-bottom: 10px;
}

.padding_B20 {
    padding-bottom: 20px;
}

.padding_B50 {
    padding-bottom: 50px;
}

.padding_TB5 {
    padding-bottom: 5px;
    padding-top: 5px;
}

.padding_TB10 {
    padding-bottom: 10px;
    padding-top: 10px;
}

.padding_TB20 {
    padding-bottom: 20px;
    padding-top: 20px;
}

.padding_TB30 {
    padding-bottom: 30px;
    padding-top: 30px;
}

.padding_T50 {
    padding-top: 50px;
}

.padding_TB80 {
    padding-bottom: 80px;
    padding-top: 80px;
}

.padding_TB50 {
    padding-bottom: 50px;
    padding-top: 50px;
}

.padding_R5 {
    padding-right: 5px;
}

.padding_L5 {
    padding-left: 5px;
}

.padding_LR2 {
    padding-left: 2px;
    padding-right: 2px;
}

.padding_LR10 {
    padding-left: 10px;
    padding-right: 10px;
}

.padding_B80 {
    padding-bottom: 80px;
}

.padding_B5 {
    padding-bottom: 5px;
}

/* margin */

.margin_T10 {
    margin-top: 10px;
}

.margin_B10 {
    margin-bottom: 10px;
}

.margin_TB10 {
    margin-top: 10px;
    margin-bottom: 10px;
}


/* color */

.color_white {
    color: #FFF;
}

.color_lightGray {
    color: #eeeeee;
}

.color_red {
    color: #F00;
}

.color_main {
    color: #681420;
}

.color_main_gray {
    color: #595757;
}

.color_pink {
    color: #f5d4d7;
}

.color_darkPink {
    color: #E63336;
}

.color_black {
    color: #000;
}

.color_index4Content {
    color: #f2a3a3;
}

.color_purple {
    color: #454075;
}

.color_darkBlue {
    color: #2f426a;
}

.color_lightPink {
    color: #d3949c;
}

.color_darkBlue2 {
    color: #30426a;
}

/* bg color */

.bg_white {
    background: #FFF;
}

.bg_none {
    background: transparent;
}

.bg_gray {
    background: #E9EAEC;
}

.bg_blue {
    background: #D2E9FF;
}

.bg_darkGray {
    background: #4f4d4d;
}

.bg_lightGray {
    background: #f2f0f0;
}

.bg_main {
    background: #680a00;
}

.bg_pink {
    background: #f5d4d7;
}

.bg_darkPink {
    background: #E63336;
}

.bg_pink02 {
    background: #b52157;
}

.bg_purple {
    background: #454075;
}

.bg_darkBlue {
    background: #192648;
}

.bg_orange {
    background: #FFE4CA;
}

.bg_darkBlue2 {
    background: #30426a;
}

.bg_lightPurple {
    background: #707b97;
}

.bg_lightGray2 {
    background: #f4f0ef;
}


/* border */
.border_main {
    text-decoration: none;
    border-bottom: 5px solid #d3949c;
}

.border_secord {
    text-decoration: none;
    border-bottom: 2px solid #C9C7C5;
}

.border_2pink {
    border: 2px solid #b52157;
}

.border_T2Pink {
    border-top: 2px solid #b52157;
}

.border_R2Pink {
    border-right: 2px solid #b52157;
}

.border_B5Purple {
    text-decoration: none;
    border-bottom: 5px solid #454075;
}

.border_R2Blue {
    border-right: 2px solid #606f8c;
}

.border_R2White {
    border-right: 2px solid #fff;
}

.broder_B10Pink {
    border-bottom: 10px solid #d5949a;
}

/* hover */
.hover_pink:hover {
    background: #f5d4d7;
}


/* font size */
.font_40 {
    font-size: 40px;
}

.font_32 {
    font-size: 32px;
}

.font_28 {
    font-size: 28px;
}

.font_24 {
    font-size: 24px;
}

.font_20 {
    font-size: 20px;
}

.font_16 {
    font-size: 16px;
}

.font_10 {
    font-size: 10px;
}


/* breadcrumbs */

.breadcrumbs_style {
    background: #f7f7f7;
    letter-spacing: 1px;
    padding: 10px 0px;
    /*margin-top: 50px;*/
    margin-top: -20px;
}

    .breadcrumbs_style a {
        color: #000;
    }

        .breadcrumbs_style a:hover {
            color: #680a00;
            text-decoration: none;
        }

/* footer */
footer .title {
    font-size: 16px;
    color: #fff;
    text-decoration: none;
}

footer .inner {
    font-size: 16px;
    color: #e5b77e;
    text-decoration: none;
    display: inline;
}


/*--- 文化資產在地資料 步驟 樣式 start ---*/
.rl-multi-step {
    margin: 0.5em 0;
}

.rl-multi-step-list {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    list-style-type: none;
    padding: 0;
}

    .rl-multi-step-list .rl-multi-step-item:first-child {
        margin-left: 0;
    }

    .rl-multi-step-list .rl-multi-step-item:last-child {
        margin-right: 0;
    }

.rl-multi-step-item {
    position: relative;
    width: 100%;
    margin: 0 0.16666667em;
    z-index: 2;
    border-radius: 0.2em;
}

@media only screen and (max-width: 786px) {
    .rl-multi-step-item {
        margin: 0 0.16666667em;
    }
}

.rl-multi-step-item .rl-item-title,
.rl-multi-step-item .rl-item-subtitle {
    position: relative;
    margin: 0;
    z-index: 2;
}

@media only screen and (max-width: 786px) {
    .rl-multi-step-item .rl-item-subtitle {
        display: none;
    }
}

.rl-multi-step-item .rl-item-title {
    color: #d3949c;
    font-weight: 600;
    margin: 0;
    padding-left: .5em;
}

.rl-multi-step-item.active:hover {
    cursor: pointer;
}

.rl-multi-step-item.current .rl-item-title,
.rl-multi-step-item.current .rl-item-subtitle {
    color: #fff;
}

.rl-multi-step-item.active.current:hover .rl-item-title,
.rl-multi-step-item.active.current:hover .rl-item-subtitle {
    color: #4285f4;
}

.rl-multi-step-item.error:after {
    position: absolute;
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
    right: 0.5em;
    font-family: FontAwesome;
    content: "\f071";
    color: #d50000;
}

.rl-item-wrap {
    padding: 0.5em;
    position: relative;
    height: 100%;
}

    .rl-item-wrap:before,
    .rl-item-wrap:after {
        position: absolute;
        left: 0;
        content: " ";
        width: 100%;
        height: 50.5%;
        z-index: 1;
        background-color: #eee;
    }

    .rl-item-wrap:before {
        top: 0;
        transform: skew(20deg);
        border-radius: 0.2em 0.2em 0 0;
    }

    .rl-item-wrap:after {
        bottom: 0;
        transform: skew(-20deg);
        border-radius: 0 0 0.2em 0.2em;
    }

.current .rl-item-wrap:before,
.current .rl-item-wrap:after {
    background-color: #d3949c;
}

.active:hover .rl-item-wrap:before,
.active:hover .rl-item-wrap:after {
    background-color: #d8f1ff;
}

.rl-multi-step-item.error .rl-item-title,
.rl-multi-step-item.error .rl-item-subtitle {
    padding-right: 1em;
}

.rl-multi-step-item:first-child .rl-item-wrap,
.rl-multi-step-item:last-child .rl-item-wrap {
    width: 100%;
    border-radius: 0.2em;
}

    .rl-multi-step-item:first-child .rl-item-wrap:before,
    .rl-multi-step-item:last-child .rl-item-wrap:before,
    .rl-multi-step-item:first-child .rl-item-wrap:after,
    .rl-multi-step-item:last-child .rl-item-wrap:after {
        width: 50%;
    }

.rl-multi-step-item:first-child .rl-item-wrap {
    background: linear-gradient(to right, #eee 95%, transparent 5%);
}

    .rl-multi-step-item:first-child .rl-item-wrap:before,
    .rl-multi-step-item:first-child .rl-item-wrap:after {
        left: 50%;
    }

.active.rl-multi-step-item:first-child:hover .rl-item-wrap {
    background: linear-gradient(to right, #d8f1ff 95%, transparent 5%);
}

.current.rl-multi-step-item:first-child .rl-item-wrap {
    background: linear-gradient(to right, #d3949c 95%, transparent 5%);
}

.rl-multi-step-item:last-child .rl-item-wrap {
    background: linear-gradient(to left, #eee 95%, transparent 5%);
}

    .rl-multi-step-item:last-child .rl-item-wrap:before,
    .rl-multi-step-item:last-child .rl-item-wrap:after {
        right: 50%;
    }

.active.rl-multi-step-item:last-child:hover .rl-item-wrap {
    background: linear-gradient(to left, #d8f1ff 95%, transparent 5%);
}

.current.rl-multi-step-item:last-child .rl-item-wrap {
    background: linear-gradient(to left, #d3949c 95%, transparent 5%);
}

.checked .rl-multi-step-item.completed:after {
    position: absolute;
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
    right: 0.5em;
    font-family: FontAwesome;
    content: "\f00c";
    color: #54b948;
}

.numbered .rl-multi-step-item {
    counter-increment: step-counter;
}

    .numbered .rl-multi-step-item .rl-item-wrap {
        padding-left: 2.5em;
    }

    .numbered .rl-multi-step-item:before {
        content: counter(step-counter);
        position: absolute;
        top: 50%;
        left: 0.75em;
        transform: translateY(-50%);
        min-width: 1.65em;
        padding: 0.25em 0.5em;
        z-index: 2;
        font-size: 0.85em;
        background-color: #999;
        color: #fff;
        font-weight: 600;
        text-align: center;
        border-radius: 0.2em;
    }

.rl-item-wrap .badge {
    position: absolute;
    right: 0.5em;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
}

.error .rl-item-wrap .badge {
    right: 2em;
}

    .error .rl-item-wrap .badge ~ .rl-item-title,
    .error .rl-item-wrap .badge ~ .rl-item-subtitle {
        padding-right: 3em;
    }

.rl-multi-step-loading {
    opacity: 0.75;
}

.current.rl-multi-step-loading:before {
    border-color: #fff;
    border-top-color: transparent;
    opacity: 1;
}

.rl-item-wrap .busy {
    display: none;
}

.busy-css {
    z-index: 3;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -0.5em;
    margin-left: -0.5em;
    border-radius: 50%;
    width: 1em;
    height: 1em;
    border: 0.25em solid #333;
    border-top-color: transparent;
    animation: spin 1s infinite linear;
}

.rl-multi-step-loading:before {
    z-index: 3;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -0.5em;
    margin-left: -0.5em;
    border-radius: 50%;
    width: 1em;
    height: 1em;
    border: 0.25em solid #333;
    border-top-color: transparent;
    animation: spin 1s infinite linear;
    opacity: 1;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/*--- 文化資產在地資料 步驟 樣式 end ---*/

/*--- navbar icon bar show when screen max 1200px  ---*/
@media (min-width: 768px) and (max-width: 1200px) {
    .navbar-collapse.collapse {
        display: none !important;
    }

        .navbar-collapse.collapse.in {
            display: block !important;
        }

    .navbar-header .collapse, .navbar-toggle {
        display: block !important;
    }

    .navbar-header {
        float: none;
    }
}

.icheck-pink > input:first-child:not(:checked):not(:disabled):hover + label::before,
.icheck-pink > input:first-child:not(:checked):not(:disabled):hover + input[type="hidden"] + label::before {
    border-color: #D3949C;
}

.icheck-pink > input:first-child:checked + label::before,
.icheck-pink > input:first-child:checked + input[type="hidden"] + label::before {
    background-color: #D3949C;
    border-color: #D3949C;
}

.form-beautify {
    background-color: #eee;
    border-radius: 10px;
    padding: 5vh 3vw;
}

.table-light {
    width: 100%;
}

    .table-light th {
        text-align: center;
    }

    .table-light tbody th, .table-light tbody td {
        border: 1px solid #d6cce0;
        padding: 1.5vh 2vw;
    }

    .table-light th {
        background-color: rgb(151, 127, 175);
        color: #fff;
    }

.leaflet-eq-near::after {
    content: ' ';
    /*background: #4e4e4e;*/
    background-image: linear-gradient(to bottom, #606060, rgba(96, 96, 96,0.8), rgba(96, 96, 96,0.5), rgba(196, 96, 96, 0.3), rgba(96, 96, 96,0));
    height: 15px;
    width: 2px;
    left: 10px;
    position: absolute;
    text-align: center;
}
.leaflet-eq-near.level-1 div{
    background:#606060
}
.leaflet-eq-near.level-2 div{
    background:#1f5fad
}
.leaflet-eq-near.level-3 div, .leaflet-eq-near.level-4 div{
    background:#2d9728
}
.leaflet-eq-near.level-5 div, .leaflet-eq-near.level-6 div, .leaflet-eq-near.level-7 div{
    background:#f24040
}
.leaflet-eq.very-shallow  .eq-center::after{
     content: ' ';
    background:  linear-gradient(to bottom, #606060, rgba(96, 96, 96,0.8), rgba(96, 96, 96,0.5), rgba(196, 96, 96, 0.3), rgba(96, 96, 96,0));
    height: 10px;
    width: 2px;
     left: 15px;
    bottom:-3px;
    position: absolute;
    text-align: center;
}
.leaflet-eq.shallow  .eq-center::after{
     content: ' ';
    background: linear-gradient(to bottom, #606060, rgba(96, 96, 96,0.8), rgba(96, 96, 96,0.5), rgba(196, 96, 96, 0.3), rgba(96, 96, 96,0));
    height: 20px;
    width: 2px;
    left: 15px;
    bottom:-3px;
    position: absolute;
    text-align: center;
}
.leaflet-eq.intermediate  .eq-center::after{
     content: ' ';
    background:  linear-gradient(to bottom, #606060, rgba(96, 96, 96,0.8), rgba(96, 96, 96,0.5), rgba(196, 96, 96, 0.3), rgba(96, 96, 96,0));
    height: 40px;
    width: 2px;
    left: 15px;
    bottom:-3px;
    position: absolute;
    text-align: center;
}
.leaflet-eq.deep  .eq-center::after{
     content: ' ';
    background:  linear-gradient(to bottom, #606060, rgba(96, 96, 96,0.8), rgba(96, 96, 96,0.5), rgba(196, 96, 96, 0.3), rgba(96, 96, 96,0));
    height: 60px;
    width: 2px;
   left: 15px;
    bottom:-3px;
    position: absolute;
    text-align: center;
}
.ncdr_eventName{
    color:#000
}
.ncdr_eventName.ncdr_地震{
    color:#337ab7;
    cursor:pointer
}