﻿@import url(/bootstrap/css/bootstrap-responsive.min.css);
@import url(/bootstrap/css/bootstrap-modal.css);
@import url(/bootstrap/css/bootstrap-main.css);

body {
    transition: padding 0.5s ease-out;
    background-position: top;
    font-family: Arial, Helvetica, sans-serif,微軟正黑體,新細明體;
}

    body.showToolbar {
        padding-bottom: 30px;
    }

    body.lock {
        overflow: hidden;
    }

    body.hideCont {
        background-color: rgba(213,213,213,0.7);
    }

        body.hideCont #wrap {
            filter: blur(10px);
        }
/*連結*/
a:hover {
    text-decoration: none;
}

a:focus {
    outline: #000 dashed 1px !important;
    text-decoration: none;
    outline-offset: 3px;
}

a[href="javaScript:void(0)"], a[href="javascript:void(0)"] {cursor: default}
a#topPointer {opacity: 0;}
/*form*/
input, button, select, textarea {
    font-family: Arial, Helvetica, sans-serif, 微軟正黑體, 新細明體;
}
/*樣板*/
#wrap {
    z-index: auto;
    text-align: center;
    text-align: -webkit-center;
}
.verticalAlignMiddle:before {
    content: "";
    width: 0;
    height: 100%;
    display: inline-block;
    vertical-align: middle;
}

.pointer {
    cursor: pointer;
}

.paddingEmpty {
    padding: 0 !important;
}

.marginEmpty {
    margin: 0 !important;
}

#pageLoad {
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    text-align: center;
    padding-top: 30vh;
    width: 100vw;
    height: 100vh;
    z-index: 1032;
    background: rgba(0,0,0,0.2);
}

#languageBar {
    position: relative;
}

    #languageBar .meb_log {
        overflow: hidden;
        display: block;
        float: left;
    }

#toolbar {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 0;
    overflow: hidden;
    font-size: 1.2rem;
    color: #FFF;
    padding: 4px;
    margin-bottom: -16px;
    text-shadow: 3px 3px 1rem rgba(0,0,0,0.6);
}

    #toolbar.show {
        height: 30px;
        margin-bottom: 0;
    }

    #toolbar > div {
        float: right;
        margin: 0 0.8rem;
        transform: rotate(90deg);
    }

        #toolbar > div:active {
            transform: scale(1.1,1.1) rotate(90deg);
        }

.navbar .btn-navbar > .icon-chevron-down {
    display: none;
}

.navbar .btn-navbar.collapsed > .icon-remove {
    display: none;
}

.navbar .btn-navbar.collapsed > .icon-chevron-down {
    display: block;
}

.hellow {
    width: auto;
    overflow: hidden;
    display: inline-flex;
    white-space: nowrap;
    -webkit-animation: showName 2s; /* Safari 和 Chrome */
    -moz-animation: showName 2s; /* Firefox */
    -o-animation: showName 2s; /* Opera */
    animation: showName 2s;
}

.displayN, .hide {
    opacity: 0;
    pointer-events: none;
}

.click:active {
    margin: 3px -3px 0 0;
    cursor: pointer;
}

.focus {
    box-shadow: 0 0 2px #0CC;
}

.load {
    position: relative;
    font: normal normal normal 14px/1 FontAwesome;
    text-align: center
}

    .load > * {
        opacity: 0;
    }

    .load:before {
        content: "\f110";
        font-size: 5rem;
        animation: fa-spin 1s infinite steps(8);
        opacity: 1;
        position: absolute;
        left:0;
        right:0;
        text-align:center;
        margin:1rem 0;
    }
#aumenu ul.nav > li > a > img + span {font-size: 0; line-height:0; display:block;}
/*頁碼*/
.pagination > ul > .empty > span {border-top: 0; border-bottom: 0;}
/*Logo*/
#logo {
    float: left;
    display: block;
    margin: auto;
    font-size: 0;
    line-height: 0;
}

    #logo.hd1, #logo.hd3 {
        float: none;
        display: inline-block;
    }

    #logo.hd3 {
        float: inherit;
        display: inline
    }

#logo_link {
    font-size: 0;
    line-height: 0;
    overflow: hidden;
    display: inline-block;
}

