@charset "UTF-8";

/*********** header 頁首 ***********/
.has-header {
    padding-top: 10.6667vw;
}

.header {
    position: fixed;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    width: 96%;
    height: 10.6667vw;
    padding: 0 2%;
    color: #fff;
    background: linear-gradient(180deg, #494949, #212121);
    z-index: 15;
}

header .title {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 4.8vw;
}

.header .back {
    color: #ffeccf;
    font-size: 5vw;
    cursor: pointer;
}

.header .back img {
    height: 30px;
}

.header .logo img {
    display: block;
    width: 26.6667vw;
}

.header .centerbox {
    position: absolute;
    left: 50%;
    font: normal bold 5vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.header .rightbox {
    display: flex;
    align-items: center;
}

.header .rightbox .hd-icon {
    position: relative;
    margin-left: 2vw;
    cursor: pointer;
}

.top_open {
    display: none;
    position: absolute;
    top: 35px;
    right: -5px;
    min-width: 160px;
    padding: 0.5vw;
    color: #555;
    font: normal normal 2.5vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    -o-box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    z-index: 35;
}

.nav_layer {
    border-bottom: 1px solid #eee;
}

.nav_layer:last-child {
    border-bottom: 0;
}

.header .rightbox .hd-icon img.nav_flag {
    width: 30px;
    margin: 0 5px;
}

.header .rightbox .help {
    color: #1294CC;
    font-size: 6vw;
}

.header .rightbox .date {
    color: #ff0;
}

.header-date,
.header-menu {
    position: fixed;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    height: 8.6667vw;
    padding: 0 2vw 0 0;
    cursor: pointer;
    z-index: 16;
}

.header-menu span {
    width: 1.5vw;
    height: 1.5vw;
    margin-right: 1vw;
    background: #e8c796;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}

.header-menu span:last-child {
    margin-right: 0;
}

.header-menu i {
    color: #e8c796;
    font-size: 5.5vw;
}

.header-time {
    color: #9F9F9F;
    font: normal normal 3.7333vw/4.3333vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.header-msg {
    position: relative;
    display: flex;
    justify-content: flex-end;
}

.header-msg .msg-red-point {
    position: absolute;
    top: 0;
    right: -3px;
    width: 10px;
    height: 10px;
    background: #f00;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}

.header-msg img {
    width: 6.8667vw;
}

/*********** footer 頁尾 ***********/
.has-footer {
    padding-bottom: 25.3333vw;
}

.footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 96%;
    padding: 3% 2% 0 2%;
    color: #666;
    background: url(../images/footer/bg.png?0122701) no-repeat;
    background-size: 100% auto;
    z-index: 19;
}

.ft-navbox {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.ft-nav {
    display: flex;
    align-items: center;
    flex-direction: column;
    color: #ffeccf;
}

.ft-nav img {
    display: block;
    width: 12.3333vw;
}

.ft-title {
    width: 19vw;
    margin: 0;
    text-align: center;
    word-break: break-word;
    font: normal normal 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.ft-nav .gif-box,
.ft-nav .gif-box .ft-home,
.ft-nav.active .gif-box,
.ft-nav.active .gif-box .ft-home {
    width: 9.3333vw;
    height: 9.3333vw;
    padding: 1vw;
    margin-bottom: 5px;
    background: url(../images/footer/footer-icon-bg.png?0122701) center center no-repeat;
    background-size: 200% auto;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 4px 1px rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 0 4px 1px rgba(0, 0, 0, .3);
    -ms-box-shadow: 0 0 4px 1px rgba(0, 0, 0, .3);
    -o-box-shadow: 0 0 4px 1px rgba(0, 0, 0, .3);
    box-shadow: 0 0 4px 1px rgba(0, 0, 0, .3);
    overflow: hidden;
}

.ft-nav.active .gif-box,
.ft-nav.active .gif-box .ft-home {
    background: url(../images/footer/footer-git-bg.png?0122701) center center no-repeat;
    background-size: 200% auto;
}

.ft-nav:nth-child(3) .ft-home {
    width: 11.3333vw;
    height: 11.3333vw;
}

.ft-nav:nth-child(3) .ft-home {
    -webkit-transform: translateY(-7vw);
    -moz-transform: translateY(-7vw);
    -ms-transform: translateY(-7vw);
    -o-transform: translateY(-7vw);
    transform: translateY(-7vw);
}

.ft-nav:nth-child(3) img {
    width: 12.6667vw;
}

.ft-nav:nth-child(3) .ft-title {
    -webkit-transform: translateY(-6vw);
    -moz-transform: translateY(-6vw);
    -ms-transform: translateY(-6vw);
    -o-transform: translateY(-6vw);
    transform: translateY(-6vw);
}

.ft-nav:nth-child(3) .active.ft-home .ft-title {
    -webkit-transform: translateY(8vw);
    -moz-transform: translateY(8vw);
    -ms-transform: translateY(8vw);
    -o-transform: translateY(8vw);
    transform: translateY(8vw);
}

/*********** 共用元件(文字) ***********/
.text_bold {
    font-weight: bold;
}

.text_normal {
    font-weight: normal;
}

.text_italic {
    font-style: italic;
}

.text_right {
    text-align: right;
}

.text_left {
    text-align: left;
}

.text_center {
    text-align: center;
}

.float_r {
    float: right;
}

.float_l {
    float: left;
}

.no_float {
    float: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
.h1,
.h2,
.h3,
.h4,
.h5,
.p {
    margin: 1vw 0;
}

h1,
.h1 {
    font: normal bold 5vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

h2,
.h2 {
    font: normal bold 4.6vw/4.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

h3,
.h3 {
    font: normal bold 4.2vw/4.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

h4,
.h4 {
    font: normal bold 3.8vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

h5,
.h5 {
    font: normal bold 3.6vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

h6,
.h6 {
    font: normal bold 3.4vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

p,
.p {
    font: normal normal 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

br {
    line-height: 1;
}

.fs_12 {
    font-size: 12px;
}

.fs_14 {
    font-size: 14px;
}

.fs_16 {
    font-size: 16px;
}

.fs_18 {
    font-size: 18px;
}

.fs_20 {
    font-size: 20px;
}

.fs_22 {
    font-size: 22px;
}

.fs_32 {
    font-size: 32px;
}

/* 單行省略 */
.text_overflow {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

/* 多行省略(2行、3行、4行) */
.text_overflow_2,
.text_overflow_3,
.text_overflow_4 {
    display: -webkit-box;
    height: 58px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    overflow: hidden;
}

.text_overflow_3 {
    height: 88px;
    -webkit-line-clamp: 3;
}

.text_overflow_4 {
    height: 116px;
    -webkit-line-clamp: 4;
}

/*********** 共用元件(眼睛) ***********/
i.fa-eye,
i.fa-eye-slash {
    font-size: 4vw;
    cursor: pointer;
}

/*********** 共用元件(顏色) ***********/
.text_white {
    color: #fff;
}

.text_yellow {
    color: #ffeb00;
}

a.text_yellow:hover,
a.text_yellow:active,
a.text_yellow:focus {
    color: #d3ab19;
}

.text_orange {
    color: #f70;
}

.text_red {
    color: #dd3b3b;
}

a.text_red:hover,
a.text_red:active,
a.text_red:focus {
    color: #9c2323;
}

.text_deepred {
    color: #9c2323;
}

.text_brown {
    color: #d7b174;
}

.text_lightbrown {
    color: #ffeccf;
}

.text_blue {
    color: #0089ff;
}

a.text_blue:hover,
a.text_blue:active,
a.text_blue:focus {
    color: #0074d9;
}

.text_lightblue {
    color: #00c4e3;
}

a.text_lightblue:hover,
a.text_lightblue:active,
a.text_lightblue:focus {
    color: #00a5bf;
}

.text_deepblue {
    color: #003abb;
}

.text_green {
    color: #00bc00;
}

a.text_green:hover,
a.text_green:active,
a.text_green:focus {
    color: #009300;
}

.text_deepgreen {
    color: #0d562f;
}

.text_pink {
    color: #db4a93;
}

.text_purple {
    color: #b789eb;
}

.text_gray {
    color: #777;
}

.text_lightgray {
    color: #bbb;
}

.text_deepgray {
    color: #444;
}

.text_black {
    color: #000;
}

.bg_white {
    background-color: #fff;
}

.bg_yellow {
    background-color: #efd100;
}

.bg_lightyellow {
    background-color: #ffef88;
}

.bg_deepyellow {
    background-color: #766700;
}

.bg_red {
    background-color: #f00;
}

.bg_pink {
    background-color: #ffbacb;
}

.bg_deepred {
    background-color: #6a1f22;
}

.bg_blue {
    background-color: #00a7ff;
}

.bg_lightblue {
    background-color: #9cddff;
}

.bg_deepblue {
    background-color: #004dad;
}

.bg_green {
    background-color: #36b545;
}

.bg_lightgreen {
    background-color: #98d9a0;
}

.bg_deepgreen {
    background-color: #006c0d;
}

.bg_brown {
    background-color: #bb7925;
}

.bg_lightbrown {
    background-color: #d9b78b;
}

.bg_deepbrown {
    background-color: #784400;
}

.bg_purple {
    background-color: #8d37ff;
}

.bg_lightpurple {
    background-color: #caa3ff;
}

.bg_deeppurple {
    background-color: #3e0091;
}

.bg_gray {
    background-color: #999;
}

.bg_lightgray {
    background-color: #ddd;
}

.bg_deepgray {
    background-color: #333;
}

.bg_black {
    background-color: #000;
}

/*********** 共用元件(按鈕) ***********/
input.btn20,
a.btn20 {
    width: 20%;
}

input.btn33,
a.btn33 {
    width: 30%;
}

input.btn50,
a.btn50 {
    width: 48%;
}

input.btn100,
a.btn100 {
    width: 98%;
}

input.btn_superbig,
a.btn_superbig {
    padding: 10px 5px;
    font: normal bold 3.2vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

input.btn_big,
a.btn_big {
    padding: 5px 10px;
    font: normal bold 3.2vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

input.btn_small,
a.btn_small {
    padding: 10px;
    font: normal bold 2vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

input.btn_superbig,
a.btn_superbig,
input.btn_big,
a.btn_big,
input.btn_small,
a.btn_small {
    text-align: center;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
    border-radius: 50px;
}

input.btn_orange,
a.btn_orange {
    color: #fff;
    background-color: #f38906;
    border: 1px solid #f38906;
}

input.btn_orange:hover,
input.btn_orange:active,
input.btn_orange:focus,
a.btn_orange:hover,
a.btn_orange:active,
a.btn_orange:focus {
    background-color: #f3a41f;
    border: 1px solid #f3a41f;
}

input.btn_blue,
a.btn_blue {
    color: #fff;
    background-color: #b9a495;
    border: 1px solid #b9a495;
    /* background: linear-gradient(to bottom, #c3ac92 0%, #e2c7a8 25%, #ecd1b3 40%, #dbc1a2 70%, #c4a888 90%, #dbbf9e 100%);
    box-shadow: 0 3px 5px #837464;
    background: url(../images/members/btn-bg.png) top center no-repeat;
    background-size: contain; */
}

input.btn_blue:hover,
input.btn_blue:active,
input.btn_blue:focus,
a.btn_blue:hover,
a.btn_blue:active,
a.btn_blue:focus {
    background-color: #af9989;
    border: 1px solid #af9989;
}

input.btn_red,
a.btn_red {
    color: #fff;
    background-color: #df3333;
    border: 1px solid #df3333;
}

input.btn_red:hover,
input.btn_red:active,
input.btn_red:focus,
a.btn_red:hover,
a.btn_red:active,
a.btn_red:focus {
    background-color: #a71a1a;
    border: 1px solid #a71a1a;
}

input.btn_green,
a.btn_green {
    color: #fff;
    background-color: #78a979;
    border: 1px solid #78a979;
}

input.btn_green:hover,
input.btn_green:active,
input.btn_green:focus,
a.btn_green:hover,
a.btn_green:active,
a.btn_green:focus {
    background-color: #6d966e;
    border: 1px solid #6d966e;
}

input.btn_yellow,
a.btn_yellow {
    color: #fff;
    background-color: #e9b700;
    border: 1px solid #e9b700;
}

input.btn_yellow:hover,
input.btn_yellow:active,
input.btn_yellow:focus,
a.btn_yellow:hover,
a.btn_yellow:active,
a.btn_yellow:focus {
    background-color: #cda71a;
    border: 1px solid #cda71a;
}

input.btn_gray,
a.btn_gray {
    color: #fff;
    background-color: #838383;
    border: 1px solid #838383;
}

input.btn_gray:hover,
input.btn_gray:active,
input.btn_gray:focus,
a.btn_gray:hover,
a.btn_gray:active,
a.btn_gray:focus {
    background-color: #6e6e6e;
    border: 1px solid #6e6e6e;
}

input.btn_lightgray,
a.btn_lightgray,
input.btn_lightgray:hover,
input.btn_lightgray:active,
input.btn_lightgray:focus,
a.btn_lightgray:hover,
a.btn_lightgray:active,
a.btn_lightgray:focus {
    color: #fff;
    background-color: #bbb;
    border: 1px solid #bbb;
}

/*********** 共用元件(圓角) ***********/
.br5 {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}

.br10 {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}

.br20 {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
}

.br30 {
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    border-radius: 30px;
}

.br40 {
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    -ms-border-radius: 40px;
    -o-border-radius: 40px;
    border-radius: 40px;
}

.br50 {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
    border-radius: 50px;
}

.br-circle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}

/*********** 共用元件(陰影) ***********/
.shadow_s {
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .1);
    -o-box-shadow: 0 0 3px rgba(0, 0, 0, .1);
    box-shadow: 0 0 3px rgba(0, 0, 0, .1);
}

.shadow_m {
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 6px rgba(0, 0, 0, .2);
    -o-box-shadow: 0 0 6px rgba(0, 0, 0, .2);
    box-shadow: 0 0 6px rgba(0, 0, 0, .2);
}

.shadow_b {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, .3);
    -o-box-shadow: 0 0 10px rgba(0, 0, 0, .3);
    box-shadow: 0 0 10px rgba(0, 0, 0, .3);
}

/*********** 共用元件(上下左右間距) ***********/
.mt5 {
    margin-top: 5px;
}

.mb5 {
    margin-bottom: 5px;
}

.mr5 {
    margin-right: 5px;
}

.ml5 {
    margin-left: 5px;
}

.mt10 {
    margin-top: 10px;
}

.mb10 {
    margin-bottom: 10px;
}

.mr10 {
    margin-right: 10px;
}

.ml10 {
    margin-left: 10px;
}

.mt20 {
    margin-top: 20px;
}

.mb20 {
    margin-bottom: 20px;
}

.mr20 {
    margin-right: 20px;
}

.ml20 {
    margin-left: 20px;
}

.mt30 {
    margin-top: 30px;
}

.mb30 {
    margin-bottom: 30px;
}

.mr30 {
    margin-right: 30px;
}

.ml30 {
    margin-left: 30px;
}

.pt10 {
    padding-top: 10px;
}

.pb10 {
    padding-bottom: 10px;
}

.pr10 {
    padding-right: 10px;
}

.pl10 {
    padding-left: 10px;
}

.pt20 {
    padding-top: 20px;
}

.pb20 {
    padding-bottom: 20px;
}

.pr20 {
    padding-right: 20px;
}

.pl20 {
    padding-left: 20px;
}

.pt30 {
    padding-top: 30px;
}

.pb30 {
    padding-bottom: 30px;
}

.pr30 {
    padding-right: 30px;
}

.pl30 {
    padding-left: 30px;
}

hr {
    height: 5px;
    padding: 0;
    margin: 0;
    background: #f7f7f7;
    border: 0;
}

/*********** 共用樣式(input、select) ***********/
.popup_in input.input_no_width {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}

/*********** 共用樣式(頁籤、分頁) ***********/
.tabs-wrap {
    margin-bottom: 2.6667vw;
    height: 12.6667vw;
    overflow: hidden;
}

.tabs-scroll {
    width: 100%;
    height: 10.6667vw;
    overflow-x: auto;
}

.tabs-scroll::-webkit-scrollbar {
    display: none;
}

.share-tab-nav {
    position: relative;
    display: -webkit-flex;
    display: flex;
    background-color: #f5f5f5;
    -webkit-user-select: none;
    user-select: none;
}

.tabs-scroll .share-tab-nav {
    min-width: 900px;
}

.share-tab-nav.line {
    height: 100%;
    padding-bottom: 4vw;
    box-sizing: content-box;
}

.share-tab {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 0 1.0667vw;
    color: #666;
    font: normal bold 4vw/5.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    cursor: pointer;
}

.share-tab.active {
    color: #ae9673;
    font-weight: bold;
}

.share-tab.active:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0.8vw;
    background-color: #c9b9ad;
    -webkit-border-radius: .8vw;
    -moz-border-radius: .8vw;
    -ms-border-radius: .8vw;
    -o-border-radius: .8vw;
    border-radius: .8vw;
    z-index: 1;
}

.share-tabbox,
.share-tab.active {
    position: relative;
}

.share-tab-panel {
    display: none;
    padding: 10px;
}

.share_content {
    width: 94%;
    color: #666;
    margin: 3% auto;
}

.share_content textarea {
    width: 94%;
    height: 38.6667vw;
    margin: 3.2vw auto;
    padding: 3%;
    color: #000;
    font: normal bold 4vw/5.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background: #F3F3F3;
    border: none;
    -webkit-border-radius: 1.6vw;
    -moz-border-radius: 1.6vw;
    -ms-border-radius: 1.6vw;
    -o-border-radius: 1.6vw;
    border-radius: 1.6vw;
    outline: none;
}

/*********** 共用列表(注意事項) ***********/
.share_tips {
    width: 100%;
    margin: 5vw auto;
    color: #000;
    background: #fff;
    -webkit-border-radius: 2.6667vw;
    -moz-border-radius: 2.6667vw;
    -ms-border-radius: 2.6667vw;
    -o-border-radius: 2.6667vw;
    border-radius: 2.6667vw;
}

.share_tips .tips_title {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 11.7333vw;
    font: normal bold 4.3vw/5.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    border-bottom: 1px solid #cbcbcb;
}

.share_tips .tips_title i {
    margin-right: 5px;
    color: #ff8f12;
    font-size: 5vw;
}

.share_tips .tips_content {
    padding: 3.2vw 4.8vw;
    font: normal normal 3.8vw/5.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

/*********** 共用列表(條款、註解、文章) ***********/
.share_note_box {
    color: #555;
    background-color: #fdfdfd;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}

.share_note {
    width: 96%;
    margin: 0 auto;
    padding: 2%;
    font: normal bold 4.5vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    border-bottom: 1px dashed #ccc;
}

.share_note {
    display: flex;
}

.share_note_inner {
    margin-bottom: 1em;
    padding: 0.5em 1em 1em;
    font: normal normal 3.8vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    text-align: justify;
    background-color: #f1f1f1;
    -webkit-border-radius: 0 0 0.5em 0.5em;
    -moz-border-radius: 0 0 .5em .5em;
    -ms-border-radius: 0 0 .5em .5em;
    -o-border-radius: 0 0 .5em .5em;
    border-radius: 0 0 0.5em 0.5em;
}

.share_note_inner ul,
.share_note_inner ol {
    width: 90%;
    padding: 0.3em 1.5em 0.5em 1.5em;
    margin: 0 auto;
    list-style-type: decimal;
}

.share_note_inner ol {
    list-style-type: lower-roman;
}

.share_note_inner li {
    margin-bottom: 10px;
}

.share_note_inner dt,
.share_note_inner .list_title {
    margin: 10px 0;
    color: #99806c;
    font: normal bold 4.2vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.share_note_inner p {
    font: normal normal 3.8vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.arrow_box {
    margin: 0 5px;
    font-size: 2vw;
}

/*********** 共用樣式(圖文) ***********/
.share_explain {
    font: normal 3.5vw/5.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.share_infobox {
    margin-top: 5.3333vw;
    padding: 2.6667vw;
    background: #F3F3F3;
    border-radius: 1.6vw;
}

.share_infobox .title {
    padding-bottom: 2.6667vw;
    color: #99806c;
    font-size: 3vw;
    font-weight: bold;
    text-align: center;
    border-bottom: 1px solid #CFCFCF;
}

.share_infobox .img {
    margin-top: 2.6667vw;
    height: auto;
    border-radius: 1.6vw;
    background: #E6E6E6;
}

.share_infobox .img img {
    width: 100%;
    height: auto;
}

/*********** 共用樣式(下滑資訊) ***********/
.van-collapse {
    width: 94%;
    margin: 0 auto 5vw;
    padding: 3%;
    background: #fff;
    border: none;
    -webkit-border-radius: 2.6667vw;
    -moz-border-radius: 2.6667vw;
    -ms-border-radius: 2.6667vw;
    -o-border-radius: 2.6667vw;
    border-radius: 2.6667vw;
}

.van-collapse-item {
    position: relative;
}

.van-cell {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    width: 90%;
    padding: 3%;
    margin: 0 2%;
    color: #333;
    font: normal normal 4vw/6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background-color: #fff;
    border-bottom: 1px solid #f8f8f8;
    cursor: pointer;
    overflow: hidden;
}

.van-collapse-item:last-of-type .van-cell {
    border-bottom: 0;
}

.van-cell_title {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}

.van-cell i {
    color: #999;
}

.van-cell i:before {
    display: inline-block;
}

.van-collapse-item_title-expanded .van-cell_title,
.van-collapse-item_title-expanded i {
    color: #1294CC;
}

.van-collapse-item_title i:before {
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
}

.van-collapse-item_title-expanded i:before {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.van-collapse-item_wrapper {
    -webkit-transition: height .1s ease-in-out;
    transition: height .1s ease-in-out;
    will-change: height;
    overflow: hidden;
}

.van-collapse-item_content {
    padding: 3.2vw 4.2667vw;
    color: #000;
    font: normal normal 3.8vw/1.5 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background-color: #f8f8f8;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;
}

.van-collapse-item_content .van-collapse-item_content_textlist,
.tips_content .tips_content_textlist {
    list-style: decimal;
    padding: 0.5em 1em;
    line-height: 1.5em;
}

/*********** 共用樣式 ***********/
.col_1 {
    width: calc(100% - 10px);
    padding: 5px;
}

.col_flex {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: calc(100% - 10px);
    padding: 5px;
    font: normal normal 3.5vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.col_title,
.col_item {
    display: inline-block;
    width: 30%;
    font: normal bold 3.6vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    word-break: break-word;
    vertical-align: middle;
}

.col_item {
    width: calc(100% - 31%);
    font-weight: normal;
}

.col_tip {
    font: normal normal 3vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.col_tip li {
    margin-bottom: 5px;
}

input.input20,
input.input33,
input.input50,
input.input100,
select.select33,
select.select50,
select.select100 {
    display: flex;
    flex-direction: row;
    width: calc(100% - 12px);
    padding: 5px;
    color: #333;
    font: normal normal 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background-color: #fff;
    border: 0;
    border-bottom: 1px solid #ddd;
    vertical-align: middle;
    cursor: pointer;
}

input.input100 {
    width: calc(100% - 12px);
}

select.select100 {
    width: 100%;
}

input.input50,
select.select50 {
    width: calc(100% / 2 - 10px);
}

input.input33,
select.select33 {
    width: calc(100% / 3 - 10px);
}

.input_no_width {
    display: inline-block;
    width: auto;
    padding: 5px;
    color: #333;
    font: normal normal 16px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background-color: #fff;
    border: 1px solid #ccc;
    vertical-align: middle;
    cursor: pointer;
}

.item_title {
    margin: 1vw;
    font: normal bold 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.col_inline,
.col_radio,
.col_checkbox {
    display: inline-block;
    margin-right: 15px;
    font: normal bold 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.col_radio label,
.col_checkbox label {
    vertical-align: middle;
    cursor: pointer;
}

.btn_box {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 100%;
    margin: 10px 0;
    padding: 15px 0 0 0;
}

.item_title i,
.btn_box input {
    margin-right: 5px;
}

.item_title i:last-of-type,
.col_radio:last-of-type,
.col_checkbox:last-of-type,
.btn_box input:last-of-type {
    margin-right: 0;
}

/*********** 共用flex ***********/
.flex {
    display: flex;
    align-items: center;
}

.jc_bt {
    justify-content: space-between;
}

.jc_ar {
    justify-content: space-around;
}

.jc_evenly {
    justify-content: space-evenly;
}

.jc_center {
    justify-content: center;
}

.jc_end {
    justify-content: end;
    align-items: stretch;
}

.ai_stretch {
    align-items: stretch;
}

.flex_wrap {
    flex-wrap: wrap;
}

.flex_nowrap {
    flex-wrap: nowrap;
}

/*********** 共用元件(備註、解說、注意事項) ***********/
.share-tip {
    padding: 2vw 5vw;
    color: #999;
}

.share-tip p,
.share-tip div,
.share-tip li {
    margin: 0 0 10px 0;
    font: normal normal 3.8vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

/*********** 共用元件(ul或 ol 列表) ***********/
/* ul或ol 前面是沒有任何樣式用 list_nostyle */
.list_nostyle,
.list_dot,
.list_number,
.list_roman,
.list_chinese {
    margin: 0px 0 0 10px;
    padding: 0 0 0 15px;
    text-align: left;
    word-wrap: break-word;
    font: normal normal 17px/23px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.list_nostyle.mt10,
.list_dot.mt10,
.list_number.mt10,
.list_roman.mt10,
.list_chinese.mt10 {
    margin-top: 10px;
}

.list_nostyle {
    padding: 0;
    margin: 0;
}

.list_nostyle li {
    margin: 0 0 10px 0;
}

.list_nostyle div,
.list_nostyle span,
.list_nostyle a,
.list_dot li div,
.list_dot li span,
.list_dot li a,
.list_number div,
.list_number span,
.list_number a,
.list_roman div,
.list_roman span,
.list_roman a,
.list_chinese div,
.list_chinese span,
.list_chinese a {
    vertical-align: middle;
}

/* ul或ol 前面是 黑點，用 list_dot */
.list_dot {
    list-style: disc;
}

/* ul或ol 前面是 數字，用 list_number */
.list_number {
    list-style: decimal;
}

/* ul或ol 前面是 大寫羅馬數字，用 list_roman */
.list_roman {
    list-style: upper-roman;
}

/* ul或ol 前面是 中文數字，用 list_roman */
.list_chinese {
    /* list-style: trad-chinese-informal; */
    list-style: decimal-leading-zero;
}

.list_dot li,
.list_number li,
.list_roman li,
.list_chinese li {
    margin: 0 0 15px 0;
    padding: 0 0 0 5px;
}

.list_chinese li.share_title {
    margin: 0 0 15px 20px;
    padding: 0;
}

.list_roman li {
    margin: 0 0 15px 12px;
}

.list_number a,
.list_roman a,
.list_chinese a {
    text-decoration: underline;
}

/*********** 共用元件(轉圈圈-讀取動畫) ***********/
.reflash {
    margin-left: 10px;
    font-size: 4vw;
    cursor: pointer;
}

.reflash i:hover,
.reflash i:active,
.reflash i:focus {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transition: transform 1s linear;
    -moz-transition: transform 1s linear;
    -ms-transition: transform 1s linear;
    -o-transition: transform 1s linear;
    transition: transform 1s linear;
}

/*********** 搜尋列 ***********/
.share_search {
    width: 94%;
    margin: 3% auto;
    border: 1px solid #aaa;
    -webkit-border-radius: 0.2em;
    -moz-border-radius: 0.2em;
    -ms-border-radius: 0.2em;
    -o-border-radius: 0.2em;
    border-radius: 0.2em;
}

.search_title {
    position: relative;
    display: flex;
    align-items: center;
    margin: auto;
    padding: 5px;
    color: #fff;
    text-align: center;
    font: normal normal 3vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background-color: #aaa;
    border: 1px solid #aaa;
    cursor: pointer;
}

.search_title span {
    width: 96%;
}

.search_detail {
    margin: 0 auto;
    padding: 2.5%;
}

.popup .search_detail {
    padding: 0;
}

.search_detail li {
    position: relative;
    display: table;
    width: 100%;
    padding-bottom: 0.7em;
}

.search_detail .title_set {
    margin: 0 0 0.5em 0.5em;
    color: #555;
    font: normal normal 2.2vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.search_detail .select_date {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.search_detail .select_set_w100,
.search_detail .select_date .input_date50 {
    width: 100%;
    height: 2em;
    padding: 0 2%;
    color: #888;
    font: normal normal 2.2vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    border: 1px solid #aaa;
    -webkit-border-radius: 1vw;
    -moz-border-radius: 1vw;
    -ms-border-radius: 1vw;
    -o-border-radius: 1vw;
    border-radius: 1vw;
}

.search_detail .select_date .input_date50 {
    width: 42%;
}

.search_detail .select_date:after {
    content: "-";
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    color: #fff;
    text-align: center;
    line-height: 45px;
    z-index: -1;
}

.search_detail .btn_box {
    margin: 5px 0;
    padding: 5px 0 0 0;
}

/*********** 共用-跳框 ***********/
.popup_windows {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    overflow: auto;
    z-index: 20;
}

.share_popup_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .4);
    overflow: auto;
    z-index: 20;
}

.popup_container {
    position: absolute;
    width: 100%;
    z-index: 21;
}

.popup {
    position: relative;
    width: 95%;
    margin: 0 auto;
    background-color: #fff;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}

.popup.popup_s {
    max-width: 400px;
}

.popup.popup_m {
    max-width: 600px;
}

.popup.popup_l {
    max-width: 900px;
}

.popup_close {
    position: absolute;
    top: 10px;
    right: 15px;
    color: #fff;
    font: normal bold 22px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    cursor: pointer;
}

.popup_title {
    padding: 0.7vw 2vw;
    text-align: center;
    color: #fff;
    font: normal bold 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    background-color: #c4b1a3;
    -webkit-border-radius: 20px 20px 0 0;
    -moz-border-radius: 20px 20px 0 0;
    -ms-border-radius: 20px 20px 0 0;
    -o-border-radius: 20px 20px 0 0;
    border-radius: 20px 20px 0 0;
}

.popup_in {
    width: 90%;
    margin: auto;
    padding: 20px;
    color: #888;
    font: normal normal 3.5vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.popup_in .scroll_box {
    margin: 0 auto;
    overflow-x: hidden;
    overflow-y: auto;
}

.popup_in a {
    color: #888;
}

.popup_in a.text_red {
    color: #bb6060;
}

.popup_in a:hover,
.popup_in a:active,
.popup_in a:focus {
    color: #bb6969;
}

.popup_tips {
    padding: 2px 5px;
    margin-bottom: 5px;
    font: normal normal 2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
}

.popup_in a.text_blue {
    font-weight: bolder;
    color: #0089ff;
}

/*********  以下為 手機畫面_設定  *********/
/* 寬度大於 1024px (電腦)*/
@media screen and (min-width: 1024px) {

    /* 頁首 */
    .has-header {
        padding-top: 3.6667vw;
    }

    .index.has-header {
        padding-top: 1.6667vw;
    }

    .header {
        width: 97%;
        height: 3.6667vw;
    }

    .header .logo img {
        width: 12.6667vw;
    }

    .header .rightbox .hd-icon img {
        width: 45px;
    }

    .header .centerbox {
        font: normal bold 2vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header .back {
        font-size: 2vw;
    }

    .header .rightbox .help {
        font-size: 2.5vw;
    }

    .header-msg img {
        width: 2.8vw;
    }

    .header-date,
    .header-menu {
        height: 3.6667vw;
        padding: 0 1vw 0 0;
    }

    .header-menu span {
        width: 0.6vw;
        height: 0.6vw;
        margin-right: 0.6vw;
    }

    .header-time {
        font: normal normal 1.5vw/1.7vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-menu i {
        font-size: 2vw;
    }

    /* 語系 */
    .top_open {
        top: 50px;
        font: normal normal 1vw/1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .has-footer {
        padding-bottom: 21.3333vw;
    }

    .ft-title {
        font: normal normal 2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .ft-nav .gif-box,
    .ft-nav .gif-box .ft-home,
    .ft-nav.active .gif-box,
    .ft-nav.active .gif-box .ft-home {
        width: 6.3333vw;
        height: 6.3333vw;
    }

    .ft-nav:nth-child(3) .ft-home {
        width: 7.6667vw;
        height: 7.6667vw;
    }

    .ft-nav:nth-child(3) .ft-home {
        -webkit-transform: translateY(-2.5vw);
        -moz-transform: translateY(-2.5vw);
        -ms-transform: translateY(-2.5vw);
        -o-transform: translateY(-2.5vw);
        transform: translateY(-2.5vw);
    }

    .ft-nav:nth-child(3) .ft-title {
        -webkit-transform: translateY(-1.5vw);
        -moz-transform: translateY(-1.5vw);
        -ms-transform: translateY(-1.5vw);
        -o-transform: translateY(-1.5vw);
        transform: translateY(-1.5vw);
    }

    /* 共用元件(文字) */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .p {
        margin: 0.5vw 0;
    }

    h1,
    .h1 {
        font: normal bold 3vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 2.5vw/2.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 2.2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 1.8vw/1.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 1.3vw/1.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 1.2vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .item_title {
        margin: 0.5vw 0;
        font: normal bold 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(按鈕) */
    input.btn_small,
    a.btn_small {
        padding: 5px;
        font: normal normal 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        padding: 7px;
        font: normal bold 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 12px 5px;
        font: normal bold 3.4vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_flex {
        font: normal normal 1.5vw/1.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_tip {
        font: normal normal 1.5vw/1.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_title,
    .col_item,
    .item_title {
        font: normal bold 1.8vw/1.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_inline,
    .col_radio,
    .col_checkbox {
        font: normal bold 1.1vw/1.1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        padding: 0.5vw;
        font: normal normal 1.4vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input100 {
        width: calc(100% - 22px);
    }

    select.select100 {
        width: calc(100% - 0.5vw);
    }

    /* 共用元件(轉圈圈-讀取動畫) */
    .reflash {
        font-size: 2.4vw;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-wrap {
        height: 5.6667vw;
    }

    .tabs-scroll {
        height: 6.6667vw;
    }

    .share-tab {
        font: normal bold 2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_content textarea {
        margin-top: 0.5vw;
        padding: 1.5%;
        font: normal bold 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .share_note {
        padding: 1.5%;
        font: normal bold 2.2vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner {
        font: normal normal 1.8vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner dt,
    .share_note_inner .list_title {
        font: normal bold 2.2vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(下滑資訊) */
    .van-collapse {
        width: 98%;
        margin: 0 auto 1vw;
        padding: 1%;
        -webkit-border-radius: 1.6667vw;
        -moz-border-radius: 1.6667vw;
        -ms-border-radius: 1.6667vw;
        -o-border-radius: 1.6667vw;
        border-radius: 1.6667vw;
    }

    .van-cell {
        width: 96%;
        padding: 2%;
        margin: 0;
        font: normal normal 2vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(備註、解說、注意事項) */
    .share_tips {
        margin: 3vw auto;
    }

    .share_tips .tips_title {
        height: 5.7333vw;
        font: normal bold 2.5vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_title i {
        font-size: 3vw;
    }

    .share_tips .tips_content,
    .van-collapse-item_content {
        padding: 2.2vw;
        font: normal normal 2vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tip p,
    .share-tip div,
    .share-tip li {
        font: normal normal 1.3vw/1.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(眼睛) */
    i.fa-eye,
    i.fa-eye-slash {
        font-size: 1.5vw;
    }

    /* 搜尋列 */
    .search_title {
        font-size: 2vw;
    }

    .search_detail li {
        padding-bottom: 1.5em;
    }

    .search_detail .title_set {
        font: normal normal 1.8vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        padding: 0 3% 0 1%;
        font: normal normal 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 0.6vw;
        -moz-border-radius: 0.6vw;
        -ms-border-radius: 0.6vw;
        -o-border-radius: 0.6vw;
        border-radius: 0.6vw;
    }

    /* 跳框 */
    .popup_container {
        top: 48%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .popup_in {
        font: normal normal 1vw/1.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_in .scroll_box {
        max-height: 400px;
    }

    .popup_close {
        top: 0.7vw;
    }

    .popup_title {
        font: normal bold 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_tips {
        padding: 0;
        font: normal normal 1.2vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.btn_big,
    .popup a.btn_big {
        font: normal bold 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.btn_superbig,
    .popup a.btn_superbig {
        font: normal normal 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.input20,
    .popup input.input33,
    .popup input.input50,
    .popup input.input100,
    .popup select.select33,
    .popup select.select50,
    .popup select.select100 {
        font: normal normal 1.4vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度大於 1920px (電腦)*/
@media screen and (min-width: 1920px) {

    /* 頁首 */
    .has-header,
    .index.has-header {
        padding-top: 2.6667vw;
    }

    .header {
        height: 2.6667vw;
    }

    .header .logo img {
        width: 8.6667vw;
    }

    .header .centerbox {
        font: normal bold 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header .back {
        font-size: 1.6vw;
    }

    .header .rightbox .help {
        font-size: 2.5vw;
    }

    .header-msg img {
        width: 2.5vw;
    }

    .header-date,
    .header-menu {
        height: 2.6667vw;
        padding: 0 1vw 0 0;
    }

    .header-menu span {
        width: 0.4vw;
        height: 0.4vw;
        margin-right: 0.4vw;
    }

    .header-menu i {
        font-size: 2vw;
    }

    /* 語系 */
    .top_open {
        top: 55px;
        min-width: 200px;
        font: normal normal 0.9vw/0.9vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .has-footer {
        padding-bottom: 11.3333vw;
    }

    .footer {
        padding: 2%;
    }

    .ft-title {
        font: normal normal 1.8vw/2.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .ft-nav .gif-box,
    .ft-nav .gif-box .ft-home,
    .ft-nav.active .gif-box,
    .ft-nav.active .gif-box .ft-home {
        width: 5.3333vw;
        height: 5.3333vw;
    }

    .ft-nav:nth-child(3) .ft-home {
        width: 5.6667vw;
        height: 5.6667vw;
    }

    .ft-nav:nth-child(3) .ft-home {
        -webkit-transform: translateY(0.5vw);
        -moz-transform: translateY(0.5vw);
        -ms-transform: translateY(0.5vw);
        -o-transform: translateY(0.5vw);
        transform: translateY(0.5vw);
    }

    .ft-nav:nth-child(3) .ft-title {
        -webkit-transform: translateY(1.5vw);
        -moz-transform: translateY(1.5vw);
        -ms-transform: translateY(1.5vw);
        -o-transform: translateY(1.5vw);
        transform: translateY(1.5vw);
    }

    /* 共用元件(文字) */
    h1,
    .h1 {
        font: normal bold 2.8vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 2.3vw/2.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 2vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 1.4vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 1.1vw/1.1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 0.9vw/1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(按鈕) */
    input.btn_small,
    a.btn_small {
        font: normal normal 1.4vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        padding: 5px;
        font: normal bold 1.8vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 8px;
        font: normal bold 2.2vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    input.input100 {
        width: calc(100% - 32px);
    }

    .col_flex {
        font: normal normal 1vw/1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_title,
    .col_item,
    .item_title {
        font: normal bold 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_tip {
        font: normal normal 0.85vw/0.95vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-wrap {
        height: 4.6667vw;
    }

    /* 共用元件(轉圈圈-讀取動畫) */
    .reflash {
        font-size: 1.8vw;
    }

    /* 共用元件(備註、解說、注意事項) */
    .share-tip p,
    .share-tip div,
    .share-tip li {
        margin: 0 0 15px 0;
        font: normal normal 1.1vw/1.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_in {
        font: normal normal 1.2vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_title {
        font: normal bold 1.4vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup .item_title {
        font: normal bold 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif !important;
    }

    .popup input.btn_small,
    .popup a.btn_small {
        font: normal normal 1vw/1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.btn_big,
    .popup a.btn_big {
        font: normal bold 1.3vw/1.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.btn_superbig,
    .popup a.btn_superbig {
        padding: 10px 5px;
        font: normal normal 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.input20,
    .popup input.input33,
    .popup input.input50,
    .popup input.input100,
    .popup select.select33,
    .popup select.select50,
    .popup select.select100 {
        padding: 0.2vw;
        font: normal normal 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup i.fa-eye,
    .popup i.fa-eye-slash {
        font-size: 1.2vw;
    }

    .popup_tips {
        padding: 0;
        font: normal normal 1vw/1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 1301px - 1900px (ipad pro,舊電腦) */
@media screen and (min-width: 1301px) and (max-width: 1900px) {

    /* 頁首 */
    .header-menu span {
        width: 0.5vw;
        height: 0.5vw;
        margin-right: 0.5vw;
    }

    /* 共用元件(文字) */
    p,
    .p {
        font: normal normal 1.3vw/1.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(按鈕) */
    input.btn_small,
    a.btn_small {
        font: normal normal 1.8vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        font: normal bold 2.4vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        font: normal bold 3vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_inline,
    .col_radio,
    .col_checkbox {
        font: normal bold 1.4vw/1.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-seriff;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        padding: 0.5vw;
        font: normal normal 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .share-tab {
        font: normal bold 2vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .share_note {
        padding: 1.5%;
        font: normal bold 1.8vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .arrow_box {
        font: normal bold 1.8vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner {
        font: normal normal 1.4vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner dt,
    .share_note_inner .list_title {
        font: normal bold 1.6vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_title {
        font: normal bold 1.6vw/1.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_tips {
        font: normal normal 1.1vw/1.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 1024px - 1300px (ipad) */
@media screen and (min-width: 1024px) and (max-width: 1300px) {

    /* 頁首 */
    .has-header,
    .index.has-header {
        padding-top: 4.6667vw;
    }

    .header {
        height: 4.6667vw;
    }

    .header .logo img {
        width: 12.6667vw;
    }

    .header .rightbox .hd-icon img {
        width: 45px;
    }

    .header .centerbox {
        font: normal bold 2.4vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header .back {
        font-size: 2.4vw;
    }

    .header .rightbox .help {
        font-size: 2.5vw;
    }

    .header-msg img {
        width: 2.8vw;
    }

    .header-date,
    .header-menu {
        height: 4.6667vw;
        padding: 0 1vw 0 0;
    }

    .header-menu span {
        width: 0.6vw;
        height: 0.6vw;
        margin-right: 0.6vw;
    }

    /* 頁尾 */
    .ft-nav {
        font: normal normal 1.7vw/1.9vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(文字) */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .p {
        margin: 0.5vw 0;
    }

    h1,
    .h1 {
        font: normal bold 3.5vw/.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 3vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 2.7vw/2.7vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 2.3vw/2.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 2.1vw/2.1vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 1.8vw/1.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 1.5vw/1.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .item_title {
        font: normal bold 1.8vw/1.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(按鈕) */
    input.btn_small,
    a.btn_small {
        font: normal normal 1.8vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        font: normal bold 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        font: normal bold 3.4vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_title,
    .col_item {
        font: normal bold 2.2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_inline,
    .col_radio,
    .col_checkbox {
        font: normal bold 1.5vw/1.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        font: normal normal 1.8vw/1.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input100 {
        width: calc(100% - 1.8vw);
    }

    i.fa-eye,
    i.fa-eye-slash {
        font-size: 2vw;
    }

    /* 搜尋列 */
    .search_title {
        font-size: 1.8vw;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        font: normal normal 1.8vw/1.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_container {
        top: 49%;
    }

    .popup_title {
        font: normal bold 2vw/2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.btn_big,
    .popup a.btn_big {
        font: normal bold 1.2vw/1.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup input.btn_superbig,
    .popup a.btn_superbig {
        font: normal normal 2.4vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度小於 1023px (平板+手機)*/
@media screen and (max-width: 1023px) {

    /* 頁首 */
    .header .rightbox .hd-icon img {
        width: 7.5vw;
    }

    .header .back img {
        height: 35px;
    }

    /* 共用樣式 */
    .col_radio,
    .col_checkbox {
        margin-right: 10px;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        font: normal normal 16px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用按鈕 */
    input.btn_small,
    a.btn_small {
        padding: 3px;
        font: normal normal 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        padding: 5px;
        font: normal bold 18px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 10px;
        font: normal bold 24px/28px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(轉圈圈-讀取動畫) */
    .reflash {
        font-size: 25px;
    }

    /* 共用樣式(頁籤、分頁) */
    .share-tab {
        font: normal bold 20px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tip h5,
    .share-tip p,
    .share-tip div,
    .share-tip li {
        font: normal normal 16px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .mag_text h5 {
        font: normal bold 18px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_content textarea {
        margin: 15px auto;
        padding: 15px;
        font: normal normal 18px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .arrow_box {
        font: normal normal 18px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner {
        font: normal normal 16px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner dt,
    .share_note_inner .list_title {
        font: normal bold 18px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_title {
        font: normal normal 18px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 產品訊息 */
    .share_infobox .title {
        font-size: 20px;
    }

    .share_explain {
        font: normal 18px/26px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_container {
        top: 3%;
    }

    .popup {
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -ms-border-radius: 10px;
        -o-border-radius: 10px;
        border-radius: 10px;
    }

    .popup_title {
        padding: 1.2vw;
        font: normal bold 4vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 10px 10px 0 0;
        -moz-border-radius: 10px 10px 0 0;
        -ms-border-radius: 10px 10px 0 0;
        -o-border-radius: 10px 10px 0 0;
        border-radius: 10px 10px 0 0;
    }

    .popup_in {
        width: calc(100% - 30px);
        padding: 15px;
        font: normal normal 14px/17px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_tips {
        font: normal normal 14px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 901px - 1023px (ipad) */
@media screen and (min-width: 901px) and (max-width: 1023px) {

    /* 頁首 */
    .has-header {
        padding-top: 5.6667vw;
    }

    .index.has-header {
        padding-top: 2vw;
    }

    .header {
        height: 5.6667vw;
    }

    .header .logo img {
        width: 18.6667vw;
    }

    .header .rightbox .hd-icon img {
        width: 5vw;
    }

    .header .back {
        font-size: 3vw;
    }

    .header .centerbox {
        font: normal bold 3vw/3.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-msg img {
        width: 3.8667vw;
    }

    .header .rightbox .help {
        font-size: 4.5vw;
    }

    .header-date,
    .header-menu {
        height: 5.6667vw;
        padding: 0 1.5vw 0 0;
    }

    .header-time {
        font: normal normal 2.7vw/2.7vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-menu span {
        width: 1.2vw;
        height: 1.2vw;
    }

    .header-menu i {
        font-size: 4vw;
    }

    /* 語系 */
    .top_open {
        top: 45px;
        font: normal normal 2vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(文字) */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .p {
        margin: 0.5vw 0;
    }

    h1,
    .h1 {
        font: normal bold 4.4vw/4.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 4vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 3.6vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 2.4vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用按鈕 */
    input.btn_small,
    a.btn_small {
        padding: 3px;
        font: normal normal 16px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        padding: 5px;
        font: normal bold 20px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 10px;
        font: normal bold 24px/28px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_flex {
        width: calc(100% - 3vw);
        padding: 1.5vw;
        font: normal normal 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_inline,
    .col_radio,
    .col_checkbox,
    .col_title,
    .item_title {
        font: normal bold 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_item {
        font: normal normal 2.6vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        padding: 10px 5px;
        font: normal normal 18px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(眼睛) */
    i.fa-eye,
    i.fa-eye-slash {
        font-size: 3vw;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-wrap {
        height: 7.6667vw;
    }

    .tabs-scroll {
        height: 7.6667vw;
    }

    .share-tab {
        font: normal bold 22px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_infobox {
        margin-top: 3.3333vw;
        padding: 1.6667vw;
    }

    .share_infobox .title {
        font-size: 24px;
        padding-bottom: 1.6667vw;
    }

    /* 共用元件(備註、解說、注意事項) */
    .share_tips {
        margin: 3vw auto;
    }

    .share_tips .tips_title {
        height: 8.7333vw;
        font: normal bold 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_title i {
        font-size: 3.5vw;
    }

    .van-collapse-item_content,
    .share_tips .tips_content {
        padding: 2.5vw;
        font: normal normal 2.6vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .share_note {
        padding: 1.5%;
        font: normal bold 2.2vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(下滑資訊) */
    .van-collapse {
        width: 96%;
        margin: 0 auto 2vw;
        padding: 2%;
    }

    .van-cell {
        width: 96%;
        padding: 2%;
        margin: 0;
        font: normal normal 2.4vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_title {
        line-height: 1.6em;
        font-size: 2.4vw;
    }

    .search_detail {
        padding: 2%;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50,
    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        height: 1.8em;
        font: normal normal 2.2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 0.6vw;
        -moz-border-radius: 0.6vw;
        -ms-border-radius: 0.6vw;
        -o-border-radius: 0.6vw;
        border-radius: 0.6vw;
    }

    /* 跳框 */
    .popup_container {
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .popup_in .scroll_box {
        max-height: 300px;
    }

    .popup_title {
        padding: 1vw;
        font: normal bold 3.4vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_tips {
        padding: 0;
        font: normal normal 2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 751px - 900px (iPad, 手機橫放) */
@media screen and (min-width: 751px) and (max-width: 900px) {

    /* 頁首 */
    .has-header {
        padding-top: 5.6667vw;
    }

    .index.has-header {
        padding-top: 2vw;
    }

    .header {
        height: 5.6667vw;
    }

    .header .logo img {
        width: 22.6667vw;
    }

    .header .rightbox .hd-icon img {
        width: 5vw;
    }

    .header .back {
        font-size: 3vw;
    }

    .header .centerbox {
        font: normal bold 3vw/3.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-msg img {
        width: 3.8667vw;
    }

    .header .rightbox .help {
        font-size: 4.5vw;
    }

    .header-date,
    .header-menu {
        height: 5.6667vw;
        padding: 0 1.5vw 0 0;
    }

    .header-time {
        font: normal normal 2.5vw/2.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-menu span {
        width: 1.2vw;
        height: 1.2vw;
    }

    .header-menu i {
        font-size: 4vw;
    }

    /* 語系 */
    .top_open {
        top: 45px;
        font: normal normal 2vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .has-footer {
        padding-bottom: 16.3333vw;
    }

    .footer {
        padding: 2.5% 2% 0 2%;
    }

    .ft-title {
        font: normal normal 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .ft-nav .gif-box,
    .ft-nav .gif-box .ft-home,
    .ft-nav.active .gif-box,
    .ft-nav.active .gif-box .ft-home {
        width: 6.3333vw;
        height: 6.3333vw;
        margin-bottom: 5px;
    }

    .ft-nav:nth-child(3) .ft-home {
        width: 8.3333vw;
        height: 8.3333vw;
    }

    .ft-nav:nth-child(3) img {
        width: 9.6667vw;
    }

    .ft-nav:nth-child(3) .ft-home {
        -webkit-transform: translateY(-3vw);
        -moz-transform: translateY(-3vw);
        -ms-transform: translateY(-3vw);
        -o-transform: translateY(-3vw);
        transform: translateY(-3vw);
    }

    .ft-nav:nth-child(3) .ft-title {
        -webkit-transform: translateY(-2vw);
        -moz-transform: translateY(-2vw);
        -ms-transform: translateY(-2vw);
        -o-transform: translateY(-2vw);
        transform: translateY(-2vw);
    }

    /* 共用元件(文字) */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .p {
        margin: 0.5vw 0;
    }

    h1,
    .h1 {
        font: normal bold 4vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 3.6vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_flex {
        width: calc(100% - 3vw);
        padding: 1.5vw;
        font: normal normal 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_inline,
    .col_radio,
    .col_checkbox,
    .col_title,
    .item_title {
        font: normal bold 2.8vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_item {
        font: normal normal 2.8vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        padding: 7px 5px;
        font: normal normal 18px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(眼睛) */
    i.fa-eye,
    i.fa-eye-slash {
        font-size: 3vw;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-scroll .share-tab-nav:before {
        content: ">";
        position: fixed;
        top: 9vw;
        right: 1%;
        width: 15px;
        height: 15px;
        color: #009bbe;
        font-size: 5vw;
        font-weight: bold;
        z-index: 9;
    }

    .tabs-wrap {
        height: 7.6667vw;
    }

    /* 共用元件(備註、解說、注意事項) */
    .share_tips {
        margin: 3vw auto;
    }

    .share_tips .tips_title {
        height: 8.7333vw;
        font: normal bold 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_title i {
        font-size: 3.5vw;
    }

    .van-collapse-item_content,
    .share_tips .tips_content {
        padding: 2.5vw;
        font: normal normal 2.6vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .share_note {
        padding: 1.5%;
        font: normal bold 2.2vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .arrow_box {
        font: normal bold 2.5vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(下滑資訊) */
    .van-collapse {
        width: 96%;
        margin: 0 auto 2vw;
        padding: 2%;
    }

    .van-cell {
        width: 96%;
        padding: 2%;
        margin: 0;
        font: normal normal 2.4vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_title {
        line-height: 1.6em;
        font-size: 2.4vw;
    }

    .search_detail {
        padding: 2%;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50,
    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        height: 1.8em;
        font: normal normal 2.2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 0.6vw;
        -moz-border-radius: 0.6vw;
        -ms-border-radius: 0.6vw;
        -o-border-radius: 0.6vw;
        border-radius: 0.6vw;
    }

    /* 跳框 */
    .popup_container {
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .popup_in .scroll_box {
        max-height: 300px;
    }

    .popup_title {
        padding: 1vw;
        font: normal bold 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_tips {
        padding: 0;
        font: normal normal 2vw/2.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 671px - 750px (iPad, 手機橫放) */
@media screen and (min-width: 671px) and (max-width: 750px) {

    /* 頁首 */
    .has-header {
        padding-top: 5.6667vw;
    }

    .index.has-header {
        padding-top: 1vw;
    }

    .header {
        height: 5.6667vw;
    }

    .header .logo img {
        width: 21.6667vw;
    }

    .header .rightbox .hd-icon img {
        width: 4.5vw;
    }

    .header .back {
        font-size: 3vw;
    }

    .header .centerbox {
        font: normal bold 3.2vw/3.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-msg img {
        width: 4.8667vw;
    }

    .header .rightbox .help {
        font-size: 4.2vw;
    }

    .header-date,
    .header-menu {
        height: 5.6667vw;
        padding: 0 1.5vw 0 0;
    }

    .header-time {
        font: normal normal 2.5vw/2.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-menu span {
        width: 0.8vw;
        height: 0.8vw;
    }

    .header-menu i {
        font-size: 4vw;
    }

    /* 語系 */
    .top_open {
        top: 40px;
        font: normal normal 2vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .has-footer {
        padding-bottom: 16.3333vw;
    }

    .ft-title {
        font: normal normal 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .ft-nav .gif-box,
    .ft-nav .gif-box .ft-home,
    .ft-nav.active .gif-box,
    .ft-nav.active .gif-box .ft-home {
        width: 6.3333vw;
        height: 6.3333vw;
        margin-bottom: 3px;
    }

    .ft-nav:nth-child(3) .ft-home {
        width: 8.3333vw;
        height: 8.3333vw;
    }

    .ft-nav:nth-child(3) img {
        width: 10.6667vw;
    }

    .ft-nav:nth-child(3) .ft-home {
        -webkit-transform: translateY(-3vw);
        -moz-transform: translateY(-3vw);
        -ms-transform: translateY(-3vw);
        -o-transform: translateY(-3vw);
        transform: translateY(-3vw);
    }

    .ft-nav:nth-child(3) .ft-title {
        -webkit-transform: translateY(-2vw);
        -moz-transform: translateY(-2vw);
        -ms-transform: translateY(-2vw);
        -o-transform: translateY(-2vw);
        transform: translateY(-2vw);
    }

    /* 共用元件(文字) */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .p {
        margin: 0.5vw 0;
    }

    h1,
    .h1 {
        font: normal bold 4vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 3.6vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_flex {
        width: calc(100% - 3vw);
        padding: 1.5vw;
        font: normal normal 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_inline,
    .col_radio,
    .col_checkbox,
    .col_title,
    .item_title {
        font: normal bold 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_item {
        font: normal normal 2.6vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-scroll .share-tab-nav:before {
        content: ">";
        position: fixed;
        top: 10vw;
        right: 1%;
        width: 15px;
        height: 15px;
        color: #009bbe;
        font-size: 5vw;
        font-weight: bold;
        z-index: 9;
    }

    .tabs-wrap {
        height: 7.6667vw;
    }

    /* 共用樣式(條款、註解、文章) */
    .share_note {
        padding: 1.5%;
        font: normal bold 2.8vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .arrow_box {
        font: normal bold 2.8vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(備註、解說、注意事項) */
    .share_tips {
        margin: 3vw auto;
    }

    .share_tips .tips_title {
        height: 8.7333vw;
        font: normal bold 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_title i {
        font-size: 3.5vw;
    }

    .van-collapse-item_content,
    .share_tips .tips_content {
        padding: 2.5vw;
        font: normal normal 2.6vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(下滑資訊) */
    .van-cell {
        font: normal normal 2.8vw/4.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_detail .title_set {
        font: normal normal 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        font: normal normal 2.8vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 1vw;
        -moz-border-radius: 1vw;
        -ms-border-radius: 1vw;
        -o-border-radius: 1vw;
        border-radius: 1vw;
    }

    /* 跳框 */
    .popup_container {
        top: 5%;
    }

    .popup_in .scroll_box {
        max-height: 300px;
    }

    .popup_title {
        padding: 1vw;
        font: normal bold 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_tips {
        padding: 0;
        font: normal normal 2.2vw/2.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 551px - 670px (手機橫放) */
@media screen and (min-width: 551px) and (max-width: 670px) {

    /* 頁首 */
    .has-header {
        padding-top: 5.6667vw;
    }

    .index.has-header {
        padding-top: 0.5vw;
    }

    .header {
        height: 5.6667vw;
    }

    .header .logo img {
        width: 18.6667vw;
    }

    .header .rightbox .hd-icon img {
        width: 5vw;
    }

    .header .back {
        font-size: 3.6vw;
    }

    .header .centerbox {
        font: normal bold 3.6vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-msg img {
        width: 3.8667vw;
    }

    .header .rightbox .help {
        font-size: 4vw;
    }

    .header-date,
    .header-menu {
        height: 5.6667vw;
        padding: 0 1.5vw 0 0;
    }

    .header-menu span {
        width: 1vw;
        height: 1vw;
    }

    .header-menu i {
        font-size: 4vw;
    }

    /* 語系 */
    .top_open {
        font: normal normal 2vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .has-footer {
        padding-bottom: 14.3333vw;
    }

    .ft-title {
        font: normal normal 2.5vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .ft-nav .gif-box,
    .ft-nav .gif-box .ft-home,
    .ft-nav.active .gif-box,
    .ft-nav.active .gif-box .ft-home {
        width: 6.3333vw;
        height: 6.3333vw;
        margin-bottom: 3px;
    }

    .ft-nav:nth-child(3) .ft-home {
        width: 8.3333vw;
        height: 8.3333vw;
    }

    .ft-nav:nth-child(3) img {
        width: 10.6667vw;
    }

    .ft-nav:nth-child(3) .ft-home {
        -webkit-transform: translateY(-3vw);
        -moz-transform: translateY(-3vw);
        -ms-transform: translateY(-3vw);
        -o-transform: translateY(-3vw);
        transform: translateY(-3vw);
    }

    .ft-nav:nth-child(3) .ft-title {
        -webkit-transform: translateY(-2vw);
        -moz-transform: translateY(-2vw);
        -ms-transform: translateY(-2vw);
        -o-transform: translateY(-2vw);
        transform: translateY(-2vw);
    }

    /* 共用元件(文字) */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .p {
        margin: 0.5vw 0;
    }

    h1,
    .h1 {
        font: normal bold 4.4vw/4.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 4vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 3.6vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用按鈕 */
    input.btn_big,
    a.btn_big {
        font: normal bold 17px/19px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 7px;
        font: normal bold 22px/26px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_title,
    .col_item {
        font: normal bold 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_inline,
    .col_radio,
    .col_checkbox {
        font: normal bold 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        font: normal normal 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    } */
    .item_title {
        font: normal bold 2.8vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .col_flex {
        font: normal normal 2.5vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(眼睛) */
    i.fa-eye,
    i.fa-eye-slash {
        font-size: 3vw;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-scroll .share-tab-nav:before {
        content: ">";
        position: fixed;
        top: 9vw;
        right: 1%;
        width: 15px;
        height: 15px;
        color: #009bbe;
        font-size: 5vw;
        font-weight: bold;
        z-index: 9;
    }

    .tabs-wrap {
        height: 7.6667vw;
    }

    .mag_text h5 {
        font: normal bold 17px/19px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_content textarea {
        font: normal normal 17px/21px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(備註、解說、注意事項) */
    .share_tips {
        margin: 3vw auto;
    }

    .share_tips .tips_title {
        height: 8.7333vw;
        font: normal bold 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_title i {
        font-size: 3.5vw;
    }

    .van-collapse-item_content,
    .share_tips .tips_content {
        padding: 2.5vw;
        font: normal normal 2.6vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .share_note {
        padding: 1.5%;
        font: normal bold 3.2vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .arrow_box {
        font: normal bold 3.2vw/1.3 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(下滑資訊) */
    .van-cell {
        font: normal normal 2.6vw/3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_detail .title_set {
        font: normal normal 2.6vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        font: normal normal 2.8vw/2.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 1vw;
        -moz-border-radius: 1vw;
        -ms-border-radius: 1vw;
        -o-border-radius: 1vw;
        border-radius: 1vw;
    }

    /* 跳框 */
    .popup_container {
        top: 5%;
    }

    .popup_in .scroll_box {
        max-height: 300px;
    }

    .popup_title {
        padding: 1vw;
        font: normal bold 3.2vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_tips {
        padding: 0;
        font: normal normal 2.4vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 401px - 550px (iPhone 6+) */
@media screen and (min-width: 401px) and (max-width: 550px) {

    /* 頁首 */
    .has-header {
        padding-top: 7.6667vw;
    }

    .index.has-header {
        padding-top: 1.6667vw;
    }

    .header {
        height: 7.6667vw;
    }

    .top_open {
        font: normal normal 3.4vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .ft-title {
        font: normal normal 3.6vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(文字) */
    h1,
    .h1 {
        font: normal bold 5vw/5.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 4.6vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 4.2vw/4.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 3.8vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 3.4vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 3vw/3.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 3.2vw/3.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用按鈕 */
    input.btn_small,
    a.btn_small {
        padding: 2px;
        font: normal normal 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        padding: 3px;
        font: normal bold 16px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 5px;
        font: normal bold 20px/24px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_radio,
    .col_checkbox {
        margin-right: 5px;
        margin-bottom: 5px;
        font: normal bold 15px/17px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        font: normal normal 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-wrap {
        height: 10.6667vw;
    }

    .item_title,
    .share-tab {
        font: normal bold 17px/19px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .remaining_text {
        font: normal normal 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tip h5,
    .share-tip p,
    .share-tip div,
    .share-tip li {
        font: normal normal 15px/19px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .tabs-scroll .share-tab-nav {
        min-width: 600px;
    }

    .tabs-scroll .share-tab-nav:before {
        content: ">";
        position: fixed;
        top: 11vw;
        right: 1%;
        width: 15px;
        height: 15px;
        color: #009bbe;
        font-size: 5vw;
        font-weight: bold;
        z-index: 9;
    }

    .mag_text h5 {
        font: normal bold 16px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_content textarea {
        font: normal normal 16px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(備註、解說、注意事項) */
    .share_tips {
        margin: 3vw auto;
    }

    .share_tips .tips_title {
        height: 8.7333vw;
        font: normal bold 3.5vw/3.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_title i {
        font-size: 3.5vw;
    }

    .van-collapse-item_content,
    .share_tips .tips_content {
        padding: 2.5vw;
    }

    /* 共用元件(轉圈圈-讀取動畫) */
    .reflash {
        font-size: 25px;
    }

    /* 幫助中心 */
    .van-cell {
        font: normal normal 3.6vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .van-collapse-item_content {
        font: normal normal 3vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header .centerbox {
        font: normal bold 4vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_content {
        font: normal normal 3.2vw/4.3vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_title {
        font: normal normal 17px/19px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .title_set {
        font: normal normal 3.2vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        height: 2.2em;
        font: normal normal 3.2vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 1.6vw;
        -moz-border-radius: 1.6vw;
        -ms-border-radius: 1.6vw;
        -o-border-radius: 1.6vw;
        border-radius: 1.6vw;
    }

    /* 共用樣式(條款、註解、文章) */
    .share_note {
        font: normal bold 4vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .arrow_box {
        font: normal bold 4vw/1.2 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 產品訊息 */
    .share_infobox .title {
        font-size: 16px;
    }

    .share_explain {
        font: normal 16px/24px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_container {
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .popup_in .scroll_box {
        max-height: 300px;
    }

    .popup_close {
        top: 8px;
    }

    .popup_title {
        padding: 1.5vw;
    }

    .popup_tips {
        padding: 0;
        font: normal normal 2.4vw/2.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 401px - 414px (iPhone 5,iPhone 6,Galaxy S5) */
@media screen and (min-width: 401px) and (max-width: 414px) {

    /* 頁首 */
    .has-header {
        padding-top: 8.6667vw;
    }

    .index.has-header {
        padding-top: 0.6667vw;
    }

    .header {
        height: 8.6667vw;
    }

    .header .back img {
        height: 25px;
    }

    /* 共用元件(文字) */
    h1,
    .h1 {
        font: normal bold 5.4vw/5.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h2,
    .h2 {
        font: normal bold 5vw/5.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h3,
    .h3 {
        font: normal bold 4.6vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h4,
    .h4 {
        font: normal bold 4.2vw/4.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h5,
    .h5 {
        font: normal bold 3.8vw/4.2vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    h6,
    .h6 {
        font: normal bold 3.4vw/3.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    p,
    .p {
        font: normal normal 3.6vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .item_title,
    .share-tab {
        font: normal bold 16px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .mag_text h5 {
        font: normal bold 15px/17px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_content textarea {
        font: normal normal 15px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tab.active:after {
        height: 3px;
    }

    /* 搜尋列 */
    .search_title {
        font: normal normal 16px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 產品訊息 */
    .share_infobox .title {
        font-size: 14px;
    }

    .share_explain {
        font: normal 13px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_close {
        top: 5px;
        font: normal bold 20px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_title {
        padding: 1.5vw;
        font: normal bold 4.6vw/4.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度介於 321px - 400px (iPhone 5,iPhone 6,Galaxy S5) */
@media screen and (min-width: 321px) and (max-width: 400px) {

    /* 頁首 */
    .has-header {
        padding-top: 9.6667vw;
    }

    .index.has-header {
        padding-top: 0.1vw;
    }

    .header {
        height: 9.6667vw;
    }

    .header-date,
    .header-menu {
        height: 9.6667vw;
    }

    .top_open {
        top: 25px;
        padding: 5px;
        min-width: 175px;
        font: normal normal 4vw/4.4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header .back img {
        height: 25px;
    }

    /* 共用元件(文字) */
    p,
    .p {
        font: normal normal 4.2vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .footer {
        height: 20.3vw;
    }

    .ft-title {
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用按鈕 */
    input.btn_small,
    a.btn_small {
        padding: 3px;
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        padding: 4px;
        font: normal bold 16px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 5px;
        font: normal bold 20px/24px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        padding: 3px;
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    select.select100 {
        width: calc(100% - 4px);
    }

    /* 共用樣式 */
    .col_radio,
    .col_checkbox {
        margin-right: 5px;
        margin-bottom: 5px;
    }

    .col_inline,
    .col_radio,
    .col_checkbox {
        font: normal bold 4vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .item_title,
    .share-tab {
        font: normal bold 15px/17px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .remaining_text {
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tip h5,
    .share-tip p,
    .share-tip div,
    .share-tip li {
        font: normal normal 15px/19px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tab.active:after {
        height: 3px;
    }

    .tabs-scroll .share-tab-nav {
        min-width: 500px;
    }

    .tabs-scroll .share-tab-nav:before {
        content: ">";
        position: fixed;
        top: 12vw;
        right: 1%;
        width: 15px;
        height: 15px;
        color: #009bbe;
        font-size: 5vw;
        font-weight: bold;
        z-index: 9;
    }

    .mag_text h5 {
        font: normal bold 15px/17px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_content textarea {
        width: 93%;
        height: 48.6667vw;
        margin: 10px auto;
        padding: 10px;
        font: normal normal 15px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .arrow_box {
        font: normal normal 17px/17px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner dt,
    .share_note_inner .list_title {
        font: normal bold 16px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner {
        font: normal normal 15px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(轉圈圈-讀取動畫) */
    .reflash {
        font-size: 20px;
    }

    /* 共用元件(眼睛) */
    i.fa-eye,
    i.fa-eye-slash {
        font-size: 4.5vw;
    }

    /* 幫助中心 */
    .van-cell {
        font: normal normal 4.8vw/5.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .van-collapse-item_content {
        font: normal normal 4.6vw/1.5 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_content {
        font: normal normal 4.6vw/5.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_title {
        font: normal normal 16px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .title_set {
        font: normal normal 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        height: 2.8em;
        font: normal normal 3.5vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 1.6vw;
        -moz-border-radius: 1.6vw;
        -ms-border-radius: 1.6vw;
        -o-border-radius: 1.6vw;
        border-radius: 1.6vw;
    }

    /* 產品訊息 */
    .share_infobox .title {
        font-size: 15px;
    }

    .share_explain {
        font: normal 14px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 使用條款 */
    .share_note {
        font: normal bold 16px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_container {
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .popup_in .scroll_box {
        max-height: 300px;
    }

    .popup_title {
        padding: 3vw;
        font: normal bold 5vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_close {
        font: normal bold 16px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度小於 320px */
@media screen and (max-width: 320px) {

    /* 頁首 */
    .has-header {
        padding-top: 9.6667vw;
    }

    .index.has-header {
        padding-top: 0;
    }

    .top_open {
        top: 25px;
        padding: 5px;
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header .back img {
        height: 25px;
    }

    /* 共用元件(文字) */
    p,
    .p {
        font: normal normal 4.8vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 頁尾 */
    .footer {
        height: 20.3vw;
    }

    .ft-title {
        font: normal normal 12px/12px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式 */
    .col_radio,
    .col_checkbox {
        margin-right: 5px;
        margin-bottom: 5px;
        font: normal bold 4.5vw/4.5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .item_title,
    .share-tab {
        font: normal bold 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .remaining_text {
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tip h5,
    .share-tip p,
    .share-tip div,
    .share-tip li {
        font: normal normal 15px/19px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share-tab.active:after {
        height: 3px;
    }

    input.input20,
    input.input33,
    input.input50,
    input.input100,
    select.select33,
    select.select50,
    select.select100 {
        padding: 3px;
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用按鈕 */
    input.btn_small,
    a.btn_small {
        padding: 2px;
        font: normal normal 13px/13px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_big,
    a.btn_big {
        padding: 3px;
        font: normal bold 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    input.btn_superbig,
    a.btn_superbig {
        padding: 5px;
        font: normal bold 18px/22px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .tabs-wrap {
        height: 16.6667vw;
    }

    .tabs-scroll .share-tab-nav {
        min-width: 400px;
    }

    .tabs-scroll .share-tab-nav:before {
        content: ">";
        position: fixed;
        top: 13.3vw;
        right: 1%;
        width: 15px;
        height: 15px;
        color: #009bbe;
        font-size: 7vw;
        font-weight: bold;
        z-index: 9;
    }

    .mag_text h5 {
        font: normal bold 14px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_content textarea {
        width: 93%;
        height: 48.6667vw;
        margin: 10px auto;
        padding: 10px;
        font: normal normal 14px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(條款、註解、文章) */
    .arrow_box {
        font: normal normal 16px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner dt,
    .share_note_inner .list_title {
        font: normal bold 16px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_note_inner {
        font: normal normal 15px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用元件(轉圈圈-讀取動畫) */
    .reflash {
        font-size: 20px;
    }

    /* 共用元件(眼睛) */
    i.fa-eye,
    i.fa-eye-slash {
        font-size: 4.5vw;
    }

    /* 幫助中心 */
    .van-cell {
        font: normal normal 4.8vw/5.6vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .van-collapse-item_content {
        font: normal normal 4.6vw/1.5 "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .share_tips .tips_content {
        font: normal normal 4.6vw/5.8vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 搜尋列 */
    .search_title {
        padding: 3px;
        font: normal normal 15px/17px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .search_detail .title_set {
        font: normal normal 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif
    }

    .search_detail .select_set_w100,
    .search_detail .select_date .input_date50 {
        height: 2.8em;
        font: normal normal 3.5vw/4vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
        -webkit-border-radius: 1.6vw;
        -moz-border-radius: 1.6vw;
        -ms-border-radius: 1.6vw;
        -o-border-radius: 1.6vw;
        border-radius: 1.6vw;
    }

    /* 產品訊息 */
    .tabs-scroll {
        height: 14.6667vw;
    }

    .share_infobox .title {
        font-size: 15px;
    }

    .share_explain {
        font: normal 14px/18px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 投注資訊 */
    .header .centerbox {
        font: normal bold 16px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .header-date,
    .header-menu {
        height: 10.6667vw;
    }

    .header-time {
        font: normal normal 13px/13px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 會員中心 */
    .header-msg img {
        width: 25px;
    }

    /* 使用條款 */
    .share_note {
        font: normal bold 15px/15px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 跳框 */
    .popup_container {
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .popup_in .scroll_box {
        max-height: 300px;
    }

    .popup_title {
        padding: 3vw;
        font: normal bold 5vw/5vw "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_close {
        font: normal bold 14px/14px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .popup_in {
        width: calc(100% - 20px);
        padding: 10px;
        font: normal normal 14px/16px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    .btn_box {
        margin: 5px 0;
        padding: 10px 0 0 0;
    }
}

/* 寬度小於 280px */
@media screen and (max-width: 280px) {

    input.btn_small,
    a.btn_small {
        font: normal normal 0.75rem/0.8rem "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }
}

/* 寬度小於 240px */
@media screen and (max-width: 240px) {

    /* 首頁 */
    .ft-title {
        font: normal normal 11px/11px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 共用樣式(頁籤、分頁) */
    .share_content textarea {
        height: 42.6667vw;
        margin: 5px auto 0;
        padding: 5px;
        font: normal normal 14px/20px "Century Gothic", Arial, "Microsoft JhengHei", PMingLiU, sans-serif;
    }

    /* 會員中心 */
    .header-msg img {
        width: 20px;
    }
}