@charset "utf-8";

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif !important;
}

body, div, dl, dt, dd, ul, ol, li, pre, form, fieldset, input, textarea, blockquote {
    margin: 0;
    padding: 0;
    vertical-align: top;
    text-align: left;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif !important;
}

h1, h2, h3, h4, h5, h6 {
    margin: 3px 0px;
    padding: 3px 0px;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif !important;
}

body {
    -webkit-text-size-adjust: none;
    width: 100%;
    min-width: 320px;
    height: 100%;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
}



.header {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
}

.ADV {
    width: 100%;
    height: auto;
    margin: 0 auto;
    overflow: hidden;
    padding: 0;
}

.article {
    width: 100%;
    height: auto;
    margin: 0 auto;
    overflow: hidden;
}

.footer {
    width: 100%;
    height: auto;
    margin: 0 auto;
    overflow: hidden;
    border-top: 5px solid #FFF;
    background: #00b5ca;
}

.headerbox {
    height: auto;
    width: 1000px;
    margin: 0 auto;
    position: relative;
}

.ADVbox {
    height: auto;
    width: 1240px;
    margin: 0 auto;
    overflow: hidden;
    margin-top: 80px;
    margin-bottom: 5px;
}

.articlebox {
    height: auto;
    width: 1000px;
    margin: 10px auto;
    margin-top: 75px;
}

.footerbox {
    height: auto;
    width: 1000px;
    margin: 0 auto;
    background: url(../frontimages/footership.png) no-repeat bottom right;
}

.headerbox #TOP {
    position: absolute;
    top: -100px;
    padding-top: 25px;
    right: 0px;
    width: 70px;
    height: 70px;
    cursor: pointer;
    z-index: 999;
}

    .headerbox #TOP img {
        width: 100%;
        height: auto;
    }

.topbgsky {
    position: absolute;
    width: 100%;
    height: 104px;
    background: url(../frontimages/topbgsky.png) repeat-x top center;
    z-index: 99;
}

    .topbgsky .topbgskybox {
        height: auto;
        width: 1000px;
        margin: 0 auto;
        position: relative;
    }

        .topbgsky .topbgskybox h1 {
            text-indent: -9999px;
            display: block;
            padding-top: 20px;
        }

        .topbgsky .topbgskybox .logo {
            width: 368px;
            height: 66px;
            float: left;
            background: url(../frontimages/logo.png) center left no-repeat;
        }

        .topbgsky .topbgskybox .topnav {
            position: absolute;
            top: 40px;
            right: 0;
            color: #FFF;
            font-size: 80%;
        }

            .topbgsky .topbgskybox .topnav a.home {
                color: #FFF;
                background: url(../frontimages/nav_01.png) no-repeat left center;
                padding-left: 25px;
            }
            /*.topbgsky .topbgskybox .topnav a:nth-child(2){ background:url(../frontimages/nav_02.png)no-repeat left center;}*/
            .topbgsky .topbgskybox .topnav a:hover {
                text-decoration: underline;
            }

.topmenu {
    clear: both;
    width: 100%;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    position: absolute;
    z-index: 99999;
    margin-bottom: 20px;
    background: #f0f0f0;
    .background:#f0f0f0; /*IE6/.IE7*/
    background: linear-gradient(#f8f8f8 50%, #e5e5e5 50%);
    background: -webkit-linear-gradient(#f8f8f8 50%, #e5e5e5 50%); /*Chrome10+,Safari5.1+*/
    background: -ms-linear-gradient(#f8f8f8 50%, #e5e5e5 50%); /*IE10+*/
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#e5e5e5',GradientType=0); /*IE6-9*/
}

    .topmenu .container {
        width: 1000px;
        margin: 0 auto;
        position: relative;
        height: 48px;
        color: #434343;
    }



#menu {
    margin: 0;
    text-decoration: none;
    padding: 0;
    list-style: none;
    position: relative;
    width: 100%;
    float: left;
    background: none;
    font-family: "微軟正黑體", "新細明體", "細明體",Arial, Helvetica, sans-serif;
}

    #menu ul {
        width: 100%;
        height: 48px;
    }

    #menu li {
        width: 100%;
        margin: 0;
        padding: 0;
        float: left;
        text-decoration: none;
        text-align: center;
        font-size: 120%;
    }

    #menu > li {
        width: auto;
        min-width: 16.66%;
        max-width: 16.66%;
        border-right: 1px solid rgba(255,255,255,0.5);
        position: relative;
        padding-left: 40px;
    }

        #menu > li:first-child {
            border-left: 1px solid rgba(255,255,255,0.5);
        }

        #menu > li:nth-child(1) {
            background: url(../frontimages/mu_icon01.png) no-repeat 15px center;
            border-bottom: 5px solid #fb7785;
        }

        #menu > li:nth-child(2) {
            background: url(../frontimages/mu_icon02.png) no-repeat 15px center;
            border-bottom: 5px solid #69bada;
        }

        #menu > li:nth-child(3) {
            background: url(../frontimages/mu_icon03.png) no-repeat 15px center;
            border-bottom: 5px solid #ba78c8;
        }

        #menu > li:nth-child(4) {
            background: url(../frontimages/mu_icon04.png) no-repeat 15px center;
            border-bottom: 5px solid #ff9600;
        }

        #menu > li:nth-child(5) {
            background: url(../frontimages/mu_icon05.png) no-repeat 15px center;
            border-bottom: 5px solid #abca4a;
        }

        #menu > li:nth-child(6) {
            background: url(../frontimages/mu_icon06.png) no-repeat 15px center;
            border-bottom: 5px solid #35bad2;
        }

    #menu li > a {
        line-height: 48px;
        padding: 0 10px;
        width: auto;
        display: block;
        color: #434343;
        text-decoration: none;
        font-weight: bold;
    }

    #menu > li:hover {
        background: #FFF;
        text-decoration: none;
    }

        #menu > li:hover:nth-child(1) {
            background: #FFF url(../frontimages/mu_icon01.png) no-repeat 15px center;
        }

        #menu > li:hover:nth-child(2) {
            background: #FFF url(../frontimages/mu_icon02.png) no-repeat 15px center;
        }

        #menu > li:hover:nth-child(3) {
            background: #FFF url(../frontimages/mu_icon03.png) no-repeat 15px center;
        }

        #menu > li:hover:nth-child(4) {
            background: #FFF url(../frontimages/mu_icon04.png) no-repeat 15px center;
        }

        #menu > li:hover:nth-child(5) {
            background: #FFF url(../frontimages/mu_icon05.png) no-repeat 15px center;
        }

        #menu > li:hover:nth-child(6) {
            background: #FFF url(../frontimages/mu_icon06.png) no-repeat 15px center;
        }

    #menu li > ul {
        margin: 0;
        line-height: 150%;
        list-style: none;
        position: absolute;
        top: 48px;
        left: 0;
        width: auto;
        height: auto;
        color: #000;
        background: #eee;
        border: 1px solid #CCC;
        display: none;
    }

    #menu li ul li {
        float: left;
        display: block;
        width: 100%;
        border-bottom: 1px solid rgba(0,0,0,0.1);
        font-size: 85%;
    }

        #menu li ul li a {
            display: block;
            color: #333;
            width: 100%;
            line-height: 250%;
            text-decoration: none;
        }

        #menu li ul li:hover {
            text-decoration: none;
            color: #000;
            background: #FFF;
        }




.article .articlebox .pagebanner {
    position: relative;
    width: 100%;
    height: auto;
    margin: 10px auto;
    clear: both;
    overflow: hidden;
    margin-top: 58px;
}

    .article .articlebox .pagebanner img {
        width: 100%;
    }

.article .articlebox .pagetitle {
    position: absolute;
    top: 40%;
    left: 5%;
    font-size: 200%;
    color: #FFF;
    text-shadow: 0 1px 1px rgba(0,0, 0, 0.4);
}

    .article .articlebox .pagetitle span {
        font-size: 90%;
        color: rgba(255,255,255,0.7);
        font-weight: normal;
    }

/*標題*/
.article .articlebox .title {
    font-size: 170%;
    color: #00b5ca;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    margin: 10px 0;
}

    .article .articlebox .title span {
        color: #CCC;
        font-weight: normal;
    }

/*--topfrom麵包屑--*/
#topfrom {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0px auto;
    padding: 5px 0px;
    font-size: 90%;
}

    #topfrom a {
        color: #666;
        text-decoration: none;
        padding: 0px 3px;
    }

        #topfrom a:hover {
            color: #333;
            text-decoration: underline;
        }

.tabbtn_on {
    background-color: #F00;
}


/*航班區塊*/

.FLIGHT {
    float: none;
    position: relative;
    width: 100%;
    height: auto;
    margin: 0px 0 20px 0;
    opacity: 1;
    background-color: #FFF;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    border: 1px solid #eee;
    padding: 0 15px 10px 15px;
}

    .FLIGHT .corner_css {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 0;
        border-color: #2984ad transparent transparent transparent;
        margin-left: -15px;
        position: absolute;
    }

    .FLIGHT .title {
        font-size: 150%;
        color: #2984ad;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        margin: 10px 0;
    }

        .FLIGHT .title span {
            font-size: 80%;
            color: #d8d8d8;
            font-weight: normal;
        }

.F_MENU {
    width: 100%;
    height: 45px;
    position: absolute;
    margin-left: -15px;
}

    .F_MENU ul {
        width: 100%;
        height: 45px;
        list-style: none;
        background: #51a9cb;
        .background:#51a9cb;
        background: linear-gradient(#69bada 50%, #51a9cb 50%);
        background: -webkit-linear-gradient(#69bada 50%, #51a9cb 50%);
        background: -ms-linear-gradient(#69bada 50%, #51a9cb 50%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69bada', endColorstr='#51a9cb',GradientType=0);
    }

        .F_MENU ul li {
            float: left;
            width: 25%;
            height: 45px;
        }

            .F_MENU ul li.L {
                font-size: 110%;
                font-weight: bold;
                line-height: 50px;
                text-align: center;
                color: #51a9cb;
            }

                .F_MENU ul li.L span {
                    background-color: #FFF;
                    padding: 10px 25px;
                    border-radius: 8px 8px 0 0;
                }

.FLIGHT .F_BOX .LOW li h1 {
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    font-size: 24px;
}

.F_MENU ul li a {
    display: block;
    width: 100%;
    height: 45px;
    color: #FFF;
    font-size: 100%;
    font-weight: bold;
    line-height: 45px;
    text-align: center;
    text-decoration: none;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
}

    .F_MENU ul li a:hover {
        background-color: #2984ad;
        color: #FFF;
    }

.F_BOX {
    width: 100%;
    height: auto;
    background-color: #FFF;
    padding: 0px 10px;
    padding-top: 45px;
    overflow: hidden;
}

    .F_BOX ul {
        width: 100%;
        height: 40px;
        border-bottom: 1px solid #fff;
        list-style: none;
    }

    .F_BOX h1 {
        text-align: center;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        color: #175271;
        font-size: 24px;
        margin: 10px 0;
    }

    .F_BOX p.T01_SS {
        float: left;
        height: 40px;
        line-height: 40px;
        font-size: 90%;
    }

    .F_BOX .BT {
        float: right;
        margin-top: 10px;
    }

        .F_BOX .BT a {
            color: rgba(255,255,255,0.8);
            font-size: 80%;
            background-color: rgba(115,153,168,0.8);
            padding: 5px;
            border-radius: 6px;
        }

            .F_BOX .BT a:hover {
                background-color: #369;
            }

    .F_BOX #css_table_tablayout {
        display: table;
        width: 100%;
        letter-spacing: normal;
    }

        .F_BOX #css_table_tablayout .css_tr {
            display: table-row;
            width: 100%;
            .border-bottom:#188fa7 2px solid;
            .display: inline-block;
        }

            .F_BOX #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: transparent;
                .display: inline-block;
            }
            /*標題部分*/
            .F_BOX #css_table_tablayout .css_tr:first-child {
                font-weight: bold;
                background-color: #30c1d8;
                color: #FFFFFF;
                _display: none;
                .display: none;
            }

                .F_BOX #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .F_BOX #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

        .F_BOX #css_table_tablayout .css_td {
            display: table-cell;
            padding: 6px 0px;
            min-width: 50px;
            .display: block;
            border-bottom: #95afb9 1px solid;
            text-align: center;
            font-size: 14px;
            vertical-align: middle;
        }

        .F_BOX #css_table_tablayout .line {
            background-color: rgba(255,255,255,0.8);
            color: #333;
        }

        .F_BOX #css_table_tablayout .css_tr .css_td h1 {
            font-size: 24px;
            color: #000;
            margin: 0px;
        }

        .F_BOX #css_table_tablayout .title {
            .display: block;
            color: #0277bd;
            font-size: 87.5%;
        }

        .F_BOX #css_table_tablayout .css_td b {
            color: #0277bd;
            display: none;
            .display:inline;
        }

        .F_BOX #css_table_tablayout .css_td a.link {
            color: #ff8a00;
        }

        .F_BOX #css_table_tablayout .css_td .tabbtn {
            background-color: #13a8c0;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 75%;
            padding: 5px 5px;
            border-radius: 5px;
        }

            .F_BOX #css_table_tablayout .css_td .tabbtn a {
                color: #FFFFFF;
                font-size: 14px;
            }

            .F_BOX #css_table_tablayout .css_td .tabbtn:hover {
                text-decoration: none;
            }

        .F_BOX #css_table_tablayout .css_td a img {
            vertical-align: middle;
            border: 0;
        }

        .F_BOX #css_table_tablayout .css_tr .css_td.box00 {
            width: 30px;
        }

        .F_BOX #css_table_tablayout .css_tr .css_td.box01 {
            width: 80px;
        }

        .F_BOX #css_table_tablayout .css_tr .css_td.box02 {
            width: 120px;
        }

        .F_BOX #css_table_tablayout .css_tr .css_td.immg {
            width: 110px;
        }

            .F_BOX #css_table_tablayout .css_tr .css_td.immg img {
                margin: 1px;
            }

        .F_BOX #css_table_tablayout .css_tr .css_td.none {
            display: block;
        }

    .F_BOX .impfontbox {
        padding: 10px 5%;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        border-bottom: #95afb9 1px solid;
    }

        .F_BOX .impfontbox .impfont {
            background: url(../frontimages/impicon.png) no-repeat left 5px;
            padding-left: 25px;
            line-height: 180%;
            font-size: 100%;
            color: #7399a8;
        }

        .F_BOX .impfontbox .implist {
            list-style-type: decimal;
            margin-left: 5%;
            border: 0;
            height: auto;
            color: #3c606e;
            font-size: 90%;
        }

/*mapmap*/
.mapmap_mob {
    display: none;
}

.mapmap {
    position: relative;
    width: 100%;
    height: auto;
    margin: 0px 0 20px 0;
    opacity: 1;
    background-color: #FFF;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    border: 1px solid #eee;
    padding: 0 15px 10px 15px;
}

    .mapmap .corner_css {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 0;
        border-color: #2984ad transparent transparent transparent;
        margin-left: -15px;
        position: absolute;
    }

    .mapmap .title {
        font-size: 150%;
        color: #2984ad;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        margin: 10px 0;
    }

        .mapmap .title span {
            font-size: 80%;
            color: #d8d8d8;
            font-weight: normal;
        }

    .mapmap .mapimg {
        position: relative;
    }
        /*.mapmap a{ display:block; background-color:#FC0; opacity:0.5; width:50px; height:50px; position:absolute; top:0; left:0; line-height:50px;text-align:center; border-radius:50px;}*/
        .mapmap .mapimg .point {
            width: 100%;
            height: 100%;
        }

.point ul {
    list-style: none;
}

.point li {
    position: absolute;
    border-radius: 50px;
}

    .point li a {
        text-decoration: none;
        cursor: pointer;
        z-index: 999;
        display: block;
        background-color: rgba(51,204,204,0);
        opacity: 0.8;
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
    }

    .point li span {
        display: block;
        background-color: #000;
        padding: 3px 10px;
        border-radius: 20px;
        font-size: 80%;
        color: #FFF;
        font-weight: bold;
    }

    .point li:hover {
        background-color: rgba(51,204,204,0.6);
    }