#left_menu .collapse {
    min-height: 1px;
}
/*彈跳視窗預設*/
#window {
    color: #666;
}

    #window a {
        color: inherit;
    }

    #window .menu_title {
        color: #333;
    }

    #window .imgCont {
        font-size: 1.33rem;
        line-height: initial;
        height: 85px;
    }

    #window.showTag {
        width: 800px;
        margin: 1vh -400px 0;
    }

    #window .tagList {
        text-align: center;
    }

        #window .tagList > li {
            margin: 1% 0.4%;
            border: #ccc solid 1px;
            border-radius: 2px;
            text-align: center;
        }

            #window .tagList > li:hover > a {
                color: #fff;
            }
/*影片播放*/
.mediaItem {
    padding: 10px;
    margin-top: -1px;
    display: inline-block;
}

    .mediaItem.vidio {
        border-bottom: #CCCCCC dashed 1px;
    }

.contItem .mediaItem {
    border: none;
    padding: 0;
    position: relative;
}

    .contItem .mediaItem.showPlay:after {
        position: absolute;
        content: "";
        background-image: url(/images/icon/play.png);
        background-size: cover;
        display: inline-block;
        width: 100px;
        height: 70px;
        margin: auto;
        left: 0;
        right: 0;
        top: calc(50% - 35px);
        pointer-events: none;
    }

.mediaItem:hover {
    background-color: #E5E5E5;
    cursor: pointer;
}

.windowMedia {
    width: 70%;
    left: 15%;
    margin-left: 0;
    color: #ffffff;
}

#runMedia {
    width: 100%;
    height: 100%;
}

.windowMedia .modal-body {
    overflow: visible;
    padding: 0px;
}

.windowMedia, .windowMedia .modal-footer {
    background-color: #000000;
}

.close, .close:hover {
    color: #FFFFFF;
    opacity: .6;
}

    .close:hover {
        opacity: .8;
    }

a.row-fluid.mediaItem {
    width: 100% !important;
}

.mediaItem:hover:hover {
    background-color: rgba(255,255,255,0.5);
}

/*跑馬燈*/
#hd_marquee { overflow:hidden;}
.horizontal_scroller.marquee {width:auto; border:none; background-color:transparent;}

/*物件*/
#cont > .row-fluid.contItem {
    min-height: 0px;
    margin-bottom: 0px;
}

    #cont > .row-fluid.contItem > .span12 > .row-fluid {
        margin-bottom: 10px;
    }

    #cont > .row-fluid.contItem > .span12 {
        min-height: 0px;
    }

.contItem.row-fluid [class*="span"], #cont div {
    min-height: 5px;
}

.contItem [class*="pull"] {
    max-width: 100%;
    padding: 0 10px;
    padding-bottom: 10px;
}

.contItem .pull-left {
    padding-left: 0;
}

.contItem .pull-right {
    padding-right: 0;
}

.contItem .pull-center {
    padding: 0;
}

.contItem .gmap:not([class*="span"]), .contItem .gmap > iframe {
    width: 100%;
    min-height: 300px;
}

.contItem .row-fluid > .span12 > [class*="span"] {
    margin: 0;
}

.contItem .row-fluid > .span12 > a {
    font-size: 1rem;
}

    .contItem .row-fluid > .span12 > a > h3, .contItem .row-fluid > .span12 > a > .title {
        display: inline-block;
        margin-left: 5px;
        font-size: 1rem;
        max-width: calc(100% - 25px);
        vertical-align: middle;
        line-height: 1.5rem;
    }

.contItem .accordion-body {
    padding: 0 10px;
}
.contItem > * {
    transition: opacity 0.5s;
}
.contItem.load:before{
    opacity:0.2;
}
#moduleCont .contItem.load {
    min-height:8rem;
}
[class*="cockerObject-col-"] .contItem > .span12,
[class*="cockerObject-col-"].contItem > .span12 {
    font-size:0;
}

[class*="cockerObject-col-"] .contItem > .span12 > .row-fluid,
[class*="cockerObject-col-"].contItem > .span12 > .row-fluid {
    vertical-align: top;
    margin: 0.5%;
    font-size:1rem;
}

.cockerObject-col-1 .contItem > .span12 > .row-fluid,
.cockerObject-col-1.contItem > .span12 > .row-fluid {
    margin: 0%
}

