/* 加載csshover3.htc，解決IE6沒有li:hover擬類的問題 */
* html body {
    behavior:url("csshover3.htc");
    height: calc(100% - 65px);;
}

/* 全站所有元素使用 Noto Sans TC */
html, body, *:not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not([class*="fa-"]) {
    font-family: 'Noto Sans TC', sans-serif !important;
  }

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

a {
    text-decoration:none;
}

.hide-store-note{
    display: none;
}

/* */
#infoIcon {
  background-color: #060E9F;
  color: #fff;
  border-radius: 50%;
  width: 5vmin;
  height: 5vmin;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 4vmin;
  vertical-align: middle;
}

#app_station_hint {
    width: 100%;
    position: absolute;
    z-index: 20;
    top: 0;
    padding-top: 10vmin;
    text-align: center;
    background: rgba(0, 0, 0, 0.5);
    height: 100%;
    display: none;
}

#app_station_hint img{
    width:95%;
    border-radius: 3vmin;
}

/* 自動避開狀態列/瀏海 */
.safe-top {
  margin-top: env(safe-area-inset-top);
}

/* 自動避開底部操作列 */
.safe-bottom {
  margin-bottom: env(safe-area-inset-bottom);
}


/**新北幣露出開關*/
.ntp_link{
    /* display: none; */
}

#title {
    font-family: 'NotoSansCJKtc-Medium';
}


#footer {
    font-family: 'NotoSansCJKtc-Medium';
}


#footer_button span{
    font-family: 'NotoSansCJKtc-DemiLight';
}

#view {
    z-index: 2;
}

#view span {
    font-family: 'NotoSansCJKtc-DemiLight';
}

#left_box span{
    font-family: 'NotoSansCJKtc-DemiLight';
}

#ARCADECLASSIC span{
    font-family: 'ARCADECLASSIC';
}

#master2_header{
    position: fixed; top:0; text-align: center; background-color: #FFC800; height: 50px; width: 100%; z-index: 10; transform: translate3d(0,0,0)
}

#master2_header2{
    position: fixed; top:0; width: 100%; height: 50px; z-index: 99; transform: translate3d(0,0,0)
}

#left_box{
    height: 100%;
    width: 100%; 
    position: fixed; 
    left: 0; 
    z-index: 15; 
    display: none;
}

#left_box span{
    color:#ffffff;
    font-size:5vmin;
    vertical-align: middle;
}
#main li {
    margin-top:50px;
}
#main img{
    margin:0px 15%;
}

.width10{
    width:8%;
}

.width20{
    width:20%;
}

.width25{
    width:25%;
}

.width30{
    width:28%;
}

.width33{
    width:32%;
}

.width35{
    width:38%;
}

.width40{
    width:40%;
}
.width60{
    width:60%;
}

.width49{
    width:49%;
}

.width80{
    width:80%;
}

.width83{
    width:83%;
}

.width89{
    width:89%;
}

.width92{
    width:92%;
}

.width9{
    width:9%;
}
.width15{
    width:15%;
}
.width18{
    width:18%;
}


.inlinebox{
    display:inline-block;
}

.center{
    text-align:center;
}

.right{
    text-align:right;
}

.view_list {
    padding:20px;
    border-bottom:1px solid #D4D5D7;
}

.view_list span {
    font-size:4.5vmin;
}

.view_list input {
    background-color:#ffffff;
    text-align:right;
    border: 0px;
    width:100%;
    font-size: 4.5vmin;
    font-family: 'NotoSansCJKtc-DemiLight';
}

.view_list select {
    background-color:#ffffff;
    text-align:right;
    direction: rtl;
    border: 0px;
    width:100%;
    font-size: 4.5vmin;
    font-family: 'NotoSansCJKtc-DemiLight';
}

.view_list textarea {
    border: 0px;
    width:100%;
    font-size: 4.5vmin;
    font-family: 'NotoSansCJKtc-DemiLight';
}

.divnone{
    display:none;
}


.menu_span span{
    color:#ffffff;
}

.menu_span span{
    font-family: 'NotoSansCJKtc-DemiLight';
}

#main img{
    width:28px;
    vertical-align:middle;
}

.HelveticaNeueLTStd-Bd{
    /*font-family: 'HelveticaNeueLTStd-Bd' !important;*/
}

.HelveticaNeueLTStd-Lt{
    /*font-family: 'HelveticaNeueLTStd-Lt' !important;*/
}