.point .point01 {
    top: 37%;
    left: 36.3%;
}
/*南竿-北竿*/
.point .point02 {
    top: 19.4%;
    left: 36.3%;
}
/*北竿-南竿*/

.point .point03 {
    top: 10.5%;
    left: 56.6%;
}
/*南竿-東引*/
.point .point04 {
    top: 26%;
    left: 44%;
}
/*東引-南竿*/

.point .point05 {
    top: 18.6%;
    left: 85.5%;
}
/*東引到基隆*/
.point .point06 {
    top: 10%;
    left: 77%;
}
/*基隆到東引*/

.point .point07 {
    top: 35.5%;
    left: 53.5%;
}
/*基隆到南竿*/
.point .point08 {
    top: 30%;
    left: 76.7%;
}
/*南竿到基隆*/

.point .point09 {
    top: 71%;
    left: 60%;
}
/*南竿到東莒*/
.point .point10 {
    top: 53%;
    left: 48.5%;
}
/*東莒到南竿*/

.point .point11 {
    top: 82%;
    left: 48%;
}
/*南竿到西莒*/
.point .point12 {
    top: 66%;
    left: 38%;
}
/*西莒到南竿*/

.point .point13 {
    top: 14%;
    left: 28.7%;
}
/*黃岐-北竿*/
.point .point14 {
    top: 22.5%;
    left: 19%;
}
/*北竿-黃岐*/

.point .point15 {
    top: 41%;
    left: 28.9%;
}
/*黃岐-南竿*/
.point .point16 {
    top: 33.5%;
    left: 19%;
}
/*南竿-黃岐*/

.point .point17 {
    top: 49%;
    left: 25%;
}
/*馬尾-南竿*/
.point .point18 {
    top: 45%;
    left: 14%;
}
/*南竿-馬尾*/



/*newsbox-index*/
.newsbox {
    width: 100%;
    height: auto;
    margin: 0 auto 10px auto;
    overflow: hidden;
    float: none;
    border: 1px solid #eee;
    padding: 0 15px 15px 15px;
}

    .newsbox .corner_css {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 0;
        border-color: #b92939 transparent transparent transparent;
        margin-left: -15px;
        position: absolute;
    }

.article .articlebox .newsbox .title {
    font-size: 170%;
    color: #fb7785;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    margin: 10px 0;
    padding-bottom: 3px;
    border-bottom: 3px solid #fb7785;
}

    .article .articlebox .newsbox .title span {
        font-size: 80%;
        color: #d8d8d8;
        font-weight: normal;
    }

.newsbox p {
    text-align: center;
    padding-top: 10px;
}

.newsbox .moreA {
    float: right;
    color: #b4b4b4;
    background: #e7e7e7;
    width: auto;
    height: auto;
    font-size: 50%;
    padding: 3px 10px;
    border-radius: 12px;
    font-style: normal;
    text-align: center;
    line-height: 180%;
}

    .newsbox .moreA:hover {
        background: #000;
    }

.newsbox .leftimg {
    width: 23%;
    height: 100%;
    float: left;
    height: auto;
    background-color: #eee;
}

    .newsbox .leftimg img {
        width: 100%;
        height: auto;
    }

.newsbox .rightfont {
    width: 76%;
    float: right;
    height: auto;
    overflow: hidden;
    margin-top: 0px;
}

    .newsbox .rightfont .newslist {
        width: 100%;
        height: auto;
        overflow: hidden;
    }

        .newsbox .rightfont .newslist ul {
            width: 100%;
            height: auto;
            list-style-type: square;
            margin: 0;
            padding: 0;
        }

            .newsbox .rightfont .newslist ul li {
                height: auto;
                color: #333;
                padding: 5px 0;
                border-bottom: 1px dashed #CCCCCC;
                line-height: 120%;
                width: 100%;
                margin: 0 auto;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }

                .newsbox .rightfont .newslist ul li a {
                    color: #333;
                    font-size: 90%;
                    line-height: 120%;
                }

                    .newsbox .rightfont .newslist ul li a span {
                        display: block;
                        width: 100%;
                        height: auto;
                        margin: 0;
                        padding: 0;
                        line-height: 120%;
                    }

                    .newsbox .rightfont .newslist ul li a .day .shopname {
                        width: auto;
                        color: #999;
                        padding-left: 20px;
                        float: right;
                    }

                    .newsbox .rightfont .newslist ul li a .day {
                        color: #b92939;
                        font-size: 90%;
                        background: url(../frontimages/icon_arrow.png) no-repeat left center;
                        padding-left: 15px;
                        margin-top: 0px;
                    }

                    .newsbox .rightfont .newslist ul li a .fistfont {
                        color: #000;
                        font-size: 110%;
                        font-weight: bold;
                        width: 100%;
                        margin: 0 auto;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }

                    .newsbox .rightfont .newslist ul li a .Sfont {
                        width: 100%;
                        margin: 0 auto;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }

        .newsbox .rightfont .newslist a.more {
            clear: both;
            color: rgba(255,255,255,0.8);
            font-size: 14px;
            background-color: rgba(115,153,168,0.8);
            padding: 5px;
            border-radius: 6px;
            font-style: normal;
        }

            .newsbox .rightfont .newslist a.more:hover {
                background-color: #369;
            }

/*news*/
.news {
    width: 100%;
    height: auto;
    margin: 0 auto 10px auto;
    overflow: hidden;
    float: left;
    border: 1px solid #eee;
    padding: 0 15px 15px 15px;
}

    .news .corner_css {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 20px 20px 0 0;
        border-color: #b92939 transparent transparent transparent;
        margin-left: -15px;
        position: absolute;
    }

    .news .title {
        font-size: 170%;
        color: #fb7785;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        margin: 10px 0;
        padding-bottom: 3px;
    }

        .news .title span {
            font-size: 80%;
            color: #d8d8d8;
            font-weight: normal;
        }

    .news p {
        text-align: center;
        padding-top: 10px;
    }

    .news .moreA {
        color: #b4b4b4;
        background: #e7e7e7;
        width: 100px;
        height: auto;
        font-size: 13px;
        padding: 5px 10px;
        border-radius: 12px;
        font-style: normal;
        text-align: center;
        line-height: 180%;
    }

        .news .moreA:hover {
            background: #000;
        }

    .news .rightfont {
        width: 100%;
        height: auto;
        overflow: hidden;
    }

        .news .rightfont .newslist {
            width: 100%;
            height: auto;
            overflow: hidden;
        }

            .news .rightfont .newslist ul {
                width: 100%;
                height: auto;
                list-style-type: square;
                margin: 0;
                padding: 0;
            }

                .news .rightfont .newslist ul li {
                    height: auto;
                    color: #333;
                    padding-bottom: 5px;
                    border-bottom: 1px dashed #CCCCCC;
                    line-height: 100%;
                    width: 100%;
                    margin: 0 auto;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                }

                    .news .rightfont .newslist ul li a {
                        color: #333;
                        font-size: 90%;
                        line-height: 100%;
                    }

                        .news .rightfont .newslist ul li a span {
                            display: block;
                            width: 100%;
                            height: auto;
                            margin: 0;
                            padding: 0;
                            line-height: 140%;
                        }

                        .news .rightfont .newslist ul li a .day {
                            width: 100%;
                            color: #b92939;
                            font-size: 90%;
                            background: url(../frontimages/icon_arrow.png) no-repeat left center;
                            padding-left: 15px;
                            line-height: 120%;
                        }

                            .news .rightfont .newslist ul li a .day .shopname {
                                width: auto;
                                color: #999;
                                padding-left: 20px;
                                float: right;
                            }

                        .news .rightfont .newslist ul li a .fistfont {
                            color: #000;
                            font-size: 110%;
                            font-weight: bold;
                            width: 100%;
                            margin: 0 auto;
                            overflow: hidden;
                            white-space: nowrap;
                            text-overflow: ellipsis;
                        }

                        .news .rightfont .newslist ul li a .Sfont {
                            width: 100%;
                            margin: 0 auto;
                            overflow: hidden;
                            white-space: nowrap;
                            text-overflow: ellipsis;
                        }

            .news .rightfont .newslist a.more {
                color: rgba(255,255,255,0.8);
                font-size: 14px;
                background-color: rgba(115,153,168,0.8);
                padding: 5px;
                border-radius: 6px;
                font-style: normal;
            }

                .news .rightfont .newslist a.more:hover {
                    background-color: #369;
                }

/*newspage*/
.newspage {
    width: 100%;
    height: auto;
    margin: 0 auto 10px auto;
    overflow: hidden;
    float: left;
    border: 1px solid #eee;
    padding: 15px 15px 15px 15px;
}

    .newspage .day {
        width: 100%;
        color: #b92939;
        font-size: 100%;
        background: url(../frontimages/icon_arrow.png) no-repeat left center;
        padding-left: 15px;
        line-height: 120%;
    }

        .newspage .day .shopname {
            width: auto;
            color: #999;
            padding-left: 20px;
            float: right;
        }

    .newspage .fistfont {
        color: #000;
        font-size: 110%;
        font-weight: bold;
        width: 100%;
        margin: 0 auto;
        border-bottom: 1px solid #eee;
        margin-bottom: 15px;
        margin-top: 10px;
        padding-bottom: 10px;
    }

    .newspage .Sfont {
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
        text-align: justify;
        text-justify: inter-ideograph;
        word-wrap: break-word;
        word-break: break-all;
    }

.pagenumber2 {
    clear: both;
    text-align: center;
    padding: 10px 0;
    font-family: Arial, Helvetica, sans-serif;
}

    .pagenumber2 a {
        padding: 10px 20px;
        margin: 2px 0;
        color: #000;
        text-decoration: none;
        font-weight: bold;
        size: 16px;
        background-color: #eeeeee;
        display: inline-block;
    }

        .pagenumber2 a:hover {
            background-color: #b7b7b7;
            color: #000;
        }

    .pagenumber2 .on, .pagenumber2 .btn {
        background-color: #4c4c4c;
        color: #FFF;
        background: #323232;
        .background:#323232;
        background: linear-gradient(#323232 50%, #1e1e1e 50%);
        background: -webkit-linear-gradient(#323232 50%, #1e1e1e 50%);
        background: -ms-linear-gradient(#323232 50%, #1e1e1e 50%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#323232', endColorstr='#1e1e1e',GradientType=0);
    }

    .pagenumber2 a.aw {
        color: #000;
        font-weight: bold;
        font-family: Arial, Helvetica, sans-serif;
    }

        .pagenumber2 a.aw:hover {
            background-color: #ccc;
            color: #FFF;
        }

    .pagenumber2 .on, .pagenumber2 .on:hover {
        background-color: #000;
        color: #FFF;
    }

    .pagenumber2 a.btn {
        padding: 10px 20px;
        margin: 0 0px 0 5px;
        color: #FFF;
        text-decoration: none;
        font-weight: bold;
        size: 16px;
        display: inline-block;
        background: #323232;
        .background:#323232;
        background: linear-gradient(#323232 50%, #1e1e1e 50%);
        background: -webkit-linear-gradient(#323232 50%, #1e1e1e 50%);
        background: -ms-linear-gradient(#323232 50%, #1e1e1e 50%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#323232', endColorstr='#1e1e1e',GradientType=0);
    }

        .pagenumber2 a.btn:hover {
            background-color: #333;
            color: #FFF;
        }


.articlebox .container .member {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
}

    .articlebox .container .member .mainbox {
        width: 100%;
        margin: 0 auto;
        padding: 5% 20%;
    }

.indexsitemap {
    width: 100%;
    height: auto;
    min-height: 180px;
    margin: 0 auto;
    background: #f2f2f2;
    overflow: hidden;
}

    .indexsitemap .centerbox {
        width: 1000px;
        height: auto;
        margin: 0 auto;
        padding: 20px 0 10px 220px;
        position: relative;
    }

        .indexsitemap .centerbox .sitemapimg {
            position: absolute;
            left: 0px;
            top: 0px;
        }

#sitemap {
    width: 100%;
    list-style: none;
}

    #sitemap li {
        float: left;
    }

    #sitemap .title {
        color: #00a2b5;
        font-size: 100%;
        font-weight: bold;
        padding-bottom: 8px;
        width: 15.66%;
        margin-right: 1%;
        float: left;
    }

    #sitemap .title2 {
        color: #00a2b5;
        font-size: 100%;
        font-weight: bold;
        padding-bottom: 8px;
        margin-right: 0px;
        width: 90px;
    }

        #sitemap .title a, #sitemap .title2 a {
            color: #000;
            text-decoration: none;
        }

    #sitemap .title ul {
        margin-top: 5px;
    }

        #sitemap .title ul li {
            color: #0b0b0b;
            font-size: 95%;
            list-style-type: none;
            font-weight: normal;
            margin-bottom: 6px;
            width: 90%;
        }

            #sitemap .title ul li a {
                color: #0b0b0b;
                font-size: 80%;
                list-style-type: none;
                text-decoration: none;
                line-height: 110%;
            }

                #sitemap .title ul li a:hover {
                    color: #0b0b0b;
                    text-decoration: underline;
                }

            #sitemap .title ul li ul li {
                color: #a6a6a6;
                font-size: 80%;
                margin-left: 6px;
                list-style-type: none;
            }

                #sitemap .title ul li ul li a {
                    color: #a6a6a6;
                    font-size: 80%;
                    list-style-type: none;
                }

                    #sitemap .title ul li ul li a:hover {
                        text-decoration: underline;
                    }