.cockerObject-col-2 .contItem > .span12 > .row-fluid,
.cockerObject-col-2.contItem > .span12 > .row-fluid {
    display: inline-block;
    width: 49.5%;
}

.cockerObject-col-3 .contItem > .span12 > .row-fluid,
.cockerObject-col-3.contItem > .span12 > .row-fluid {
    display: inline-block;
    width: 32.66%;
}

.cockerObject-col-4 .contItem > .span12 > .row-fluid,
.cockerObject-col-4.contItem > .span12 > .row-fluid {
    display: inline-block;
    width: 24.25%;
}

.cockerObject-col-6 .contItem > .span12 > .row-fluid,
.cockerObject-col-6.contItem > .span12 > .row-fluid {
    display: inline-block;
    width: 15.83%;
}

    .cockerObject-col-2 .contItem > .span12 > .row-fluid:nth-child(2n+1),
    .cockerObject-col-2.contItem > .span12 > .row-fluid:nth-child(2n+1),
    .cockerObject-col-3 .contItem > .span12 > .row-fluid:nth-child(3n+1),
    .cockerObject-col-3.contItem > .span12 > .row-fluid:nth-child(3n+1),
    .cockerObject-col-4 .contItem > .span12 > .row-fluid:nth-child(4n+1),
    .cockerObject-col-4.contItem > .span12 > .row-fluid:nth-child(4n+1),
    .cockerObject-col-6 .contItem > .span12 > .row-fluid:nth-child(6n+1),
    .cockerObject-col-6.contItem > .span12 > .row-fluid:nth-child(6n+1) {
        margin-left: 0;
    }

    .cockerObject-col-2 .contItem > .span12 > .row-fluid:nth-child(2n+2),
    .cockerObject-col-2.contItem > .span12 > .row-fluid:nth-child(2n+2),
    .cockerObject-col-3 .contItem > .span12 > .row-fluid:nth-child(3n+3),
    .cockerObject-col-3.contItem > .span12 > .row-fluid:nth-child(3n+3),
    .cockerObject-col-4 .contItem > .span12 > .row-fluid:nth-child(4n+4),
    .cockerObject-col-4.contItem > .span12 > .row-fluid:nth-child(4n+4),
    .cockerObject-col-6 .contItem > .span12 > .row-fluid:nth-child(6n+6),
    .cockerObject-col-6.contItem > .span12 > .row-fluid:nth-child(6n+6) {
        margin-right: 0;
    }

.tagList {
    list-style: none;
    margin: auto;
    text-align: center;
    margin-bottom: 0.5rem;
}

    .tagList > li {
        display: inline-block;
        border: #ccc solid 1px;
    }

        .tagList > li > a {
            padding: 0.5rem 1rem;
            display: block;
        }

        .tagList > li:not(:first-child) {
            border-left: 0;
        }

        .tagList > li:first-child {
            border-radius: 5px 0 0 5px;
        }

        .tagList > li:last-child {
            border-radius: 0 5px 5px 0;
        }

        .tagList > li:hover {
            background-color: #aaa;
        }

            .tagList > li:hover > a {
                color: #fff;
            }

#cont > .showTagC {
    width: 100%;
    padding: 8px 0;
    margin: 0.5rem auto;
    font-weight: bold;
    font-size: 1rem;
}

/*廣告*/
#AD {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 1031;
}

    #AD > .bg {
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        background: rgba(0,0,0,0.7);
        width: 100vw;
        height: 100vh;
    }

    #AD > .container {
        position: relative;
        background-color: #FFF;
        height: 96vh;
        margin-top: 2vh;
    }

        #AD > .container > .close {
            position: absolute;
            top: 10px;
            right: 10px;
            color: #aaa;
            background-color: #eee;
            opacity: 1;
            font-size: 2.25rem;
            border-radius: 50%;
            width: 40px;
            height: 40px
        }

            #AD > .container > .close > .fa {
                line-height: 37px;
            }

            #AD > .container > .close:hover, #AD > .container > .close:active {
                color: #666;
                background-color: #aaa;
                border: none;
            }

        #AD > .container > .contItem {
            overflow: auto;
            width: 100%;
            height: 100%;
        }

            #AD > .container > .contItem > .span12 {
                padding: 10px 5px;
            }

            #AD > .container > .contItem .title {
                padding: 0 0 10px;
            }