.sk-circle {

            margin: 100px auto;
            width: 40px;
            height: 40px;
            position: fixed;
            top: 50%; /*從上面開始算，下推 50% (一半) 的位置*/
            left: 50%; /*從左邊開始算，右推 50% (一半) 的位置*/
            margin-top: -20px; /*高度的一半*/
            margin-left: -20px; /*寬度的一半*/
            z-index:10;
        }

            .sk-circle .sk-child {
                width: 100%;
                height: 100%;
                position: absolute;
                left: 0;
                top: 0;
            }

                .sk-circle .sk-child:before {
                    content: '';
                    display: block;
                    margin: 0 auto;
                    width: 15%;
                    height: 15%;
                    background-color: #333;
                    border-radius: 100%;
                    -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
                    animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
                }

            .sk-circle .sk-circle2 {
                -webkit-transform: rotate(30deg);
                -ms-transform: rotate(30deg);
                transform: rotate(30deg);
            }

            .sk-circle .sk-circle3 {
                -webkit-transform: rotate(60deg);
                -ms-transform: rotate(60deg);
                transform: rotate(60deg);
            }

            .sk-circle .sk-circle4 {
                -webkit-transform: rotate(90deg);
                -ms-transform: rotate(90deg);
                transform: rotate(90deg);
            }

            .sk-circle .sk-circle5 {
                -webkit-transform: rotate(120deg);
                -ms-transform: rotate(120deg);
                transform: rotate(120deg);
            }

            .sk-circle .sk-circle6 {
                -webkit-transform: rotate(150deg);
                -ms-transform: rotate(150deg);
                transform: rotate(150deg);
            }

            .sk-circle .sk-circle7 {
                -webkit-transform: rotate(180deg);
                -ms-transform: rotate(180deg);
                transform: rotate(180deg);
            }

            .sk-circle .sk-circle8 {
                -webkit-transform: rotate(210deg);
                -ms-transform: rotate(210deg);
                transform: rotate(210deg);
            }

            .sk-circle .sk-circle9 {
                -webkit-transform: rotate(240deg);
                -ms-transform: rotate(240deg);
                transform: rotate(240deg);
            }

            .sk-circle .sk-circle10 {
                -webkit-transform: rotate(270deg);
                -ms-transform: rotate(270deg);
                transform: rotate(270deg);
            }

            .sk-circle .sk-circle11 {
                -webkit-transform: rotate(300deg);
                -ms-transform: rotate(300deg);
                transform: rotate(300deg);
            }

            .sk-circle .sk-circle12 {
                -webkit-transform: rotate(330deg);
                -ms-transform: rotate(330deg);
                transform: rotate(330deg);
            }

            .sk-circle .sk-circle2:before {
                -webkit-animation-delay: -1.1s;
                animation-delay: -1.1s;
            }

            .sk-circle .sk-circle3:before {
                -webkit-animation-delay: -1s;
                animation-delay: -1s;
            }

            .sk-circle .sk-circle4:before {
                -webkit-animation-delay: -0.9s;
                animation-delay: -0.9s;
            }

            .sk-circle .sk-circle5:before {
                -webkit-animation-delay: -0.8s;
                animation-delay: -0.8s;
            }

            .sk-circle .sk-circle6:before {
                -webkit-animation-delay: -0.7s;
                animation-delay: -0.7s;
            }

            .sk-circle .sk-circle7:before {
                -webkit-animation-delay: -0.6s;
                animation-delay: -0.6s;
            }

            .sk-circle .sk-circle8:before {
                -webkit-animation-delay: -0.5s;
                animation-delay: -0.5s;
            }

            .sk-circle .sk-circle9:before {
                -webkit-animation-delay: -0.4s;
                animation-delay: -0.4s;
            }

            .sk-circle .sk-circle10:before {
                -webkit-animation-delay: -0.3s;
                animation-delay: -0.3s;
            }

            .sk-circle .sk-circle11:before {
                -webkit-animation-delay: -0.2s;
                animation-delay: -0.2s;
            }

            .sk-circle .sk-circle12:before {
                -webkit-animation-delay: -0.1s;
                animation-delay: -0.1s;
            }

        @-webkit-keyframes sk-circleBounceDelay {
            0%, 80%, 100% {
                -webkit-transform: scale(0);
                transform: scale(0);
            }

            40% {
                -webkit-transform: scale(1);
                transform: scale(1);
            }
        }

        @keyframes sk-circleBounceDelay {
            0%, 80%, 100% {
                -webkit-transform: scale(0);
                transform: scale(0);
            }

            40% {
                -webkit-transform: scale(1);
                transform: scale(1);
            }
        }