.button, a .button {
    font-size: 22px;
    border-radius: 6px; /*圓角左上 右上 右下 左下 順時針*/
    color: #fff;
    background: #25b5cd;
    .background:#25b5cd; /*IE6/.IE7*/
    background: linear-gradient(#25b5cd 50%, #13a8c0 50%);
    background: -webkit-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*Chrome10+,Safari5.1+*/
    background: -ms-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*IE10+*/
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25b5cd', endColorstr='#13a8c0',GradientType=0); /*IE6-9*/
    padding: 8px 15px;
    width: auto;
    min-width: 120px;
    display: block;
    margin: 5px auto;
    text-decoration: none;
    border: 1px;
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    cursor: pointer;
    text-align: center;
}

    .button:hover {
        color: #fff;
        text-decoration: none;
        background: #0293ac;
    }

.button01, a .button01 {
    font-size: 14px;
    border-radius: 6px; /*圓角左上 右上 右下 左下 順時針*/
    color: #fff;
    font-weight: bold;
    background: #25b5cd;
    .background:#25b5cd; /*IE6/.IE7*/
    background: linear-gradient(#25b5cd 50%, #13a8c0 50%);
    background: -webkit-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*Chrome10+,Safari5.1+*/
    background: -ms-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*IE10+*/
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25b5cd', endColorstr='#13a8c0',GradientType=0); /*IE6-9*/
    font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    cursor: pointer;
    text-align: center;
    padding: 4px 15px;
}

    .button:hover, .button01:hover {
        color: #fff;
        text-decoration: none;
        background: #0293ac;
    }

.btnbox {
    clear: both;
    margin: 10px auto;
    text-align: right;
}

    .btnbox .more {
        background-color: #c1c1c1;
        color: #FFF;
        padding: 2px 10px;
        text-decoration: none;
    }

        .btnbox .more:hover {
            background-color: #10a6be;
        }

.footerbox .footerinfo {
    width: 1000px;
    height: auto;
    text-align: left;
    padding: 15px;
}

    .footerbox .footerinfo h1, .footerbox .footerinfo h1 a {
        font-size: 18px;
        color: #fff;
        text-decoration: none;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    }

    .footerbox .footerinfo h1 {
        background: url(../frontimages/footer_tel.png) no-repeat left center;
        padding-left: 40px;
        line-height: 180%;
    }

    .footerbox .footerinfo p {
        font-size: 14px;
        color: rgba(255,255,255,0.8);
    }

.article .articlebox .content {
    width: 100%;
    height: auto;
    margin: 10px auto;
    padding: 20px 0;
    line-height: 180%;
    border-top: 1px dashed #CCCCCC;
}

    .article .articlebox .content h1 {
        font-size: 130%;
        line-height: 130%;
    }

    .article .articlebox .content h2 {
        font-size: 120%;
        line-height: 130%;
    }

    .article .articlebox .content h3 {
        font-size: 110%;
        line-height: 130%;
    }

    .article .articlebox .content h4 {
        font-size: 105%;
        line-height: 130%;
    }

    .article .articlebox .content h5 {
        font-size: 100%;
        line-height: 130%;
    }
    /*多圖*/
    .article .articlebox .content .imglist {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 10px 0;
        background-color: #f4f4f4;
    }

        .article .articlebox .content .imglist h1 {
            font-size: 100%;
            color: #999;
            padding: 2%;
            padding-bottom: 0;
        }

        .article .articlebox .content .imglist .imgbox {
            width: 25%;
            height: 170px;
            padding: 2%;
            background-color: #f4f4f4;
            float: left;
        }

            .article .articlebox .content .imglist .imgbox .img {
                width: 100%;
                height: 140px;
                overflow: hidden;
            }

            .article .articlebox .content .imglist .imgbox img {
                width: 100%;
                height: auto;
            }

    /*多檔案下載*/
    .article .articlebox .content .downloadlist {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 10px 0;
    }

        .article .articlebox .content .downloadlist h1 {
            font-size: 100%;
            color: #999;
        }

        .article .articlebox .content .downloadlist a {
            display: inline-block;
            width: 47.5%;
            margin: 1%;
            border-bottom: 1px dotted #CCCCCC;
            color: #000;
            background: url(../frontimages/Inbox.png) no-repeat left center;
            background-size: 30px auto;
            padding-left: 30px;
        }

            .article .articlebox .content .downloadlist a:hover {
                color: #333;
            }

.buttonbox {
    text-align: center;
    margin: 10px 0;
}

    .buttonbox .btn {
        color: #FFF;
        border-style: none;
        min-width: 100px;
        height: 36px;
        text-align: center;
        cursor: pointer;
        margin: 2px;
        font-size: 100%;
        border-radius: 5px;
        background-color: #333;
        border: 1px solid #999;
        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    }

        .buttonbox .btn:hover {
            background: #00b5ca;
        }

/*======radio==============*/
/*.checkbox_radio{width:15px; height:15px; margin-right:3px;vertical-align:middle; margin:1px;}
.checkbox_css{ width:15px; height:15px;margin-right:3px;vertical-align:middle; margin:1px}*/

/*預約訂票*/
.inputbox {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
}

.orderbg01 {
    background-color: #eee;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 30px;
    box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
}

.inputbox .boxlist .queryicon1, .inputbox .boxlist .queryicon2 {
    display: inline-block;
    width: 60px;
    height: auto;
    border-radius: 10px;
    line-height: 150%;
    background-color: #F09;
    text-align: center;
    font-weight: bold;
    color: #fff;
    margin-right: 10px;
    padding: 2px 5px;
}

.inputbox .boxlist .queryicon2 {
    background-color: #F60;
}

.inputbox .boxlist {
    width: auto;
    height: auto;
    margin: 10px 10px;
    display: inline-block;
}

    .inputbox .boxlist p {
        display: inline-block;
        min-width: 10%;
        padding-right: 10px;
    }

        .inputbox .boxlist p i {
            font-style: normal;
            color: #F00;
            font-weight: bold;
            padding-right: 10px;
        }

    .inputbox .boxlist input {
        padding: 5px;
    }

    .inputbox .boxlist select {
        padding: 5px 5px;
        margin: 0;
    }

    .inputbox .boxlist > .btn {
        background-color: #333;
        border-style: none;
        border: 1px solid #999;
        color: #FFF;
        cursor: pointer;
        width: auto;
        padding: 7px 20px;
        border-radius: 5px;
        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        margin: 3px;
    }

        .inputbox .boxlist > .btn:hover {
            background: #00b5ca;
        }

.tabletitle {
    color: #666;
    padding: 10px 0;
    clear: both;
    font-weight: normal;
    font-size: 90%;
}

    .tabletitle strong {
        color: #ff9600;
        font-size: 120%;
    }

.inputbox #css_table_tablayout {
    display: table;
    width: 100%;
    letter-spacing: normal;
}

    .inputbox #css_table_tablayout .css_tr {
        display: table-row;
        width: 100%;
        .border-bottom:#188fa7 2px solid;
        .display: inline-block;
    }

        .inputbox #css_table_tablayout .css_tr:nth-child(odd) {
            background-color: #eee;
            .display: inline-block;
        }

        .inputbox #css_table_tablayout .css_tr:first-child {
            font-weight: bold;
            background-color: #a7e2e9;
            color: #333;
            _display: none;
            .display: none;
        }

            .inputbox #css_table_tablayout .css_tr:first-child a {
                text-decoration: none;
                color: #333;
            }

                .inputbox #css_table_tablayout .css_tr:first-child a:hover {
                    text-decoration: none;
                    color: #188fa7;
                }

    .inputbox #css_table_tablayout .css_td {
        display: table-cell;
        padding: 10px 0px;
        min-width: 50px;
        .display: block;
        border-bottom: #95afb9 1px solid;
        text-align: center;
        line-height: 130%;
        font-size: 14px;
        vertical-align: middle;
    }

    .inputbox #css_table_tablayout .line {
        color: #333;
        padding: 3px 0px;
    }

    .inputbox #css_table_tablayout .css_tr .css_td h1 {
        font-size: 24px;
        color: #000;
        margin: 0px;
    }

    .inputbox #css_table_tablayout .title {
        .display: block;
        color: #FFF;
        font-size: 87.5%;
    }

    .inputbox #css_table_tablayout .css_td b {
        color: #FF3300;
        display: none;
        .display:inline;
    }

    .inputbox #css_table_tablayout .css_td a.link {
        color: #ff8a00;
    }

    .inputbox #css_table_tablayout .css_td .tabbtn a {
        background-color: #333;
        border-style: none;
        border: 1px solid #999;
        text-decoration: none;
        font-weight: bold;
        color: #FFF;
        font-size: 100%;
        padding: 5px 15px;
        border-radius: 5px;
    }

        .inputbox #css_table_tablayout .css_td .tabbtn a:hover {
            background: #00b5ca;
            text-decoration: none;
        }

    .inputbox #css_table_tablayout .css_td a img {
        vertical-align: middle;
        border: 0;
    }

    .inputbox #css_table_tablayout .css_tr .css_td.none {
        display: none;
    }

    .inputbox #css_table_tablayout .css_tr .css_td .gotime {
        font-weight: bold;
        font-size: 110%;
    }

    .inputbox #css_table_tablayout .css_td:first-child {
        font-weight: normal;
    }

    .inputbox #css_table_tablayout .css_td .tabbtn_on a {
        background-color: #F60;
        border-style: none;
        border: 1px solid #F30;
        text-decoration: none;
        font-weight: bold;
        color: #FFF;
        font-size: 100%;
        padding: 5px 15px;
        border-radius: 5px;
    }


/*船艙*/
.inputbox3 {
    margin-top: 30px;
}

    .inputbox3 #css_table_tablayout {
        display: table;
        width: 100%;
        letter-spacing: normal;
    }

        .inputbox3 #css_table_tablayout .css_tr {
            display: table-row;
            width: 100%;
            .border-bottom:#188fa7 2px solid;
            .display: inline-block;
        }

            .inputbox3 #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: transparent;
                .display: inline-block;
            }

            .inputbox3 #css_table_tablayout .css_tr:first-child {
                font-weight: bold;
                background-color: #a7e2e9;
                color: #333;
                _display: none;
                .display: none;
            }

                .inputbox3 #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #333;
                }

                    .inputbox3 #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

        .inputbox3 #css_table_tablayout .css_td {
            display: table-cell;
            padding: 10px 0px;
            min-width: 50px;
            .display: block;
            border-bottom: #95afb9 1px solid;
            text-align: center;
            line-height: 130%;
            font-size: 14px;
            vertical-align: middle;
        }

        .inputbox3 #css_table_tablayout .line {
            color: #333;
            padding: 3px 0px;
        }

        .inputbox3 #css_table_tablayout .css_tr .css_td h1 {
            font-size: 24px;
            color: #000;
            margin: 0px;
        }

        .inputbox3 #css_table_tablayout .title {
            .display: block;
            color: #FFF;
            font-size: 87.5%;
        }

        .inputbox3 #css_table_tablayout .css_td b {
            color: #FF3300;
            display: none;
            .display:inline;
        }

        .inputbox3 #css_table_tablayout .css_td a.link {
            color: #ff8a00;
        }

        .inputbox3 #css_table_tablayout .css_td .tabbtn {
            background-color: #333;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 70%;
            padding: 5px 15px;
            border-radius: 5px;
        }

            .inputbox3 #css_table_tablayout .css_td .tabbtn:hover {
                background: #00b5ca;
            }

        .inputbox3 #css_table_tablayout .css_td .peoplenumber select {
            padding: 2px;
            min-width: 100px;
        }

        .inputbox3 #css_table_tablayout .css_td span {
            font-size: 90%;
            color: #333;
            font-weight: normal;
        }

        .inputbox3 #css_table_tablayout .css_td .tabbtn_on a {
            background-color: #F60;
            border-style: none;
            border: 1px solid #F30;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 100%;
            padding: 5px 15px;
            border-radius: 5px;
        }
/*船次資訊*/
.orderinputlist .tabletitle {
    color: #000;
    padding: 10px 0;
    clear: both;
    font-weight: bold;
    font-size: 100%;
}

    .orderinputlist .tabletitle strong {
        color: #ff9600;
        font-size: 120%;
    }

.orderinputlist {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
}

    .orderinputlist #css_table_tablayout {
        display: table;
        width: 100%;
        letter-spacing: normal;
    }

        .orderinputlist #css_table_tablayout .css_tr {
            display: table-row;
            width: 100%;
            .border-bottom:#188fa7 2px solid;
            .display: inline-block;
        }

            .orderinputlist #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
            }

            .orderinputlist #css_table_tablayout .css_tr:first-child {
                font-weight: bold;
                background-color: #00b5ca;
                color: #FFFFFF;
                _display: none;
                .display: none;
            }

                .orderinputlist #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .orderinputlist #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

        .orderinputlist #css_table_tablayout .css_td {
            display: table-cell;
            padding: 10px 0px;
            min-width: 50px;
            .display: block;
            border-bottom: #95afb9 1px solid;
            text-align: center;
            line-height: 130%;
            font-size: 14px;
            vertical-align: middle;
        }

        .orderinputlist #css_table_tablayout .line {
            color: #FFF;
            padding: 3px 0px;
        }

        .orderinputlist #css_table_tablayout .css_tr .css_td h1 {
            font-size: 24px;
            color: #000;
            margin: 0px;
        }

        .orderinputlist #css_table_tablayout .title {
            .display: block;
            color: #FFF;
            font-size: 87.5%;
        }

        .orderinputlist #css_table_tablayout .css_td b {
            color: #FF3300;
            display: none;
            .display:inline;
        }

        .orderinputlist #css_table_tablayout .css_td a.link {
            color: #ff8a00;
        }

        .orderinputlist #css_table_tablayout .css_td .tabbtn {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 70%;
            padding: 5px 15px;
            border-radius: 5px;
            box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
            -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        }

            .orderinputlist #css_table_tablayout .css_td .tabbtn a {
                color: #FFFFFF;
                font-size: 14px;
            }

            .orderinputlist #css_table_tablayout .css_td .tabbtn:hover {
                background: #00b5ca;
            }

        .orderinputlist #css_table_tablayout .css_td a img {
            vertical-align: middle;
            border: 0;
        }

        .orderinputlist #css_table_tablayout .css_tr .css_td.none {
            display: block;
        }

        .orderinputlist #css_table_tablayout .css_td .tabbtn_on a {
            background-color: #F60;
            border-style: none;
            border: 1px solid #F30;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 100%;
            padding: 5px 15px;
            border-radius: 5px;
        }
/*填寫乘客資料*/
.orderinput .tabletitle {
    color: #000;
    padding: 10px 0;
    clear: both;
    font-weight: bold;
    font-size: 100%;
}

    .orderinput .tabletitle strong {
        color: #ff9600;
        font-size: 120%;
    }

    .orderinput .tabletitle span i {
        font-style: normal;
        color: #F00;
        font-weight: normal;
        padding-right: 2px;
        font-size: 90%;
        padding-left: 10px;
    }

.orderinput {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    margin-top: 20px;
}

    .orderinput #css_table_tablayout {
        display: table;
        width: 100%;
        letter-spacing: normal;
    }

        .orderinput #css_table_tablayout .css_tr {
            display: table-row;
            width: 100%;
            .border-bottom:#188fa7 2px solid;
            .display: inline-block;
        }

            .orderinput #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
            }

            .orderinput #css_table_tablayout .css_tr:first-child {
                font-weight: bold;
                background-color: #a7e2e9;
                color: #FFFFFF;
                _display: none;
                .display: none;
            }

                .orderinput #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .orderinput #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

        .orderinput #css_table_tablayout .css_td {
            display: table-cell;
            padding: 10px 2px;
            min-width: 50px;
            .display: block;
            border-bottom: #95afb9 1px solid;
            text-align: left;
            line-height: 130%;
            font-size: 14px;
            vertical-align: middle;
        }

        .orderinput #css_table_tablayout .line {
            color: #333;
            padding: 3px 0px;
        }

            .orderinput #css_table_tablayout .line i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 2px;
            }

            .orderinput #css_table_tablayout .line span {
                color: #333;
                display: block;
            }

        .orderinput #css_table_tablayout .css_tr .css_td h1 {
            font-size: 24px;
            color: #000;
            margin: 0px;
        }

        .orderinput #css_table_tablayout .title {
            .display: block;
            color: #FFF;
            font-size: 87.5%;
        }

        .orderinput #css_table_tablayout .css_td b {
            color: #FF3300;
            display: none;
            .display:inline;
        }

        .orderinput #css_table_tablayout .css_td a.link {
            color: #ff8a00;
        }

        .orderinput #css_table_tablayout .css_td .tabbtn {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 70%;
            padding: 5px 15px;
            border-radius: 5px;
            box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
            -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        }

            .orderinput #css_table_tablayout .css_td .tabbtn a {
                color: #FFFFFF;
                font-size: 14px;
            }

            .orderinput #css_table_tablayout .css_td .tabbtn:hover {
                background: #00b5ca;
            }

        .orderinput #css_table_tablayout .css_td a img {
            vertical-align: middle;
            border: 0;
        }

        .orderinput #css_table_tablayout .css_tr .css_td.none {
            display: block;
        }

        .orderinput #css_table_tablayout .css_td .tabbtn_on a {
            background-color: #F60;
            border-style: none;
            border: 1px solid #F30;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 100%;
            padding: 5px 15px;
            border-radius: 5px;
        }

        .orderinput #css_table_tablayout .Bbox01 {
            text-align: center;
        }

        .orderinput #css_table_tablayout .Bbox05 span {
            display: block;
            text-align: center;
        }

        .orderinput #css_table_tablayout .Bbox08 .masu input {
            width: 80px;
        }
/*訂購人*/
.ordermainer .tabletitle {
    color: #000;
    padding: 10px 0;
    clear: both;
    font-weight: bold;
    font-size: 100%;
}

    .ordermainer .tabletitle strong {
        color: #ff9600;
        font-size: 120%;
    }

    .ordermainer .tabletitle span i {
        font-style: normal;
        color: #F00;
        font-weight: normal;
        padding-right: 2px;
        font-size: 90%;
        padding-left: 10px;
    }