/*主選單*/
#aumenu {
    margin-top: 0px;
}

    #aumenu > ul {
        background-image: inherit;
        width: inherit;
    }

        #aumenu > ul > li {
            text-align: center;
        }

            #aumenu > ul > li > ul > li > a {
                text-align: left;
            }

    #aumenu ul li > a:focus {
        background: transparent;
    }
/*會員登入*/
#memberAdd, #memberForget, .navbar-wrapper .btn {
    color: #333;
    font-size: 0.9rem;
}
/*搜尋*/
#lan_serch .input-append{display: flex;}
#lan_serch input[name=text]:focus {outline: #333333 solid 0.2rem;}
.serchBox input[name=text] {max-width: 100%; width: 13em; font-size: 1em; line-height:1.5em; height:1.5em;}
.search-input {display: inline-block;max-width: 70%;font-size: 1rem; vertical-align: middle;}
#lan_serch .btn-group>button.btn { height: 100%;}
#left .serchBox .input-append {
    display: flex;
    align-items: flex-start;
}

/*自訂搜尋*/
#custSearch {
    text-align: center;
    margin: 1rem auto;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1170px;
}
    #custSearch input[name="searchText"]:focus {
        outline: #66E solid 3px;
    }
    #custSearch a:focus {
        outline: #0e2330 solid 3px !important;
    }

    #custSearch > label {
        color: #1e709e;
        font-weight: 700;
        font-size: 1.5rem;
        width: 8rem;
    }

    #custSearch .btn-group {
        font-size: 1rem;
        border-right: #666 solid 2px;
        padding: 0.15rem 1rem;
        margin: 0.4rem 0;
    }

        #custSearch .btn-group:before {
            content: "";
            width: 0;
            height: 100%;
            display: inline-block;
            vertical-align: middle;
        }

        #custSearch .btn-group > .title {
            font-weight: 700;
            font-size: 1.2rem;
            display: inline-block;
            vertical-align: middle;
        }

    #custSearch .searchBar {
        display: flex;
        border: #ccc solid 1px;
        margin: 0;
        list-style: none;
    }

    #custSearch input[name="searchText"] {
        width: calc(1170px - 25rem);
        height: calc(100% - 0.9rem);
        padding: 0rem 1rem;
        margin: 0.5rem 0;
        border: none;
        box-shadow: none;
        font-size: 1.3rem;
        vertical-align: top;
    }

    #custSearch .searchButtom {
        font-size: 1.5rem;
        display: inline-block;
        background: #1e709e;
        color: #FFF;
        width: 7rem;
        text-align: center;
        height: 100%;
    }

        #custSearch .searchButtom > * {
            vertical-align: middle;
            padding: 0 5px;
        }

    #custSearch .dropdown-menu {
        border-radius: 0;
    }

        #custSearch .dropdown-menu > li {
            cursor: pointer;
        }

            #custSearch .dropdown-menu > li:hover, #custSearch .dropdown-menu > li:focus {
                background-color: #1e709e;
                color: #FFF;
            }

.searchButtom:active {
    transform: scale(1.01);
}

/*google 關鍵字搜尋*/
.gsc-input {
    font-size: 0.8rem !important;
}
/*版頭區*/
.navbar-inverse .navbar-inner {
    background: transparent;
}

#head button.btn.btn-navbar > span {
    font-size: 0;
    line-height: 0;
    position: absolute;
}

/*頁左區*/
#left_menu > #left_main_menu .accordion-heading > a > div,
#left_fix_menu .accordion-heading > a > div,
#pmenu .dropdown > a > div {
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.5rem;
}
.open_btn > i {
    margin: 5px;
    top: -2px;
    position: relative;
}
.close_btn > i {
    margin-top: 1px;
}
#close_left {
    text-align: right;
}

.close_btn {
    width: 22px;
    height: 22px;
    background: #ccc;
    border-radius: 50%;
    text-align: center;
    position: relative;
    float: right;
    box-shadow: -1px 1px 6px 0px rgba(50,50,50,0.5);
    border: 3px #fff solid;
    top: 0;
    right: 1%;
}

.open_btn {
    background: #ccc;
    box-shadow: -1px 1px 6px 0px rgba(50,50,50,0.5);
    border: 3px #fff solid;
    text-align: center;
    float: left;
    border-radius: 50%;
    opacity: 0.8;
}

.close_left {
    display: none;
    min-height: 60px;
    position: relative;
}

    .close_left > a {
        padding: 15px 3px 15px 15px;
        display: block;
        overflow: hidden;
        float: right;
    }

#left .leftCtrl {
    display: none;
}

/*頁中區*/
#center {
    position: relative;
}

#moduleCont > .span12 {
    opacity: 1;
    transition: opacity ease-in 0.3s;
}

#moduleCont.opacity > .span12 {
    opacity: 0;
    pointer-events: none;
}

#moduleCont > .loader {
    margin: auto;
    background: transparent !important;
    text-align: center;
}

#moduleCont:not(.opacity) > .loader {
    display: none;
}
/*浮動廣告*/
#FloatAD {
    position: fixed;
    max-width: 8rem;
    right: 0;
    top: 18vh;
    display: inline-block;
}

    #FloatAD > .contItem > .span12 > .row-fluid {
        margin-bottom: 1rem;
    }

/*選擇*/
.optionSelect {
    display: none;
}

    .optionSelect + label {
        background-color: #FFF;
        color: #333;
        padding: 0.2rem 0.5rem;
    }

    .optionSelect + label {
        user-select: none;
    }

        .optionSelect + label > * {
            display: inline-block;
            vertical-align: middle;
        }

        .optionSelect + label > .fa-check-square-o {
            display: none;
        }

        .optionSelect + label > .fa {
            width: 1.5rem;
            font-size: 1.3rem;
        }

    .optionSelect:hover + label {
        background-color: #ccc;
    }

    .optionSelect:checked + label {
        background-color: #b6ce25;
        color: #FFF;
        border-radius: 3px;
    }

        .optionSelect:checked + label > .fa-square-o {
            display: inline-block;
        }

        .optionSelect:checked + label > .fa-check-square-o {
            display: inline-block;
        }

        .optionSelect:checked + label > .fa-square-o {
            display: none;
        }

/*評分*/
.score_star, .score_star > span {
    font-family: sans-serif;
}

[class^='star'] {
    position: relative;
}

    [class^='star']:before {
        position: absolute;
        left: 0;
        content: "★";
        overflow: hidden;
    }

.comment {
    margin: 0 0 0.5rem 0;
}

.star0:before {
    width: 0%;
}

.star1:before {
    width: 10%;
}

.star2:before {
    width: 20%;
}

.star3:before {
    width: 30%;
}

.star4:before {
    width: 40%;
}

.star5:before {
    width: 50%;
}

.star6:before {
    width: 60%;
}

.star7:before {
    width: 70%;
}

.star8:before {
    width: 80%;
}

.star9:before {
    width: 90%;
}

/* accesskey */
#topPointer {
    font-size: 0;
    display: block;
    width: 0;
    height: 0;
}
.accesskey {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    color: #000 !important;
}

    .accesskey:focus {
        opacity: 1;
        outline: #000 dashed 1px;
        padding: 0.5rem !important;
        background-color: #FFF;
        z-index: 10000;
    }


/* 分享 */
#titleBlock {
    position: relative;
    min-height: 3rem;
}

#socal_bar {
    top: 0.5rem;
    float: none;
    display: inline-block;
    position: absolute;
}

.showTitlenone > #socal_bar {
    position: relative;
    float: right;
}

#socal_bar > div {
    margin: 0;
}

#social {
    margin: 10px 0;
}

    #social:hover > a {
        opacity: 0.5;
    }

    #social > a, #social > div {
        padding: 7px 0 !important;
        display: inline-block;
        vertical-align: middle !important;
    }

        #social > a > img {
            max-width: 2.5rem;
        }

        #social > a:hover, #social > a:focus {
            transform: scale(1.2);
            opacity: 1
        }