.ordermainer {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    margin-top: 20px;
}

    .ordermainer #css_table_tablayout {
        display: table;
        width: 100%;
        letter-spacing: normal;
    }

        .ordermainer #css_table_tablayout .css_tr {
            display: table-row;
            width: 100%;
            .border-bottom:#188fa7 2px solid;
            .display: inline-block;
        }

            .ordermainer #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
            }

            .ordermainer #css_table_tablayout .css_tr:first-child {
                font-weight: bold;
                background-color: #a7e2e9;
                color: #FFFFFF;
                _display: none;
                .display: none;
            }

                .ordermainer #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .ordermainer #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

        .ordermainer #css_table_tablayout .css_td {
            display: table-cell;
            padding: 10px 2px;
            min-width: 50px;
            .display: block;
            border-bottom: #95afb9 1px solid;
            text-align: left;
            line-height: 130%;
            font-size: 14px;
            vertical-align: middle;
        }

        .ordermainer #css_table_tablayout .line {
            color: #333;
            padding: 3px 0px;
        }

            .ordermainer #css_table_tablayout .line i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 2px;
            }

            .ordermainer #css_table_tablayout .line span {
                color: #333;
                display: block;
            }

        .ordermainer #css_table_tablayout .css_tr .css_td h1 {
            font-size: 24px;
            color: #000;
            margin: 0px;
        }

        .ordermainer #css_table_tablayout .title {
            .display: block;
            color: #FFF;
            font-size: 87.5%;
        }

        .ordermainer #css_table_tablayout .css_td b {
            color: #FF3300;
            display: none;
            .display:inline;
        }

        .ordermainer #css_table_tablayout .css_td a.link {
            color: #ff8a00;
        }

        .ordermainer #css_table_tablayout .css_td .tabbtn {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 70%;
            padding: 5px 15px;
            border-radius: 5px;
            box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
            -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        }

            .ordermainer #css_table_tablayout .css_td .tabbtn a {
                color: #FFFFFF;
                font-size: 14px;
            }

            .ordermainer #css_table_tablayout .css_td .tabbtn:hover {
                background: #00b5ca;
            }

        .ordermainer #css_table_tablayout .css_td a img {
            vertical-align: middle;
            border: 0;
        }

        .ordermainer #css_table_tablayout .css_tr .css_td.none {
            display: block;
        }

        .ordermainer #css_table_tablayout .Bbox01 {
            padding-left: 10px;
        }

        .ordermainer #css_table_tablayout .css_td .tabbtn_on a {
            background-color: #F60;
            border-style: none;
            border: 1px solid #F30;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 100%;
            padding: 5px 15px;
            border-radius: 5px;
        }

/*結帳刷卡*/
.paycard {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
}

.paycardbg01 {
    background-color: #eee;
    border-radius: 10px;
    padding: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
}

.paycard .boxlist {
    width: auto;
    height: auto;
    margin: 10px 10px;
    display: inline-block;
    font-size: 110%;
    font-weight: bold;
}

    .paycard .boxlist p {
        display: inline-block;
        min-width: 10%;
        padding-right: 10px;
        font-weight: normal;
    }

        .paycard .boxlist p i {
            font-style: normal;
            color: #F00;
            font-weight: bold;
            padding-right: 10px;
        }

    .paycard .boxlist span {
        margin-left: 5px;
    }

/*結帳畫面.ordershow*/
.ordershow .cardbill {
    text-align: center;
    padding: 20px;
}

    .ordershow .cardbill .card_font {
        font-size: 180%;
        color: #F00;
        text-align: center;
        margin-top: 30px;
    }

.ordershow .tabletitle {
    color: #000;
    padding: 10px 0;
    clear: both;
    font-weight: bold;
    font-size: 100%;
}

    .ordershow .tabletitle strong {
        color: #ff9600;
        font-size: 120%;
    }

    .ordershow .tabletitle span i {
        font-style: normal;
        color: #F00;
        font-weight: normal;
        padding-right: 2px;
        font-size: 90%;
        padding-left: 10px;
    }

.ordershow {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    margin-top: 20px;
}

    .ordershow #css_table_tablayout {
        display: table;
        width: 100%;
        letter-spacing: normal;
    }

        .ordershow #css_table_tablayout .css_tr {
            display: table-row;
            width: 100%;
            .border-bottom:#188fa7 2px solid;
            .display: inline-block;
        }

            .ordershow #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
            }

            .ordershow #css_table_tablayout .css_tr:first-child {
                font-weight: bold;
                background-color: #a7e2e9;
                color: #FFFFFF;
                _display: none;
                .display: none;
            }

                .ordershow #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .ordershow #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

        .ordershow #css_table_tablayout .css_td {
            display: table-cell;
            padding: 10px 2px;
            min-width: 50px;
            .display: block;
            border-bottom: #95afb9 1px solid;
            text-align: left;
            line-height: 130%;
            font-size: 14px;
            vertical-align: middle;
        }

        .ordershow #css_table_tablayout .line {
            color: #333;
            padding: 3px 0px;
        }

            .ordershow #css_table_tablayout .line i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 2px;
            }

            .ordershow #css_table_tablayout .line span {
                color: #333;
                display: block;
            }

        .ordershow #css_table_tablayout .css_tr .css_td h1 {
            font-size: 24px;
            color: #000;
            margin: 0px;
        }

        .ordershow #css_table_tablayout .title {
            .display: block;
            color: #FFF;
            font-size: 87.5%;
        }

        .ordershow #css_table_tablayout .css_td b {
            color: #FF3300;
            display: none;
            .display:inline;
        }

        .ordershow #css_table_tablayout .css_td a.link {
            color: #ff8a00;
        }

        .ordershow #css_table_tablayout .css_td .tabbtn {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 70%;
            padding: 5px 15px;
            border-radius: 5px;
            box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
            -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        }

            .ordershow #css_table_tablayout .css_td .tabbtn a {
                color: #FFFFFF;
                font-size: 14px;
            }

            .ordershow #css_table_tablayout .css_td .tabbtn:hover {
                background: #00b5ca;
            }

        .ordershow #css_table_tablayout .css_td a img {
            vertical-align: middle;
            border: 0;
        }

        .ordershow #css_table_tablayout .css_tr .css_td.none {
            display: block;
        }

        .ordershow #css_table_tablayout .css_td .tabbtn_on a {
            background-color: #F60;
            border-style: none;
            border: 1px solid #F30;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 100%;
            padding: 5px 15px;
            border-radius: 5px;
        }

        .ordershow #css_table_tablayout .Bbox01 {
            text-align: center;
        }

        .ordershow #css_table_tablayout .Bbox08 .masu input {
            width: 80px;
        }


/*查詢.querybox*/
.querybox {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
}

.orderbg01 {
    background-color: #eee;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 30px;
    box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
}

.querybox .boxlist .queryicon1, .querybox .boxlist .queryicon2 {
    display: inline-block;
    width: 60px;
    height: auto;
    border-radius: 10px;
    line-height: 150%;
    background-color: #F09;
    text-align: center;
    font-weight: bold;
    color: #fff;
    margin-right: 10px;
    padding: 2px 5px;
}

.querybox .boxlist .queryicon2 {
    background-color: #F60;
}

.querybox .boxlist {
    width: auto;
    height: auto;
    margin: 10px 10px;
    display: inline-block;
}

    .querybox .boxlist p {
        display: inline-block;
        min-width: 10%;
        padding-right: 10px;
    }

        .querybox .boxlist p i {
            font-style: normal;
            color: #F00;
            font-weight: bold;
            padding-right: 10px;
        }

    .querybox .boxlist input {
        padding: 5px;
    }

    .querybox .boxlist select {
        padding: 5px 5px;
        margin: 0;
    }

    .querybox .boxlist > .btn {
        background-color: #333;
        border-style: none;
        border: 1px solid #999;
        color: #FFF;
        cursor: pointer;
        width: auto;
        padding: 7px 20px;
        border-radius: 5px;
        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    }

        .querybox .boxlist > .btn:hover {
            background: #00b5ca;
        }

.querybox #css_table_tablayout {
    display: table;
    width: 100%;
    letter-spacing: normal;
}

    .querybox #css_table_tablayout .css_tr {
        display: table-row;
        width: 100%;
        .border-bottom:#188fa7 2px solid;
        .display: inline-block;
    }

        .querybox #css_table_tablayout .css_tr:nth-child(odd) {
            background-color: #eee;
            .display: inline-block;
        }

        .querybox #css_table_tablayout .css_tr:first-child {
            font-weight: bold;
            background-color: #a7e2e9;
            color: #333;
            _display: none;
            .display: none;
        }

            .querybox #css_table_tablayout .css_tr:first-child a {
                text-decoration: none;
                color: #333;
            }

                .querybox #css_table_tablayout .css_tr:first-child a:hover {
                    text-decoration: none;
                    color: #188fa7;
                }

    .querybox #css_table_tablayout .css_td {
        display: table-cell;
        padding: 10px 0px;
        min-width: 50px;
        .display: block;
        border-bottom: #95afb9 1px solid;
        text-align: center;
        line-height: 130%;
        font-size: 14px;
        vertical-align: middle;
    }

    .querybox #css_table_tablayout .line {
        color: #333;
        padding: 3px 0px;
    }

    .querybox #css_table_tablayout .css_tr .css_td h1 {
        font-size: 24px;
        color: #000;
        margin: 0px;
    }

    .querybox #css_table_tablayout .title {
        .display: block;
        color: #FFF;
        font-size: 87.5%;
    }

    .querybox #css_table_tablayout .css_td b {
        color: #FF3300;
        display: none;
        .display:inline;
    }

    .querybox #css_table_tablayout .css_td a.link {
        color: #ff8a00;
    }

    .querybox #css_table_tablayout .css_td .tabbtn {
        background-color: #333;
        border-style: none;
        border: 1px solid #999;
        text-decoration: none;
        font-weight: bold;
        color: #FFF;
        font-size: 70%;
        padding: 5px 15px;
        border-radius: 5px;
        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    }

        .querybox #css_table_tablayout .css_td .tabbtn a {
            color: #FFFFFF;
            font-size: 14px;
        }

        .querybox #css_table_tablayout .css_td .tabbtn:hover {
            background: #00b5ca;
        }

    .querybox #css_table_tablayout .css_td a img {
        vertical-align: middle;
        border: 0;
    }

    .querybox #css_table_tablayout .css_tr .css_td.none {
        display: none;
    }

    .querybox #css_table_tablayout .css_td .tabbtn_on a {
        background-color: #F60;
        border-style: none;
        border: 1px solid #F30;
        text-decoration: none;
        font-weight: bold;
        color: #FFF;
        font-size: 100%;
        padding: 5px 15px;
        border-radius: 5px;
    }

.infolist ul li {
    list-style: none;
    background: #ebebeb;
    border-radius: 10px;
    ;
    padding: 1% 3%;
    margin-bottom: 3%;
}

    .infolist ul li:nth-child(odd) {
        background: #ffffd6;
    }

/*indexitem*/
.indexactivity {
    position: relative;
    width: 100%;
    height: auto;
    margin: 0px 0 20px 0;
    background-color: #FFF;
    border: 1px solid #eee;
    padding: 10px;
}

.indexbox {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0.5%;
}

.indexitem {
    overflow: hidden;
    float: left;
    margin: 1%;
    background-color: #eee;
}



/* == 手機版型區 =============================== */

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

    .headerbox {
        height: auto;
        width: 100%;
        margin: 0 auto;
        position: relative;
    }

    .ADVbox {
        height: auto;
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
        background-color: #6CF;
        margin-top: 60px;
        margin-bottom: 10px;
    }

    .articlebox {
        height: auto;
        width: 92%;
        margin: 0 4%;
        overflow: hidden;
        background-color: #FFF;
        margin-top: 0px;
    }

    .footerbox {
        height: auto;
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
        background: none;
    }

    .headerbox #TOP {
        position: absolute;
        top: -100px;
        right: 0px;
        width: 50px;
        height: 50px;
        cursor: pointer;
        z-index: 999;
    }

        .headerbox #TOP img {
            width: 100%;
            height: auto;
        }

    .topbgsky {
        position: absolute;
        width: 100%;
        height: 60px;
        background: none;
        background-color: #00b5ca;
        z-index: 99;
    }

        .topbgsky .topbgskybox {
            height: auto;
            width: 100%;
            margin: 0 auto;
            position: relative;
        }

            .topbgsky .topbgskybox h1 {
                text-indent: -9999px;
                display: block;
                padding-top: 5px;
                padding-left: 5px;
            }

            .topbgsky .topbgskybox .logo {
                width: 80%;
                height: 60px;
                float: left;
                background: url(../frontimages/logo.png) center left no-repeat;
                background-size: auto 50px;
            }

            .topbgsky .topbgskybox .topnav {
                display: none;
            }

    .topmenu {
        display: none;
    }

    .article .articlebox .pagebanner {
        position: relative;
        width: 100%;
        height: auto;
        margin: 10px auto;
        clear: both;
        overflow: hidden;
        margin-top: 10px;
    }

        .article .articlebox .pagebanner img {
            width: 100%;
            height: auto;
        }

    .article .articlebox .pagetitle {
        position: absolute;
        top: 35%;
        left: 5%;
        font-size: 150%;
        color: #FFF;
        text-shadow: 0 1px 1px rgba(0,0, 0, 0.4);
    }

        .article .articlebox .pagetitle span {
            font-size: 90%;
            color: rgba(255,255,255,0.7);
            font-weight: normal;
        }

    /*--topfrom麵包屑--*/
    #topfrom {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 0px auto;
        padding: 5px 0px;
        font-size: 90%;
    }

        #topfrom a {
            color: #666;
            text-decoration: none;
            padding: 0px 3px;
        }

            #topfrom a:hover {
                color: #333;
                text-decoration: underline;
            }

    /*航班區塊*/

    .FLIGHT {
        float: right;
        position: relative;
        width: 100%;
        height: auto;
        margin: 0px 0 20px 0;
        opacity: 1;
        background-color: #FFF;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        border: 1px solid #eee;
        padding: 0 15px 10px 15px;
    }

        .FLIGHT .corner_css {
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 20px 20px 0 0;
            border-color: #2984ad transparent transparent transparent;
            margin-left: -15px;
            position: absolute;
        }

        .FLIGHT h1.title {
            font-size: 150%;
            color: #2984ad;
            font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
            margin: 10px 0;
        }

            .FLIGHT h1.title span {
                font-size: 80%;
                color: #d8d8d8;
                font-weight: normal;
            }

    .F_MENU {
        width: 100%;
        height: 45px;
        position: absolute;
        margin-left: -15px;
    }

        .F_MENU ul {
            width: 100%;
            height: 45px;
            list-style: none;
            background: #51a9cb;
            .background:#51a9cb;
            background: linear-gradient(#69bada 50%, #51a9cb 50%);
            background: -webkit-linear-gradient(#69bada 50%, #51a9cb 50%);
            background: -ms-linear-gradient(#69bada 50%, #51a9cb 50%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69bada', endColorstr='#51a9cb',GradientType=0);
        }

            .F_MENU ul li {
                float: left;
                width: 25%;
                height: 45px;
            }

                .F_MENU ul li.L {
                    font-size: 100%;
                    font-weight: bold;
                    line-height: 50px;
                    text-align: center;
                }

                    .F_MENU ul li.L span {
                        background-color: #FFF;
                        padding: 10px 10px;
                        border-radius: 8px 8px 0 0;
                    }

    .FLIGHT .F_BOX .LOW li h1 {
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        font-size: 24px;
    }

    .F_MENU ul li a {
        display: block;
        width: 100%;
        height: 45px;
        color: #FFF;
        font-size: 100%;
        font-weight: bold;
        line-height: 45px;
        text-align: center;
        text-decoration: none;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
    }

        .F_MENU ul li a:hover {
            background-color: #2984ad;
            color: #FFF;
        }

    .F_BOX {
        width: 100%;
        height: auto;
        background-color: #FFF;
        padding: 0px 10px;
        padding-top: 45px;
    }

        .F_BOX ul {
            width: 100%;
            height: 40px;
            border-bottom: 1px solid #fff;
            list-style: none;
        }

        .F_BOX h1 {
            text-align: center;
            font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
            color: #175271;
            font-size: 24px;
            margin: 10px 0;
        }

        .F_BOX p.T01_SS {
            float: left;
            height: 40px;
            line-height: 40px;
            font-size: 90%;
        }

        .F_BOX .BT {
            float: right;
            margin-top: 10px;
        }

            .F_BOX .BT a {
                color: rgba(255,255,255,0.8);
                font-size: 80%;
                background-color: rgba(115,153,168,0.8);
                padding: 5px;
                border-radius: 6px;
            }

                .F_BOX .BT a:hover {
                    background-color: #369;
                }

        .F_BOX #css_table_tablayout {
            background-color: transparent;
        }

            .F_BOX #css_table_tablayout .css_tr {
                display: block;
                border: #ddd 1px solid;
                margin-bottom: 5px;
                background: #ffffff;
            }

            .F_BOX #css_table_tablayout .css_td {
                display: inline-block;
                border: #ddd 1px solid;
                width: 100%;
                border: none;
            }

        /*-----表單樣式--------------------*/
        .F_BOX #css_table_tablayout {
            display: table;
            width: 100%;
            margin: 0 auto;
        }

            .F_BOX #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
                .background-color:#eee;
            }
            /*標題部分*/
            .F_BOX #css_table_tablayout .css_tr:first-child {
                font-size: 87.5%;
                font-weight: bold;
                color: #707070;
                background-color: #fff;
                _display: none;
                .display: none;
            }

                .F_BOX #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .F_BOX #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

            .F_BOX #css_table_tablayout .line {
                border-top: #4990bb 2px solid;
                border-bottom: #4990bb 2px solid;
                background-color: #FFF;
            }

            .F_BOX #css_table_tablayout .title {
                display: none;
                .display: none;
            }

            .F_BOX #css_table_tablayout .css_td b {
                color: #0277bd;
                display: block;
                display: inline;
                padding-right: 5px;
                letter-spacing: normal;
            }

            .F_BOX #css_table_tablayout .css_td .tabbtn {
                background-color: #333;
                text-decoration: none;
                font-weight: bold;
                color: #FFF;
                font-size: 75%;
                padding: 2px 5px;
                border-radius: 5px;
            }

                .F_BOX #css_table_tablayout .css_td .tabbtn:hover {
                    text-decoration: underline;
                }

            .F_BOX #css_table_tablayout .css_td a img {
                vertical-align: middle;
                border: 0;
            }

            .F_BOX #css_table_tablayout .css_tr .css_td.pname {
                width: 100%;
            }

            .F_BOX #css_table_tablayout .css_tr .css_td.pnumber. {
                width: 100%;
            }

            .F_BOX #css_table_tablayout .css_tr .css_td.name {
                width: 100%;
            }

            .F_BOX #css_table_tablayout .css_tr .css_td.file {
                width: 100%;
            }

            .F_BOX #css_table_tablayout .css_tr .css_td.day {
                width: 100%;
            }

            .F_BOX #css_table_tablayout .css_tr .css_td.immg {
                width: 300px;
            }

                .F_BOX #css_table_tablayout .css_tr .css_td.immg img {
                    margin: 1px;
                }

            .F_BOX #css_table_tablayout .css_tr .css_td.none b {
                display: none;
            }

            .F_BOX #css_table_tablayout .css_tr .css_td.none {
                font-weight: bold;
                font-size: 120%;
                border-bottom: 1px solid #999;
            }

        .F_BOX h1 {
            text-align: center;
            font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
            color: #175271;
            font-size: 20px;
            line-height: 150%;
        }

        .F_BOX p.T01_SS {
            float: left;
            height: 40px;
            line-height: 40px;
        }

        .F_BOX .BT {
            float: right;
            margin-top: 10px;
        }

            .F_BOX .BT a {
                color: rgba(255,255,255,0.8);
                font-size: 80%;
                background-color: rgba(115,153,168,0.8);
                padding: 5px;
                border-radius: 6px;
            }

                .F_BOX .BT a:hover {
                    background-color: #369;
                }

    .articlebox .container .member {
        width: 96%;
        height: auto;
        overflow: hidden;
        margin: 0 auto;
        margin-bottom: 10px;
    }

        .articlebox .container .member .mainbox {
            width: 100%;
            margin: 0 auto;
            padding: 10%;
        }

            .articlebox .container .member .mainbox .form_text {
                padding: 8px 10px;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                width: 80%;
                font-size: 16px;
                background-color: #FFF;
                color: #c2c2c2;
                border-radius: 6px;
                margin: 5px 0;
                border: 0;
                display: block;
            }

            .articlebox .container .member .mainbox .form_text2 {
                padding: 8px 10px;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                width: auto;
                font-size: 16px;
                background-color: #FFF;
                color: #c2c2c2;
                border-radius: 6px;
                margin: 5px 0;
                border: 0;
            }

    .button, a .button {
        font-size: 22px;
        border-radius: 6px; /*圓角左上 右上 右下 左下 順時針*/
        color: #fff;
        background: #25b5cd;
        .background:#25b5cd; /*IE6/.IE7*/
        background: linear-gradient(#25b5cd 50%, #13a8c0 50%);
        background: -webkit-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*Chrome10+,Safari5.1+*/
        background: -ms-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*IE10+*/
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25b5cd', endColorstr='#13a8c0',GradientType=0); /*IE6-9*/
        padding: 8px 15px;
        width: auto;
        min-width: 120px;
        display: block;
        margin: 5px auto;
        text-decoration: none;
        border: 1px;
        font-family: "微軟正黑體", "新細明體", "細明體",Arial, Helvetica, sans-serif;
        cursor: pointer;
        text-align: center;
    }

        .button:hover {
            color: #fff;
            text-decoration: none;
            background: #0293ac;
        }

    .button01, a .button01 {
        font-size: 22px;
        border-radius: 6px; /*圓角左上 右上 右下 左下 順時針*/
        color: #fff;
        background: #25b5cd;
        .background:#25b5cd; /*IE6/.IE7*/
        background: linear-gradient(#25b5cd 50%, #13a8c0 50%);
        background: -webkit-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*Chrome10+,Safari5.1+*/
        background: -ms-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*IE10+*/
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25b5cd', endColorstr='#13a8c0',GradientType=0); /*IE6-9*/
        width: 100%;
        padding: 8px 15px;
        display: block;
        margin: 5px auto;
        text-decoration: none;
        border: 1px;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        cursor: pointer;
        text-align: center;
    }

        .button01:hover {
            color: #fff;
            text-decoration: none;
            background: #0293ac;
        }


    .btnbox {
        clear: both;
        margin: 10px auto;
        text-align: center;
    }

        .btnbox .more {
            background-color: #cedbe1;
            color: #FFF;
            padding: 2px 10px;
            text-decoration: none;
        }

            .btnbox .more:hover {
                background-color: #10a6be;
            }

    .line {
        height: 2px;
        border-bottom: 1px dotted #CCCCCC;
    }




    .footerbox .footerlogo {
        display: none;
    }

        .footerbox .footerlogo img {
            width: 130px;
            height: auto;
        }

    .footerbox .footerinfo {
        width: 90%;
        height: auto;
        float: none;
        padding-left: 0px;
        padding-top: 10px;
        padding-bottom: 10px;
        text-align: left;
        margin: 0 auto;
    }

        .footerbox .footerinfo h1 {
            font-size: 120%;
            color: #FFF;
        }

        .footerbox .footerinfo p {
            font-size: 14px;
            color: rgba(255,255,255,0.5);
        }

    /*news*/
    .news {
        width: 100%;
        height: auto;
        margin: 10px auto 10px auto;
        overflow: hidden;
        float: left;
        border: 1px solid #eee;
        padding: 0 15px 15px 15px;
    }

        .news .corner_css {
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 20px 20px 0 0;
            border-color: #b92939 transparent transparent transparent;
            margin-left: -15px;
            position: absolute;
        }

    .newsbox .leftimg {
        display: none;
        width: 100%;
        height: auto;
        overflow: hidden;
        float: none;
        text-align: center;
    }

        .newsbox .leftimg img {
            width: 96%;
            height: auto;
            margin: 0 auto;
        }

    .newsbox .rightfont {
        width: 100%;
        height: auto;
        overflow: hidden;
        float: none;
        margin: 0 2%;
    }

        .newsbox .rightfont .newslist {
            width: 100%;
            height: auto;
        }

            .newsbox .rightfont .newslist ul {
                width: 100%;
                height: auto;
                list-style-type: square;
            }

                .newsbox .rightfont .newslist ul li {
                    height: auto;
                    color: #333;
                    line-height: 120%;
                    padding: 6px 2%;
                    border-bottom: 1px dashed #CCCCCC;
                    width: 96%;
                    margin: 0 auto 0 0;
                    overflow: hidden;
                    white-space: normal;
                    text-overflow: none;
                    text-overflow: ellipsis;
                }

                    .newsbox .rightfont .newslist ul li a {
                        color: #333;
                        line-height: 120%;
                    }

                        .newsbox .rightfont .newslist ul li a .day {
                            font-size: 80%;
                        }

                        .newsbox .rightfont .newslist ul li a .fistfont {
                            margin-left: 0px;
                        }

    .indexsitemap {
        width: 100%;
        height: auto;
        min-height: auto;
        margin: 0 auto;
        background-color: #f2f2f2;
    }

        .indexsitemap .centerbox {
            width: 90%;
            height: auto;
            margin: 0 auto;
            padding: 20px 0 10px 0;
            overflow: hidden;
        }

            .indexsitemap .centerbox .sitemapimg {
                display: none;
            }

    #sitemap {
        width: 100%;
        list-style: none;
    }

        #sitemap li {
            float: left;
        }

        #sitemap .title {
            color: #00a2b5;
            font-size: 100%;
            font-weight: bold;
            padding-bottom: 8px;
            width: 45%;
            min-height: 130px;
            margin-right: 10px;
            float: left;
        }

        #sitemap .title2 {
            color: #00a2b5;
            font-size: 100%;
            font-weight: bold;
            padding-bottom: 8px;
            margin-right: 0px;
            width: 90px;
        }

            #sitemap .title a, #sitemap .title2 a {
                color: #000;
                text-decoration: none;
            }

        #sitemap .title ul {
            margin-top: 5px;
        }

            #sitemap .title ul li {
                color: #0b0b0b;
                font-size: 95%;
                list-style-type: none;
                font-weight: normal;
                margin-bottom: 6px;
                width: 90%;
            }

                #sitemap .title ul li a {
                    color: #0b0b0b;
                    font-size: 80%;
                    list-style-type: none;
                    text-decoration: none;
                    line-height: 110%;
                }

                    #sitemap .title ul li a:hover {
                        color: #0b0b0b;
                        text-decoration: underline;
                    }

                #sitemap .title ul li ul li {
                    color: #a6a6a6;
                    font-size: 80%;
                    margin-left: 6px;
                    list-style-type: none;
                }

                    #sitemap .title ul li ul li a {
                        color: #a6a6a6;
                        font-size: 80%;
                        list-style-type: none;
                    }

                        #sitemap .title ul li ul li a:hover {
                            text-decoration: underline;
                        }

    .article .articlebox .content {
        width: 96%;
        height: auto;
        margin: 10px 2%;
        padding: 20px 0;
        line-height: 180%;
        border-top: 1px dashed #CCCCCC;
    }

        .article .articlebox .content h1 {
            font-size: 140%;
            line-height: 130%;
        }

        .article .articlebox .content h2 {
            font-size: 130%;
            line-height: 130%;
        }

        .article .articlebox .content h3 {
            font-size: 120%;
            line-height: 130%;
        }

        .article .articlebox .content h4 {
            font-size: 110%;
            line-height: 130%;
        }

        .article .articlebox .content h5 {
            font-size: 100%;
            line-height: 130%;
        }
        /*多圖*/
        .article .articlebox .content .imglist {
            width: 100%;
            height: auto;
            overflow: hidden;
            margin: 10px 0%;
            background-color: #f4f4f4;
        }

            .article .articlebox .content .imglist h1 {
                font-size: 100%;
                color: #999;
                padding: 2%;
                padding-bottom: 0;
            }

            .article .articlebox .content .imglist .imgbox {
                width: 50%;
                height: 170px;
                padding: 2%;
                background-color: #f4f4f4;
                float: left;
            }

                .article .articlebox .content .imglist .imgbox .img {
                    width: 100%;
                    height: 140px;
                    overflow: hidden;
                }

                .article .articlebox .content .imglist .imgbox img {
                    width: 100%;
                    height: auto;
                }

        /*多檔案下載*/
        .article .articlebox .content .downloadlist {
            width: 96%;
            height: auto;
            overflow: hidden;
            margin: 10px 2%;
        }

            .article .articlebox .content .downloadlist h1 {
                font-size: 100%;
                color: #999;
            }

            .article .articlebox .content .downloadlist a {
                display: inline-block;
                width: 100%;
                margin: 1%;
                border-bottom: 1px dotted #CCCCCC;
                color: #000;
                background: url(../frontimages/Inbox.png) no-repeat left center;
                background-size: 25px auto;
                padding-left: 30px;
            }

                .article .articlebox .content .downloadlist a:hover {
                    color: #333;
                }

    /*======radio==============*/
    .checkbox_radio {
        width: 20px;
        height: 20px;
        margin-right: 3px;
        vertical-align: middle;
        margin-top: -2px;
    }

    .checkbox_css {
        width: 20px;
        height: 20px;
        margin-right: 3px;
        vertical-align: middle;
        margin-top: -2px;
    }

    .tabletitle {
        color: #666;
        padding: 10px 0;
        clear: both;
        font-weight: normal;
        font-size: 90%;
    }

        .tabletitle strong {
            color: #ff9600;
            font-size: 100%;
        }

        .tabletitle span {
            display: block;
        }

    /*預約訂票*/
    .inputbox {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 2% 0%;
    }

    .orderbg01 {
        background-color: #eee;
        border-radius: 10px;
        padding: 15px;
    }

    .inputbox .boxlist {
        width: 100%;
        height: auto;
        margin: 10px auto;
        text-align: center;
    }

        .inputbox .boxlist p {
            display: inline-block;
            min-width: 10%;
            padding-right: 10px;
        }

            .inputbox .boxlist p i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 10px;
            }

        .inputbox .boxlist input {
            padding: 5px;
            margin: 0;
        }

        .inputbox .boxlist select {
            padding: 5px 5px;
            margin: 0;
        }

        .inputbox .boxlist > .btn {
            margin: 0 auto;
            margin-bottom: 5px;
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            color: #FFF;
            border: 0;
            cursor: pointer;
            width: 50%;
            text-align: center;
            padding: 10px 20px;
            border-radius: 5px;
        }

    .inputbox #css_table_tablayout {
        background-color: transparent;
        text-align: left;
    }

        .inputbox #css_table_tablayout .css_tr {
            display: block;
            border: #ddd 1px solid;
            margin-bottom: 5px;
            background: #ffffff;
        }

        .inputbox #css_table_tablayout .css_td {
            display: inline-block;
            border: #ddd 1px solid;
            width: 100%;
            border: none;
            text-align: left;
            padding: 1% 1%;
        }

    .inputbox #css_table_tablayout {
        display: table;
        width: 100%;
        margin: 0 auto;
    }

        .inputbox #css_table_tablayout .css_tr:nth-child(odd) {
            background-color: #eee;
            .display: inline-block;
            .background-color:#eee;
        }

        .inputbox #css_table_tablayout .css_tr:first-child {
            font-size: 87.5%;
            font-weight: bold;
            color: #707070;
            background-color: #000;
            _display: none;
            .display: none;
        }

            .inputbox #css_table_tablayout .css_tr:first-child a {
                text-decoration: none;
                color: #666;
            }

                .inputbox #css_table_tablayout .css_tr:first-child a:hover {
                    text-decoration: none;
                    color: #188fa7;
                }

        .inputbox #css_table_tablayout .line {
            border-top: #4990bb 2px solid;
            border-bottom: #4990bb 2px solid;
            background-color: #FFF;
        }

        .inputbox #css_table_tablayout .title {
            display: none;
            .display: none;
        }

        .inputbox #css_table_tablayout .css_td b {
            color: #999;
            display: block;
            display: block;
            padding-right: 5px;
            letter-spacing: normal;
        }

        .inputbox #css_table_tablayout .css_tr .css_td.none b {
            display: none;
        }

        .inputbox #css_table_tablayout .css_tr .css_td.none {
            font-weight: bold;
            font-size: 120%;
            border-bottom: 1px solid #999;
        }

        .inputbox #css_table_tablayout .css_tr .css_td span {
            font-size: 200%;
            line-height: 150%;
        }

        .inputbox #css_table_tablayout .css_tr .css_td .gotime {
            color: #00b5ca;
            font-weight: bold;
            font-size: 200%;
        }

        .inputbox #css_table_tablayout .css_tr .Bbox01 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

        .inputbox #css_table_tablayout .css_tr .Bbox02 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

        .inputbox #css_table_tablayout .css_tr .Bbox04 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

        .inputbox #css_table_tablayout .css_tr .Bbox03 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

            .inputbox #css_table_tablayout .css_tr .Bbox03 span {
                font-size: 130%;
            }

        .inputbox #css_table_tablayout .css_tr .Bbox04 span {
            line-height: 220%;
            font-size: 130%;
        }

        .inputbox #css_table_tablayout .css_td .tabbtn a {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 70%;
            padding: 5px 15px;
            border-radius: 5px;
        }

            .inputbox #css_table_tablayout .css_td .tabbtn a:hover {
                background: #00b5ca;
                text-decoration: none;
            }

        .inputbox #css_table_tablayout .css_td .tabbtn_on a {
            background-color: #F60;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 70%;
            padding: 5px 15px;
            border-radius: 5px;
        }

    /*船艙*/
    .inputbox3 #css_table_tablayout {
        background-color: transparent;
        text-align: left;
    }

        .inputbox3 #css_table_tablayout .css_tr {
            display: block;
            border: #ddd 0px solid;
            margin-bottom: 5px;
            background: #ffffff;
        }

        .inputbox3 #css_table_tablayout .css_td {
            display: inline-block;
            border: #ddd 1px solid;
            width: 46%;
            border: none;
            text-align: left;
            padding: 3% 3%;
            margin: 4px 2px;
            background-color: #eee;
            border-radius: 6px;
        }

    .inputbox3 #css_table_tablayout {
        display: table;
        width: 100%;
        margin: 0 auto;
    }

        .inputbox3 #css_table_tablayout .css_tr:nth-child(odd) {
            background-color: #eee;
            .display: inline-block;
            .background-color:#eee;
        }

        .inputbox3 #css_table_tablayout .css_tr:first-child {
            font-size: 87.5%;
            font-weight: bold;
            color: #707070;
            background-color: #000;
            _display: none;
            .display: none;
        }

            .inputbox3 #css_table_tablayout .css_tr:first-child a {
                text-decoration: none;
                color: #666;
            }

                .inputbox3 #css_table_tablayout .css_tr:first-child a:hover {
                    text-decoration: none;
                    color: #188fa7;
                }

        .inputbox3 #css_table_tablayout .line {
            border-top: #4990bb 2px solid;
            border-bottom: #4990bb 2px solid;
            background-color: #FFF;
        }

        .inputbox3 #css_table_tablayout .title {
            display: none;
            .display: none;
        }

        .inputbox3 #css_table_tablayout .css_td b {
            color: #00b5ca;
            display: inline-block;
            padding-right: 5px;
            letter-spacing: normal;
            font-size: 120%;
        }

            .inputbox3 #css_table_tablayout .css_td b span {
                font-size: 90%;
                color: #999;
                font-weight: normal;
            }

                .inputbox3 #css_table_tablayout .css_td b span:before {
                    content: " ";
                }

        .inputbox3 #css_table_tablayout .css_td .peoplenumber select {
            padding: 2px;
            min-width: 90%;
            font-size: 120%;
        }

    /*船次資訊*/
    .orderinputlist {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 2% 0%;
    }

        .orderinputlist #css_table_tablayout {
            background-color: transparent;
            text-align: left;
        }

            .orderinputlist #css_table_tablayout .css_tr {
                display: block;
                border: #ddd 1px solid;
                margin-bottom: 5px;
                background: #ffffff;
            }

            .orderinputlist #css_table_tablayout .css_td {
                display: inline-block;
                border: #ddd 1px solid;
                width: 100%;
                border: none;
                text-align: left;
                padding: 1% 1%;
            }

        .orderinputlist #css_table_tablayout {
            display: table;
            width: 100%;
            margin: 0 auto;
        }

            .orderinputlist #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
                .background-color:#eee;
            }

            .orderinputlist #css_table_tablayout .css_tr:first-child {
                font-size: 87.5%;
                font-weight: bold;
                color: #707070;
                background-color: #000;
                _display: none;
                .display: none;
            }

                .orderinputlist #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .orderinputlist #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

            .orderinputlist #css_table_tablayout .line {
                border-top: #4990bb 2px solid;
                border-bottom: #4990bb 2px solid;
                background-color: #FFF;
            }

            .orderinputlist #css_table_tablayout .title {
                display: none;
                .display: none;
            }

            .orderinputlist #css_table_tablayout .css_td b {
                color: #00b5ca;
                display: inline-block;
                width: 30%;
                text-align: right;
                padding-right: 10px;
                letter-spacing: normal;
            }

            .orderinputlist #css_table_tablayout .css_tr .css_td.none b {
                display: none;
            }

            .orderinputlist #css_table_tablayout .css_tr .css_td.none {
                font-weight: bold;
                font-size: 120%;
                border-bottom: 1px solid #999;
            }
    /*填寫乘客資料*/
    .orderinput {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 2% 0%;
    }

        .orderinput .tabletitle span {
            display: inline-block;
        }

            .orderinput .tabletitle span i {
                font-style: normal;
                color: #F00;
                font-weight: normal;
                padding-right: 2px;
                font-size: 90%;
                padding-left: 10px;
            }

        .orderinput #css_table_tablayout {
            background-color: transparent;
            text-align: left;
        }

            .orderinput #css_table_tablayout .css_tr {
                display: block;
                border: #ddd 1px solid;
                margin-bottom: 5px;
                background: #ffffff;
            }

            .orderinput #css_table_tablayout .css_td {
                display: inline-block;
                border: #ddd 1px solid;
                width: 100%;
                border: none;
                text-align: left;
                padding: 1% 1%;
                line-height: 180%;
            }

        .orderinput #css_table_tablayout {
            display: table;
            width: 100%;
            margin: 0 auto;
        }

            .orderinput #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
                .background-color:#eee;
            }

            .orderinput #css_table_tablayout .css_tr:first-child {
                font-size: 87.5%;
                font-weight: bold;
                color: #707070;
                background-color: #000;
                _display: none;
                .display: none;
            }

                .orderinput #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .orderinput #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

            .orderinput #css_table_tablayout .line {
                border-top: #4990bb 2px solid;
                border-bottom: #4990bb 2px solid;
                background-color: #FFF;
            }

            .orderinput #css_table_tablayout .title {
                display: none;
                .display: none;
            }

            .orderinput #css_table_tablayout .css_td b {
                color: #00b5ca;
                display: inline-block;
                width: 31%;
                text-align: right;
                vertical-align: top;
                padding-right: 10px;
                letter-spacing: normal;
            }

            .orderinput #css_table_tablayout .css_td span {
                display: inline-block;
                width: 68%;
            }

            .orderinput #css_table_tablayout .css_td input,
            .orderinput #css_table_tablayout .css_td select {
                padding: 2px;
                font-size: 100%;
                margin: 1px 0;
            }

            .orderinput #css_table_tablayout .css_tr .css_td.none b {
                display: none;
            }

            .orderinput #css_table_tablayout .css_tr .css_td.none {
                font-weight: bold;
                font-size: 120%;
                border-bottom: 1px solid #999;
            }

            .orderinput #css_table_tablayout .Bbox05 span {
                display: inline-block;
                text-align: left;
            }

            .orderinput #css_table_tablayout .Bbox08 .masu input {
                width: 100%;
            }

            .orderinput #css_table_tablayout .Bbox08 b span {
                display: block;
                text-align: right;
            }

            .orderinput #css_table_tablayout .css_td b i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 2px;
            }

            .orderinput #css_table_tablayout .Bbox07 img {
                margin-top: 3px;
            }

    /*訂購人*/
    .ordermainer {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 2% 0%;
    }

        .ordermainer .tabletitle span {
            display: inline-block;
        }

            .ordermainer .tabletitle span i {
                font-style: normal;
                color: #F00;
                font-weight: normal;
                padding-right: 2px;
                font-size: 90%;
                padding-left: 10px;
            }

        .ordermainer #css_table_tablayout {
            background-color: transparent;
            text-align: left;
        }

            .ordermainer #css_table_tablayout .css_tr {
                display: block;
                border: #ddd 1px solid;
                margin-bottom: 5px;
                background: #ffffff;
            }

            .ordermainer #css_table_tablayout .css_td {
                display: inline-block;
                border: #ddd 1px solid;
                width: 100%;
                border: none;
                text-align: left;
                padding: 1% 1%;
                line-height: 180%;
            }

        .ordermainer #css_table_tablayout {
            display: table;
            width: 100%;
            margin: 0 auto;
        }

            .ordermainer #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
                .background-color:#eee;
            }

            .ordermainer #css_table_tablayout .css_tr:first-child {
                font-size: 87.5%;
                font-weight: bold;
                color: #707070;
                background-color: #000;
                _display: none;
                .display: none;
            }

                .ordermainer #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .ordermainer #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

            .ordermainer #css_table_tablayout .line {
                border-top: #4990bb 2px solid;
                border-bottom: #4990bb 2px solid;
                background-color: #FFF;
            }

            .ordermainer #css_table_tablayout .title {
                display: none;
                .display: none;
            }

            .ordermainer #css_table_tablayout .css_td b {
                color: #00b5ca;
                display: inline-block;
                width: 31%;
                text-align: right;
                vertical-align: top;
                padding-right: 10px;
                letter-spacing: normal;
            }

            .ordermainer #css_table_tablayout .css_td span {
                display: inline-block;
                width: 68%;
            }

            .ordermainer #css_table_tablayout .css_td input,
            .ordermainer #css_table_tablayout .css_td select {
                padding: 2px;
                font-size: 100%;
                margin: 1px 0;
            }

            .ordermainer #css_table_tablayout .css_tr .css_td.none b {
                display: none;
            }

            .ordermainer #css_table_tablayout .css_tr .css_td.none {
                font-weight: bold;
                font-size: 120%;
                border-bottom: 1px solid #999;
            }

            .ordermainer #css_table_tablayout .Bbox05 span {
                display: inline-block;
                text-align: left;
            }

            .ordermainer #css_table_tablayout .Bbox08 .masu input {
                width: 100%;
            }

            .ordermainer #css_table_tablayout .Bbox08 b span {
                display: block;
                text-align: right;
            }

            .ordermainer #css_table_tablayout .css_td b i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 2px;
            }

            .ordermainer #css_table_tablayout .Bbox07 img {
                margin-top: 3px;
            }

            .ordermainer #css_table_tablayout .Bbox04 input {
                width: 100%;
            }

            .ordermainer #css_table_tablayout .Bbox01 {
                padding-left: 0px;
            }

    /*結帳刷卡*/
    .paycard {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 0 auto;
    }

    .paycardbg01 {
        background-color: #eee;
        border-radius: 10px;
        padding: 10px;
        margin-top: 20px;
        margin-bottom: 20px;
        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    }

    .paycard .boxlist {
        width: auto;
        height: auto;
        margin: 10px 10px;
        display: inline-block;
        font-size: 110%;
        font-weight: bold;
    }

        .paycard .boxlist p {
            display: block;
            min-width: 10%;
            padding-right: 10px;
            font-weight: normal;
            font-size: 90%;
        }

            .paycard .boxlist p i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 10px;
            }

        .paycard .boxlist span {
            margin: 5px 15px;
            font-size: 110%;
        }

    /*結帳畫面.ordershow*/
    .ordershow .cardbill {
        text-align: center;
        padding: 20px;
    }

        .ordershow .cardbill img {
            width: 60%;
            height: auto;
        }

    .ordershow {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 2% 0%;
    }

        .ordershow .tabletitle span {
            display: inline-block;
        }

            .ordershow .tabletitle span i {
                font-style: normal;
                color: #F00;
                font-weight: normal;
                padding-right: 2px;
                font-size: 90%;
                padding-left: 10px;
            }

        .ordershow #css_table_tablayout {
            background-color: transparent;
            text-align: left;
        }

            .ordershow #css_table_tablayout .css_tr {
                display: block;
                border: #ddd 1px solid;
                margin-bottom: 5px;
                background: #ffffff;
            }

            .ordershow #css_table_tablayout .css_td {
                display: inline-block;
                border: #ddd 1px solid;
                width: 100%;
                border: none;
                text-align: left;
                padding: 0% 1%;
                line-height: 180%;
            }

        .ordershow #css_table_tablayout {
            display: table;
            width: 100%;
            margin: 0 auto;
        }

            .ordershow #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
                .background-color:#eee;
            }

            .ordershow #css_table_tablayout .css_tr:first-child {
                font-size: 87.5%;
                font-weight: bold;
                color: #707070;
                background-color: #000;
                _display: none;
                .display: none;
            }

                .ordershow #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #666;
                }

                    .ordershow #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

            .ordershow #css_table_tablayout .line {
                border-top: #4990bb 2px solid;
                border-bottom: #4990bb 2px solid;
                background-color: #FFF;
            }

            .ordershow #css_table_tablayout .title {
                display: none;
                .display: none;
            }

            .ordershow #css_table_tablayout .css_td b {
                color: #00b5ca;
                display: inline-block;
                width: 31%;
                text-align: right;
                vertical-align: top;
                padding-right: 10px;
                letter-spacing: normal;
            }

            .ordershow #css_table_tablayout .css_td span {
                display: inline-block;
                width: 68%;
            }

            .ordershow #css_table_tablayout .css_td input,
            .ordershow #css_table_tablayout .css_td select {
                padding: 2px;
                font-size: 100%;
                margin: 1px 0;
            }

            .ordershow #css_table_tablayout .css_tr .css_td.none b {
                display: none;
            }

            .ordershow #css_table_tablayout .css_tr .css_td.none {
                font-weight: bold;
                font-size: 120%;
                border-bottom: 1px solid #999;
            }

            .ordershow #css_table_tablayout .Bbox05 span {
                display: inline-block;
                text-align: left;
            }


    /*查詢.querybox*/
    .querybox {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 2% 0%;
    }

    .inputbox .boxlist .queryicon1, .inputbox .boxlist .queryicon2 {
        display: block;
        width: 60px;
        height: auto;
        border-radius: 10px;
        line-height: 150%;
        background-color: #F09;
        text-align: center;
        font-weight: bold;
        color: #fff;
        margin-right: 10px;
        padding: 2px 5px;
    }

    .inputbox .boxlist .queryicon2 {
        background-color: #F60;
    }

    .orderbg01 {
        background-color: #eee;
        border-radius: 10px;
        padding: 10px;
    }

    .querybox .boxlist {
        width: 100%;
        height: auto;
        margin: 5px auto;
        text-align: center;
    }

        .querybox .boxlist p {
            display: inline-block;
            min-width: 10%;
            padding-right: 10px;
        }

            .querybox .boxlist p i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 10px;
            }

        .querybox .boxlist input {
            padding: 5px;
        }

        .querybox .boxlist select {
            padding: 5px 5px;
            margin: 0;
        }

        .querybox .boxlist > .btn {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            color: #FFF;
            border: 0;
            cursor: pointer;
            width: 50%;
            margin: 0 auto;
            text-align: center;
            padding: 10px 20px;
            border-radius: 5px;
        }

    .querybox #css_table_tablayout {
        background-color: transparent;
        text-align: left;
    }

        .querybox #css_table_tablayout .css_tr {
            display: block;
            border: #ddd 1px solid;
            margin-bottom: 5px;
            background: #ffffff;
        }

        .querybox #css_table_tablayout .css_td {
            display: inline-block;
            border: #ddd 1px solid;
            width: 100%;
            border: none;
            text-align: left;
            padding: 1% 1%;
        }

    .querybox #css_table_tablayout {
        display: table;
        width: 100%;
        margin: 0 auto;
    }

        .querybox #css_table_tablayout .css_tr:nth-child(odd) {
            background-color: #eee;
            .display: inline-block;
            .background-color:#eee;
        }

        .querybox #css_table_tablayout .css_tr:first-child {
            font-size: 87.5%;
            font-weight: bold;
            color: #707070;
            background-color: #000;
            _display: none;
            .display: none;
        }

            .querybox #css_table_tablayout .css_tr:first-child a {
                text-decoration: none;
                color: #666;
            }

                .querybox #css_table_tablayout .css_tr:first-child a:hover {
                    text-decoration: none;
                    color: #188fa7;
                }

        .querybox #css_table_tablayout .line {
            border-top: #4990bb 2px solid;
            border-bottom: #4990bb 2px solid;
            background-color: #FFF;
        }

        .querybox #css_table_tablayout .title {
            display: none;
            .display: none;
        }

        .querybox #css_table_tablayout .css_td b {
            color: #999;
            display: block;
            display: block;
            padding-right: 5px;
            letter-spacing: normal;
        }

        .querybox #css_table_tablayout .css_tr .css_td span {
            font-size: 200%;
            line-height: 150%;
        }

        .querybox #css_table_tablayout .css_tr .css_td .gotime {
            color: #00b5ca;
            font-weight: bold;
            font-size: 200%;
        }

        .querybox #css_table_tablayout .css_tr .Bbox01 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

        .querybox #css_table_tablayout .css_tr .Bbox02 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

        .querybox #css_table_tablayout .css_tr .Bbox04 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

        .querybox #css_table_tablayout .css_tr .Bbox03 {
            width: 48%;
            display: inline-block;
            font-size: 80%;
        }

            .querybox #css_table_tablayout .css_tr .Bbox03 span,
            .querybox #css_table_tablayout .css_tr .Bbox04 span {
                line-height: 220%;
                font-size: 130%;
            }

    /*mapmap*/
    .mapmap_mob {
        display: block;
        width: 100%;
        height: auto;
        margin-bottom: 10px;
        opacity: 1;
        background-color: #FFF;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        border: 1px solid #eee;
        padding: 15px;
    }

    .mapmap {
        display: none;
    }

    /*indexitem*/
    .indexactivity {
        display: none;
    }
}