.fb_dialog.fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge.fb_customer_chat_bubble_pop_in {
    bottom: 4.5rem !important;
}
/*優惠券*/
.couponTicketItem {
    display: grid;
    grid-template-columns: 45% 55%;
    grid-column-gap: 0rem;
    width: 40rem;
    max-width: 100%;
    text-align: center;
    margin: auto;
    margin-bottom: 0.5rem;
}

    .couponTicketItem > div {
        padding: 0.5rem 1rem;
        position: relative;
    }

        .couponTicketItem > div:first-child {
            background-color: #d8092c;
            color: #FFF
        }

        .couponTicketItem > div:last-child {
            background-color: #efefef;
            padding-bottom: 3rem;
            text-align: left;
        }

    .couponTicketItem h3 {
        margin: 0;
    }

    .couponTicketItem > div:last-child h3 {
        font-weight: normal;
        font-size: 1.1rem;
        line-height: 1.5rem;
    }

    .couponTicketItem .active {
        border: #FFF dashed 1px;
        padding: 1rem;
        margin-bottom: 0.5rem;
        font-size: 2rem;
    }

        .couponTicketItem .active > span {
            font-size: 3rem;
            font-family: fantasy;
        }

    .couponTicketItem .date {
        font-size: 0.5rem;
    }

    .couponTicketItem .get {
        background-color: #d8092c;
        color: #FFF;
        padding: 0.5rem;
        position: absolute;
        left: 0.5rem;
        right: 0.5rem;
        bottom: 0.5rem;
        text-align: center;
    }

    .couponTicketItem .code {
        color: #d8092c;
        font-weight: bold;
        font-size: 2rem;
    }

    .couponTicketItem:active {
        transform: scale(0.99)
    }

    .couponTicketItem .codeTitle {
        position: relative;
        margin-bottom: 0.5rem;
    }

        .couponTicketItem .codeTitle:after {
            content: "--------------------------------------------------------------------------------------";
            position: absolute;
            display: block;
            height: 1rem;
            overflow: hidden;
            top: 0;
            left: 3.5rem;
        }

    .couponTicketItem .active.isProd {
        max-width: 100%;
    }

        .couponTicketItem .active.isProd > img {
            max-height: 8rem;
        }

    .couponTicketItem .codeTitle.nocode {
        margin-bottom: 1rem;
    }

        .couponTicketItem .codeTitle.nocode:after {
            left: 0;
        }

    .couponTicketItem .code.nocode {
        font-size: 1rem;
    }

    .couponTicketItem .logistics {
        color: #666;
    }

    .couponTicketItem .title {
        color: #333;
    }
/*系統*/
.color-red {
    color: #d8092c;
}
/*列表*/
.list-unstyled {
    padding-left: 0;
    list-style: none;
}
/*視窗*/
#responsive2 {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
}

.modal-header {
    overflow: hidden;
}

/*自定義元件*/
.checkSquare{display:none;}
.checkSquare+ label>.fa.fa-check-square-o{display:none;}
.checkSquare:checked + label>.fa.fa-square-o{display:none;}
.checkSquare:checked + label>.fa.fa-check-square-o{display:inline-block;}

/*商品選擇*/
#window .checkSquare:checked + label{color:#882B03;}
#window #contentText ul{list-style:none; margin:1rem 0; text-align:left;}
#window #contentText ul>li{display:inline-block; width:94%; padding-left:5%;}
#window #contentText ul>li label{font-size:1rem; margin:0; padding:0.25rem 0;}
#window #contentText ul>li label:hover{color: #882B03;}

/* 電腦 */
@media (min-width: 1025px) {
    .displayC {
        display: inline-block !important;
    }
    /*僅在電腦顯示*/
    .displayI {
        display: none !important;
    }
    /*僅在平板顯示*/
    .displayP {
        display: none !important;
    }
    /*僅在手機顯示*/
    .displayNc {
        display: none !important;
    }
    /*在電腦隱藏*/
    .displayNi {
        display: inline-block !important;
    }
    /*在平板隱藏*/
    .displayNp {
        display: inline-block !important;
    }
    /*在手機隱藏*/
    #AD > .container > .contItem .title {
        font-size: 2.25rem;
    }
    #moduleCont > .span12 {
        margin-left: 0;
    }
}

/* 平板 */
@media (min-width: 768px) and (max-width: 1024px) {
    .displayC {
        display: none !important;
    }
    /*僅在電腦顯示*/
    .displayI {
        display: inline-block !important;
    }
    /*僅在平板顯示*/
    .displayP {
        display: none !important;
    }
    /*僅在手機顯示*/
    .displayNc {
        display: inline-block !important;
    }
    /*在電腦隱藏*/
    .displayNi {
        display: none !important;
    }
    /*在平板隱藏*/
    .displayNp {
        display: inline-block !important;
    }
    /*在手機隱藏*/
}