/* == 平板版型區 =============================== */

@media screen and (min-width: 768px) and (max-width: 1224px) {
    /*indexitem*/
    .indexactivity {
        position: relative;
        width: 100%;
        height: auto;
        margin: 0px 0 20px 0;
        background-color: #FFF;
        border: 1px solid #eee;
        padding: 10px;
    }

    .indexbox {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 0.5% auto;
    }

    .indexitem {
        overflow: hidden;
        float: left;
        margin: 2%;
        background-color: #eee;
    }

    .headerbox {
        height: auto;
        width: 100%;
        margin: 0 auto;
        position: relative;
    }

    .ADVbox {
        height: auto;
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
        background-color: #6CF;
        margin-top: 70px;
    }

    .articlebox {
        height: auto;
        width: 92%;
        margin: 0 4%;
        overflow: hidden;
        background-color: #FFF;
        margin-top: 20px;
    }

    .footerbox {
        height: auto;
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
        background: none;
    }

    .headerbox #TOP {
        position: absolute;
        top: -100px;
        right: 0px;
        width: 50px;
        height: 50px;
        cursor: pointer;
        z-index: 999;
    }

        .headerbox #TOP img {
            width: 100%;
            height: auto;
        }

    .topbgsky {
        position: absolute;
        width: 100%;
        height: 104px;
        background: url(../frontimages/topbgsky.png) repeat-x top center;
        z-index: 99;
    }

        .topbgsky .topbgskybox {
            height: auto;
            width: 100%;
            margin: 0 auto;
            position: relative;
        }

            .topbgsky .topbgskybox h1 {
                text-indent: -9999px;
                display: block;
                padding-top: 20px;
                padding-left: 10px;
            }

    .headerbox .logo {
        display: block;
        width: 100%;
        height: 70px;
        float: left;
        background: url(../frontimages/logo.png) 10px bottom no-repeat;
        background-size: auto 60px;
    }

    .topbgsky .topbgskybox .topnav {
        display: none;
    }

    .topmenu {
        display: none;
    }

    /*標題*/
    .article .articlebox .title {
        font-size: 24px;
        color: #00b5ca;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        margin: 10px 2%;
    }

        .article .articlebox .title span {
            color: #CCC;
            font-weight: normal;
        }

    .article .articlebox .pagebanner {
        position: relative;
        width: 100%;
        height: auto;
        margin: 10px auto;
        clear: both;
        overflow: hidden;
        margin-top: 10px;
    }

        .article .articlebox .pagebanner img {
            width: 100%;
            height: auto;
        }

    .article .articlebox .pagetitle {
        position: absolute;
        top: 35%;
        left: 5%;
        font-size: 150%;
        color: #FFF;
        text-shadow: 0 1px 1px rgba(0,0, 0, 0.4);
    }

        .article .articlebox .pagetitle span {
            font-size: 90%;
            color: rgba(255,255,255,0.7);
            font-weight: normal;
        }

    /*--topfrom麵包屑--*/
    #topfrom {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 0px auto;
        padding: 5px 0px;
        font-size: 90%;
    }

        #topfrom a {
            color: #666;
            text-decoration: none;
            padding: 0px 3px;
        }

            #topfrom a:hover {
                color: #333;
                text-decoration: underline;
            }



    .articlebox .container .member {
        width: 96%;
        height: auto;
        overflow: hidden;
        margin: 0 auto;
        margin-bottom: 10px;
    }

        .articlebox .container .member .mainbox {
            width: 100%;
            margin: 0 auto;
            padding: 10%;
        }

            .articlebox .container .member .mainbox .form_text {
                padding: 8px 10px;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                width: 80%;
                font-size: 16px;
                background-color: #FFF;
                color: #c2c2c2;
                border-radius: 6px;
                margin: 5px 0;
                border: 0;
                display: block;
            }

            .articlebox .container .member .mainbox .form_text2 {
                padding: 8px 10px;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                width: auto;
                font-size: 16px;
                background-color: #FFF;
                color: #c2c2c2;
                border-radius: 6px;
                margin: 5px 0;
                border: 0;
            }

    .button, a .button {
        font-size: 22px;
        border-radius: 6px; /*圓角左上 右上 右下 左下 順時針*/
        color: #fff;
        background: #25b5cd;
        .background:#25b5cd; /*IE6/.IE7*/
        background: linear-gradient(#25b5cd 50%, #13a8c0 50%);
        background: -webkit-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*Chrome10+,Safari5.1+*/
        background: -ms-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*IE10+*/
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25b5cd', endColorstr='#13a8c0',GradientType=0); /*IE6-9*/
        padding: 8px 15px;
        width: auto;
        min-width: 120px;
        display: block;
        margin: 5px auto;
        text-decoration: none;
        border: 1px;
        font-family: "微軟正黑體", "新細明體", "細明體",Arial, Helvetica, sans-serif;
        cursor: pointer;
        text-align: center;
    }

        .button:hover {
            color: #fff;
            text-decoration: none;
            background: #0293ac;
        }

    .button01, a .button01 {
        font-size: 22px;
        border-radius: 6px; /*圓角左上 右上 右下 左下 順時針*/
        color: #fff;
        background: #25b5cd;
        .background:#25b5cd; /*IE6/.IE7*/
        background: linear-gradient(#25b5cd 50%, #13a8c0 50%);
        background: -webkit-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*Chrome10+,Safari5.1+*/
        background: -ms-linear-gradient(#25b5cd 50%, #13a8c0 50%); /*IE10+*/
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#25b5cd', endColorstr='#13a8c0',GradientType=0); /*IE6-9*/
        width: 100%;
        padding: 8px 15px;
        display: block;
        margin: 5px auto;
        text-decoration: none;
        border: 1px;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        cursor: pointer;
        text-align: center;
    }

        .button01:hover {
            color: #fff;
            text-decoration: none;
            background: #0293ac;
        }


    .btnbox {
        clear: both;
        margin: 10px auto;
        text-align: center;
    }

        .btnbox .more {
            background-color: #cedbe1;
            color: #FFF;
            padding: 2px 10px;
            text-decoration: none;
        }

            .btnbox .more:hover {
                background-color: #10a6be;
            }

    .line {
        height: 2px;
        border-bottom: 1px dotted #CCCCCC;
    }


    .footerbox .footerlogo {
        display: none;
    }

        .footerbox .footerlogo img {
            width: 130px;
            height: auto;
        }

    .footerbox .footerinfo {
        width: 90%;
        height: auto;
        float: none;
        padding-left: 0px;
        padding-top: 10px;
        padding-bottom: 10px;
        text-align: left;
        margin: 0 auto;
    }

        .footerbox .footerinfo h1 {
            font-size: 120%;
            color: #FFF;
        }

        .footerbox .footerinfo p {
            font-size: 14px;
            color: rgba(255,255,255,0.5);
        }



    .indexsitemap {
        width: 100%;
        height: auto;
        margin: 0 auto;
        background-color: #f2f2f2;
    }

        .indexsitemap .centerbox {
            width: 90%;
            height: auto;
            margin: 0 auto;
            padding: 20px 0 10px 20px;
            overflow: hidden;
        }

            .indexsitemap .centerbox .sitemapimg {
                display: none;
            }

    #sitemap {
        width: 100%;
        list-style: none;
    }

        #sitemap li {
            float: left;
        }

        #sitemap .title {
            color: #00a2b5;
            font-size: 100%;
            font-weight: bold;
            padding-bottom: 8px;
            width: 15%;
            min-height: 130px;
            margin-right: 10px;
            float: left;
        }

        #sitemap .title2 {
            color: #00a2b5;
            font-size: 100%;
            font-weight: bold;
            padding-bottom: 8px;
            margin-right: 0px;
            width: 15%;
        }

            #sitemap .title a, #sitemap .title2 a {
                color: #000;
                text-decoration: none;
            }

        #sitemap .title ul {
            margin-top: 5px;
        }

            #sitemap .title ul li {
                color: #0b0b0b;
                font-size: 95%;
                list-style-type: none;
                font-weight: normal;
                margin-bottom: 6px;
                width: 90%;
            }

                #sitemap .title ul li a {
                    color: #0b0b0b;
                    font-size: 80%;
                    list-style-type: none;
                    text-decoration: none;
                    line-height: 110%;
                }

                    #sitemap .title ul li a:hover {
                        color: #0b0b0b;
                        text-decoration: underline;
                    }

                #sitemap .title ul li ul li {
                    color: #a6a6a6;
                    font-size: 80%;
                    margin-left: 6px;
                    list-style-type: none;
                }

                    #sitemap .title ul li ul li a {
                        color: #a6a6a6;
                        font-size: 80%;
                        list-style-type: none;
                    }

                        #sitemap .title ul li ul li a:hover {
                            text-decoration: underline;
                        }

    .article .articlebox .content {
        width: 96%;
        height: auto;
        margin: 10px 2%;
        padding: 20px 0;
        line-height: 180%;
        border-top: 1px dashed #CCCCCC;
    }

        .article .articlebox .content h1 {
            font-size: 140%;
            line-height: 130%;
        }

        .article .articlebox .content h2 {
            font-size: 130%;
            line-height: 130%;
        }

        .article .articlebox .content h3 {
            font-size: 120%;
            line-height: 130%;
        }

        .article .articlebox .content h4 {
            font-size: 110%;
            line-height: 130%;
        }

        .article .articlebox .content h5 {
            font-size: 100%;
            line-height: 130%;
        }
        /*多圖*/
        .article .articlebox .content .imglist {
            width: 100%;
            height: auto;
            overflow: hidden;
            margin: 10px 0%;
            background-color: #f4f4f4;
        }

            .article .articlebox .content .imglist h1 {
                font-size: 100%;
                color: #999;
                padding: 1%;
                padding-bottom: 0;
            }

            .article .articlebox .content .imglist .imgbox {
                width: 33%;
                height: 170px;
                padding: 1%;
                background-color: #f4f4f4;
                float: left;
            }

                .article .articlebox .content .imglist .imgbox .img {
                    width: 100%;
                    height: 140px;
                    overflow: hidden;
                }

                .article .articlebox .content .imglist .imgbox img {
                    width: 100%;
                    height: auto;
                }

        /*多檔案下載*/
        .article .articlebox .content .downloadlist {
            width: 100%;
            height: auto;
            overflow: hidden;
            margin: 10px 0%;
        }

            .article .articlebox .content .downloadlist h1 {
                font-size: 100%;
                color: #999;
            }

            .article .articlebox .content .downloadlist a {
                display: inline-block;
                width: 100%;
                margin: 1%;
                border-bottom: 1px dotted #CCCCCC;
                color: #000;
                background: url(../frontimages/Inbox.png) no-repeat left center;
                background-size: 25px auto;
                padding-left: 30px;
            }

                .article .articlebox .content .downloadlist a:hover {
                    color: #333;
                }
    /*預約訂票*/
    .inputbox {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 0 auto;
    }

    .orderbg01 {
        background-color: #eee;
        border-radius: 10px;
        padding: 15px;
        margin-bottom: 30px;
        box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
    }

    .inputbox .boxlist .queryicon1, .inputbox .boxlist .queryicon2 {
        display: inline-block;
        width: 60px;
        height: auto;
        border-radius: 10px;
        line-height: 150%;
        background-color: #F09;
        text-align: center;
        font-weight: bold;
        color: #fff;
        margin-right: 10px;
        padding: 2px 5px;
    }

    .inputbox .boxlist .queryicon2 {
        background-color: #F60;
    }

    .inputbox .boxlist {
        width: auto;
        height: auto;
        margin: 10px 10px;
        display: inline-block;
    }

        .inputbox .boxlist p {
            display: inline-block;
            min-width: 10%;
            padding-right: 10px;
        }

            .inputbox .boxlist p i {
                font-style: normal;
                color: #F00;
                font-weight: bold;
                padding-right: 10px;
            }

        .inputbox .boxlist input {
            padding: 5px;
        }

        .inputbox .boxlist select {
            padding: 5px 5px;
            margin: 0;
        }

        .inputbox .boxlist > .btn {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            color: #FFF;
            cursor: pointer;
            width: auto;
            padding: 7px 20px;
            border-radius: 5px;
            box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
            -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        }

            .inputbox .boxlist > .btn:hover {
                background: #00b5ca;
            }

    .tabletitle {
        color: #666;
        padding: 10px 0;
        clear: both;
        font-weight: normal;
        font-size: 90%;
    }

        .tabletitle strong {
            color: #ff9600;
            font-size: 120%;
        }

    .inputbox #css_table_tablayout {
        display: table;
        width: 100%;
        letter-spacing: normal;
    }

        .inputbox #css_table_tablayout .css_tr {
            display: table-row;
            width: 100%;
            .border-bottom:#188fa7 2px solid;
            .display: inline-block;
        }

            .inputbox #css_table_tablayout .css_tr:nth-child(odd) {
                background-color: #eee;
                .display: inline-block;
            }

            .inputbox #css_table_tablayout .css_tr:first-child {
                font-weight: bold;
                background-color: #a7e2e9;
                color: #333;
                _display: none;
                .display: none;
            }

                .inputbox #css_table_tablayout .css_tr:first-child a {
                    text-decoration: none;
                    color: #333;
                }

                    .inputbox #css_table_tablayout .css_tr:first-child a:hover {
                        text-decoration: none;
                        color: #188fa7;
                    }

        .inputbox #css_table_tablayout .css_td {
            display: table-cell;
            padding: 10px 0px;
            min-width: 50px;
            .display: block;
            border-bottom: #95afb9 1px solid;
            text-align: center;
            line-height: 130%;
            font-size: 14px;
            vertical-align: middle;
        }

        .inputbox #css_table_tablayout .line {
            color: #333;
            padding: 3px 0px;
        }

        .inputbox #css_table_tablayout .css_tr .css_td h1 {
            font-size: 24px;
            color: #000;
            margin: 0px;
        }

        .inputbox #css_table_tablayout .title {
            .display: block;
            color: #FFF;
            font-size: 87.5%;
        }

        .inputbox #css_table_tablayout .css_td b {
            color: #FF3300;
            display: none;
            .display:inline;
        }

        .inputbox #css_table_tablayout .css_td a.link {
            color: #ff8a00;
        }

        .inputbox #css_table_tablayout .css_td .tabbtn a {
            background-color: #333;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 90%;
            padding: 5px 15px;
            border-radius: 5px;
        }

        .inputbox #css_table_tablayout .css_td .tabbtn:hover {
            background: #00b5ca;
        }

        .inputbox #css_table_tablayout .css_td a img {
            vertical-align: middle;
            border: 0;
        }

        .inputbox #css_table_tablayout .css_tr .css_td.none {
            display: none;
        }

        .inputbox #css_table_tablayout .css_td .tabbtn_on a {
            background-color: #F60;
            border-style: none;
            border: 1px solid #999;
            text-decoration: none;
            font-weight: bold;
            color: #FFF;
            font-size: 90%;
            padding: 5px 15px;
            border-radius: 5px;
        }


    /*船艙*/
    .inputbox3 {
        margin-top: 30px;
    }

        .inputbox3 #css_table_tablayout {
            display: table;
            width: 100%;
            letter-spacing: normal;
        }

            .inputbox3 #css_table_tablayout .css_tr {
                display: table-row;
                width: 100%;
                .border-bottom:#188fa7 2px solid;
                .display: inline-block;
            }

                .inputbox3 #css_table_tablayout .css_tr:nth-child(odd) {
                    background-color: transparent;
                    .display: inline-block;
                }

                .inputbox3 #css_table_tablayout .css_tr:first-child {
                    font-weight: bold;
                    background-color: #a7e2e9;
                    color: #333;
                    _display: none;
                    .display: none;
                }

                    .inputbox3 #css_table_tablayout .css_tr:first-child a {
                        text-decoration: none;
                        color: #333;
                    }

                        .inputbox3 #css_table_tablayout .css_tr:first-child a:hover {
                            text-decoration: none;
                            color: #188fa7;
                        }

            .inputbox3 #css_table_tablayout .css_td {
                display: table-cell;
                padding: 10px 0px;
                min-width: 50px;
                .display: block;
                border-bottom: #95afb9 1px solid;
                text-align: center;
                line-height: 130%;
                font-size: 14px;
                vertical-align: middle;
            }

            .inputbox3 #css_table_tablayout .line {
                color: #333;
                padding: 3px 0px;
            }

            .inputbox3 #css_table_tablayout .css_tr .css_td h1 {
                font-size: 24px;
                color: #000;
                margin: 0px;
            }

            .inputbox3 #css_table_tablayout .title {
                .display: block;
                color: #FFF;
                font-size: 87.5%;
            }

            .inputbox3 #css_table_tablayout .css_td b {
                color: #FF3300;
                display: none;
                .display:inline;
            }

            .inputbox3 #css_table_tablayout .css_td a.link {
                color: #ff8a00;
            }

            .inputbox3 #css_table_tablayout .css_td .tabbtn {
                background-color: #333;
                text-decoration: none;
                font-weight: bold;
                color: #FFF;
                font-size: 70%;
                padding: 5px 15px;
                border-radius: 5px;
            }

                .inputbox3 #css_table_tablayout .css_td .tabbtn:hover {
                    background: #00b5ca;
                }

            .inputbox3 #css_table_tablayout .css_td .peoplenumber select {
                padding: 2px;
                min-width: 100px;
            }

            .inputbox3 #css_table_tablayout .css_td span {
                font-size: 90%;
                color: #333;
                font-weight: normal;
            }

    .buttonbox {
        text-align: center;
        margin: 10px 0;
    }

        .buttonbox .btn {
            color: #FFF;
            border-style: none;
            min-width: 100px;
            height: 36px;
            text-align: center;
            cursor: pointer;
            margin: 2px;
            font-size: 100%;
            border-radius: 5px;
            background-color: #333;
            border: 1px solid #999;
            box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
            -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.1);
        }

            .buttonbox .btn:hover {
                background: #00b5ca;
            }

    /*mapmap*/
    .mapmap_mob {
        display: none;
    }

    .mapmap {
        position: relative;
        width: 100%;
        height: auto;
        margin: 0px 0 20px 0;
        opacity: 1;
        background-color: #FFF;
        font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
        border: 1px solid #eee;
        padding: 0 15px 10px 15px;
    }

        .mapmap .corner_css {
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 20px 20px 0 0;
            border-color: #2984ad transparent transparent transparent;
            margin-left: -15px;
            position: absolute;
        }

        .mapmap .title {
            font-size: 150%;
            color: #2984ad;
            font-family: Arial, Helvetica, "微軟正黑體", sans-serif;
            margin: 10px 0;
        }

            .mapmap .title span {
                font-size: 80%;
                color: #d8d8d8;
                font-weight: normal;
            }

        .mapmap .mapimg {
            position: relative;
        }
            /*.mapmap a{ display:block; background-color:#FC0; opacity:0.5; width:50px; height:50px; position:absolute; top:0; left:0; line-height:50px;text-align:center; border-radius:50px;}*/
            .mapmap .mapimg .point {
                width: 100%;
                height: 100%;
            }

    .point ul {
        list-style: none;
    }

    .point li {
        position: absolute;
        border-radius: 50px;
    }

        .point li a {
            text-decoration: none;
            cursor: pointer;
            z-index: 999;
            display: block;
            background-color: rgba(51,204,204,0);
            opacity: 0.8;
            width: 40px;
            height: 40px;
            line-height: 50px;
            text-align: center;
        }

        .point li span {
            display: block;
            background-color: #000;
            padding: 3px 10px;
            border-radius: 20px;
            font-size: 80%;
            color: #FFF;
            font-weight: bold;
        }

        .point li:hover {
            background-color: rgba(51,204,204,0.6);
        }

    .point .point01 {
        top: 19.4%;
        left: 34.7%;
    }
    /*南竿-北竿*/
    .point .point02 {
        top: 37%;
        left: 34.7%;
    }
    /*北竿-南竿*/

    .point .point03 {
        top: 10.5%;
        left: 54.6%;
    }
    /*南竿-東引*/
    .point .point04 {
        top: 26%;
        left: 42%;
    }
    /*東引-南竿*/

    .point .point05 {
        top: 18.6%;
        left: 83.5%;
    }
    /*東引到基隆*/
    .point .point06 {
        top: 10%;
        left: 75%;
    }
    /*基隆到東引*/

    .point .point07 {
        top: 35.5%;
        left: 51.5%;
    }
    /*基隆到南竿*/
    .point .point08 {
        top: 30%;
        left: 74.7%;
    }
    /*南竿到基隆*/

    .point .point09 {
        top: 71%;
        left: 58%;
    }
    /*南竿到東莒*/
    .point .point10 {
        top: 53%;
        left: 46.5%;
    }
    /*東莒到南竿*/

    .point .point11 {
        top: 82%;
        left: 46%;
    }
    /*南竿到西莒*/
    .point .point12 {
        top: 66%;
        left: 36.4%;
    }
    /*西莒到南竿*/

    /*indexitem*/
    .indexactivity {
        position: relative;
        width: 100%;
        height: auto;
        margin: 0px 0 20px 0;
        background-color: #FFF;
        border: 1px solid #eee;
        padding: 10px;
    }

    .indexbox {
        width: 100%;
        height: auto;
        overflow: hidden;
        margin: 0.5%;
    }

        .indexbox #MADdpzone3 {
            display: none;
        }

    .indexitem {
        overflow: hidden;
        float: left;
        margin: 1%;
        background-color: #eee;
    }
}
/** {	margin: 0px; padding: 0px;}*/
html {
    background: rgb(255, 255, 255);
}

.bannerbox.wrapper1 {
    width: 100%;
    margin-bottom: 0px;
    float: left;
}
/*h1 {font: 600 28px/36px sans-serif; margin: 50px 0px; font-size-adjust: none; font-stretch: normal;}
h3 {font: 600 18px/24px sans-serif; margin: 0px 0px 20px; color: rgb(153, 153, 153); font-size-adjust: none; font-stretch: normal;}
a {	color: rgb(34, 34, 34);}*/
.rslides {
    margin: 0px auto;
}

.rslides {
    list-style: none;
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: auto;
    max-height: auto;
    overflow: hidden;
}

    .rslides li {
        left: 0px;
        top: 0px;
        width: 100%;
        display: none;
        position: absolute;
        -webkit-backface-visibility: hidden;
        position: relative;
    }

        .rslides li:first-child {
            float: left;
            display: block;
        }

    .rslides img {
        border: 0px currentColor;
        border-image: none;
        width: 100%;
        height: 50%;
        float: left;
        display: block;
    }

.rslides_container {
    width: 100%;
    margin-bottom: 0px;
    float: left;
    position: relative;
    text-indent: 0px;
    -webkit-box-sizing: border-box;
}

.bannerbox {
    width: 1280px;
    max-height: 500px;
    height: 500px;
    overflow: hidden;
    position: relative;
}