/*手機 */
@media (max-width: 767px) {
    .displayC {
        display: none !important;
    }
    /*僅在電腦顯示*/
    .displayI {
        display: none !important;
    }
    /*僅在平板顯示*/
    .displayP {
        display: inline-block !important;
    }
    /*僅在手機顯示*/
    .displayNc {
        display: inline-block !important;
    }
    /*在電腦隱藏*/
    .displayNi {
        display: inline-block !important;
    }
    /*在平板隱藏*/
    .displayNp {
        display: none !important;
    }
    /*在手機隱藏*/
    #hd_logo {
        max-width: 40vw;
    }

    #languageBar .meb_log {
        position: absolute;
        top: 7px;
        right: 60px;
    }

    #left .leftCont {
        background-color: rgba(238,238,238,0.98) !important;
        width: 285px;
        background-image: inherit !important;
    }
        #left .leftCont > .close_left>a, .leftCtrl>a {
            cursor: pointer;
        }

    .dropdown-menu {
        background: none;
        border: none;
        box-shadow: none;
    }

    #text, .input-append > .btn-group > .btn {
        height: 2.4em;
    }

    .left_menu_li {
        background-color: #f3f3f3;
    }

    #pmenu > ul > li > a {
        padding: 5px;
        font-weight: bold;
        font-size: 1.16rem !important;
        color: #000;
    }

    #main #left {
        position: fixed;
        left: -285px;
        transition: all 1s linear 0s;
        z-index: 1031;
    }

        #main #left.in {
            left: 0%;
            pointer-events: initial;
        }

        #main #left .open_btn {
            opacity: 1;
            transition: opacity 0.3s linear 0s;
        }

        #main #left .close_btn {
            opacity: 0;
            transition: opacity 0.3s linear 0s;
            position: relative;
        }

        #main #left.in .open_btn {
            opacity: 0;
        }

        #main #left.in .close_btn {
            opacity: 1;
            position: fixed;
            left: 250px;
            top: 20px;
            z-index: 1031;
        }

    .openLeftBg {
        display: none;
        width: 200%;
        height: 100%;
        position: fixed;
        background-color: rgba(0,0,0,0.8);
    }

    #main #left.in .openLeftBg {
        display: block;
        z-index: -1;
    }
    
    #head button.btn.btn-navbar, #head .meb_log {
        top: 10px;
    }

    .nav-tabs .dropdown-menu {
        border-radius: 0px !important;
    }

    #pmenu .dropdown-menu > li {
        border-bottom: 1px solid #a9a5a5;
    }

    #left .serchBox ul.dropdown-menu {
        min-width: inherit;
        text-align: center;
        z-index: 1001;
        position: relative;
        width: 79vw;
        left: -54vw;
        display: block;
        height: 0;
        padding: 0;
        overflow: hidden;
        -webkit-animation: hideHeight 0.3s; /* Safari 和 Chrome */
        -moz-animation: hideHeight 0.3s; /* Firefox */
        -o-animation: hideHeight 0.3s; /* Opera */
        animation: hideHeight 0.3s;
    }

    #left .serchBox .open > .dropdown-menu {
        height: auto;
        -webkit-animation: autoHeight 0.3s; /* Safari 和 Chrome */
        -moz-animation: autoHeight 0.3s; /* Firefox */
        -o-animation: autoHeight 0.3s; /* Opera */
        animation: autoHeight 0.3s;
    }
}

@media (min-width: 768px) {
    .nav-justified > li {
        float: none;
        display: table-cell;
        width: 1%;
    }
}