.wrapper1,
.rslides_container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.rslides {
    width: 100%;
    height: 100%;
    position: relative;
}

    .rslides li {
        width: 100%;
        height: 100%;
        position: absolute;
    }

        .rslides li:first-child {
            position: relative;
        }

    .rslides img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover;
        object-position: center;
        display: block;
    }

@media screen and (max-width: 767px) {
    .bannerbox {
        max-height: 200px;
        height: 200px;
    }
}

@media screen and (min-width: 768px) and (max-width: 1224px) {
    .bannerbox {
        max-height: 300px;
        height: 300px;
    }
}


.mesk {
    display: none;
    -webkit-box-sizing: border-box;
    width: 100%;
    height: auto;
    background-color: rgba(0,0,0,0.5);
    position: absolute;
    bottom: 0px;
    left: 0;
}

    .mesk .box {
        width: 98%;
        color: #FFF;
        text-align: left;
        padding: 10px;
        top: 0px;
        padding-bottom: 18px;
        padding-top: 5px;
        text-align: justify;
    }


/*slider1點點設定*/
.centered-btns_nav {
    background: url("../frontimages/ADVbtn.png") no-repeat left top;
    left: 0px;
    top: 50%;
    width: 38px;
    height: 61px;
    text-indent: -9999px;
    overflow: hidden;
    text-decoration: none;
    margin-top: -30px;
    position: absolute;
    z-index: 3;
    opacity: 0.6;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

    .centered-btns_nav:active {
        opacity: 1;
    }

.next.centered-btns_nav {
    background-position: right top;
    left: auto;
    right: 0px;
}

.centered-btns_nav:focus {
}

.centered-btns_tabs {
    text-align: center;
    margin-top: 10px;
    position: absolute;
    bottom: 0px;
    z-index: 20;
    left: 0;
    right: 0;
    padding-bottom: 10px; /*小圓點位置*/
}

    .centered-btns_tabs li {
        margin-right: 5px;
        float: none;
        display: inline;
        _float: left;
    }

    .centered-btns_tabs a {
        background: rgba(255,255,255,0.2);
        border-radius: 15px;
        width: 10px;
        height: 10px;
        text-indent: -9999px;
        overflow: hidden;
        display: inline-block;
        box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.3);
        -webkit-border-radius: 15px;
        -moz-border-radius: 15px;
        _display: block;
        -webkit-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .3);
        -moz-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .3);
    }

.centered-btns_here a { /*background: rgba(0,117,194,0.9);*/
    background: rgba(255,102,0,0.5) /*小圓點顏色*/
}


/*slider2點點設定*/
.transparent-btns_nav {
    background: rgb(255, 255, 255);
    left: 0px;
    top: 0px;
    width: 48%;
    height: 91%;
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    position: absolute;
    z-index: 3;
    opacity: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.next.transparent-btns_nav {
    left: auto;
    right: 0px;
}

.transparent-btns_nav:focus {
}

.transparent-btns_tabs {
    text-align: center;
    margin-top: 10px;
    position: absolute;
    bottom: 0px;
    z-index: 20;
    left: 0;
    right: 0;
    padding-bottom: 10px; /*小圓點位置*/
}

    .transparent-btns_tabs li {
        margin-right: 5px;
        float: none;
        display: inline;
        _float: left;
    }

    .transparent-btns_tabs a {
        background: rgba(0, 0, 0, 0.2);
        border-radius: 15px;
        width: 9px;
        height: 9px;
        text-indent: -9999px;
        overflow: hidden;
        display: inline-block;
        box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.3);
        -webkit-border-radius: 15px;
        -moz-border-radius: 15px;
        _display: block;
        -webkit-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .3);
        -moz-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .3);
    }

.transparent-btns_here a {
    background: rgba(0, 0, 0, 0.8);
}


/*slider3點點設定*/
.large-btns_nav {
    background: url("../frontimages/ADVbtn.png") no-repeat left 50% rgb(0, 0, 0);
    left: 0px;
    top: 0px;
    width: 38px;
    bottom: 0px;
    text-indent: -9999px;
    overflow: hidden;
    position: absolute;
    z-index: 3;
    opacity: 0.6;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

    .large-btns_nav:active {
        opacity: 1;
    }

.next.large-btns_nav {
    background-position: right 50%;
    left: auto;
    right: 0px;
}

.large-btns_nav:focus {
}

.large-btns_tabs {
    text-align: center;
    margin-top: 10px;
    position: absolute;
    bottom: 0px;
    z-index: 20;
    left: 0;
    right: 0;
    padding-bottom: 10px; /*小圓點位置*/
}

    .large-btns_tabs li {
        margin-right: 5px;
        float: none;
        display: inline;
        _float: left;
    }

    .large-btns_tabs a {
        background: rgba(0, 0, 0, 0.2);
        border-radius: 15px;
        width: 9px;
        height: 9px;
        text-indent: -9999px;
        overflow: hidden;
        display: inline-block;
        box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.3);
        -webkit-border-radius: 15px;
        -moz-border-radius: 15px;
        _display: block;
        -webkit-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .3);
        -moz-box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, .3);
    }

.large-btns_here a {
    background: rgba(0, 0, 0, 0.8);
}
/*==============================手機版型區==============================*/
@media screen and (max-width: 767px) {
    .bannerbox {
        font: 14px/24px sans-serif;
        margin: 0px auto;
        text-align: center;
        color: rgb(51, 51, 51);
        max-width: 100%;
        max-height: 400px;
        overflow: hidden;
        font-size-adjust: none;
        font-stretch: normal;
        _width: 1280px;
        -webkit-font-smoothing: antialiased;
        position: relative;
    }

    .rslides_container {
        width: 100%;
        margin-bottom: 0px;
        float: left;
        position: relative;
        text-indent: 0px;
        -webkit-box-sizing: border-box;
    }

    .centered-btns_nav {
        opacity: 0; /*左右按鍵隱藏*/
    }

    .centered-btns_tabs, .transparent-btns_tabs, .large-btns_tabs {
        text-align: center;
        margin-top: 0px;
        position: absolute;
        bottom: 0px;
        z-index: 20;
        left: 0;
        right: 0;
        padding-bottom: 5px; /*小圓點位置*/
    }
}