@media (max-width: 1200px) {
    .windowMedia {
        width: 90%;
        left: 5%;
    }
}
@media(max-width: 1170px) {
    #custSearch {
        width: 85%;
    }

        #custSearch input[name="searchText"] {
            width: calc(100vw - 35rem);
        }
}
@media (max-width: 979px) {
    /*#headBox>#head {max-height: 65px !important;}*/
    #main {
        position: initial !important;
    }
    /*#head .navbar-inner { max-width: 115px;}*/
    #left .leftCtrl {
        display: block;
        margin-top: 0px;
        background-repeat: no-repeat;
        cursor: pointer;
        float: left;
        position: absolute;
        top: 0px;
        right: -45px;
        pointer-events: initial;
    }

        #left .leftCtrl > a, .close_left > a {
            position:relative;
            top: 15px;
            display: inline-block;
        }

    .leftCont {
        display: none;
        float: left;
    }

    #aumenu > ul > li > a {
        background-image: none !important;
    }

    #aumenu > ul > li > ul {
        background-image: none !important;
        margin: 0px;
        background-color: #fff;
    }

    #FloatAD {
        margin: 0 !important;
        max-width: 18vw;
    }
    #custSearch {
        width: 100%;
    }

        #custSearch input[name="searchText"] {
            width: calc(100vw - 25rem);
        }
}
@media(max-width: 823px) {
    #custSearch {
        width: 100%;
    }
        #custSearch input[name="searchText"] {
            width: calc(100vw - 30rem);
        }
}
@media (max-width: 767px) {
    .windowMedia {
        width: 96%;
        left: 2%;
    }
    #custSearch > label {
        display: none;
    }

    #custSearch input[name="searchText"] {
        width: calc(100vw - 18rem);
    }
}

@media (max-width: 500px) {
    #socal_bar {
        position: static;
        display: block;
        width: 100%;
    }

    .cockerObject-col-4 .contItem > .span12 > .row-fluid,
    .cockerObject-col-4.contItem > .span12 > .row-fluid {
        width: 49.5%;
    }

    .cockerObject-col-6 .contItem > .span12 > .row-fluid,
    .cockerObject-col-6.contItem > .span12 > .row-fluid {
        width: 32.66%;
    }

        .cockerObject-col-4 .contItem > .span12 > .row-fluid:nth-child(2n+1),
        .cockerObject-col-4.contItem > .span12 > .row-fluid:nth-child(2n+1),
        .cockerObject-col-6 .contItem > .span12 > .row-fluid:nth-child(3n+1),
        .cockerObject-col-6.contItem > .span12 > .row-fluid:nth-child(3n+1) {
            margin-left: 0;
        }

        .cockerObject-col-4 .contItem > .span12 > .row-fluid:nth-child(2n+2),
        .cockerObject-col-4.contItem > .span12 > .row-fluid:nth-child(2n+2),
        .cockerObject-col-6 .contItem > .span12 > .row-fluid:nth-child(3n+3),
        .cockerObject-col-6.contItem > .span12 > .row-fluid:nth-child(3n+3) {
            margin-right: 0;
        }

    .contItem [class*="pull"] {
        padding: 5px;
    }

    .contItem .pull-left {
        padding-left: 0;
    }

    .contItem .pull-right {
        padding-right: 0;
    }

    .contItem .pull-center {
        padding: 0;
    }

    .contItem .mediaItem.showPlay:after {
        width: 50px;
        height: 35px;
        top: calc(50% - 17.5px)
    }

    .fb_dialog.fb_dialog_mobile.fb_customer_chat_bubble_animated_no_badge.fb_customer_chat_bubble_pop_in {
        bottom: 4.5rem !important;
    }

    #window #contentText ul > li label{padding:0.5rem 0;}
}
@media (max-width: 480px) {
    #custSearch {
        width: 100%;
    }
        #custSearch .btn-group {
            padding: 0.25rem;
            margin: 0;
            border-right: #666 solid 0.4px;
        }

            #custSearch .btn-group > .title {
                font-size: 0.8rem;
            }

        #custSearch .searchButtom {
            font-size: 0.8rem;
            width: 4rem;
        }

        #custSearch input[name="searchText"] {
            width: calc(100vw - 11rem);
            padding: 0 0.2rem;
            font-size: 0.8rem;
        }
}
@media (max-width: 350px) {
    .tagList > li > a {
        padding: 0.5rem;
    }
}
/*動畫特效*/
@keyframes showName {
    0% {
        max-width: 0;
        opacity: 0;
    }

    95% {
        max-width: 200px;
        opacity: 0.95;
    }

    100% {
        max-width: inherit;
        opacity: 1;
    }
}

@keyframes autoHeight {
    0% {
        height: 0;
    }

    99% {
        height: 150px;
    }

    100% {
        height: auto;
    }
}

@keyframes hideHeight {
    0% {
        height: 150px;
    }

    100% {
        height: 0;
    }
}