@charset "UTF-8";
/*********** 跳框共用 ***********/
.popup_blackbg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .4);
    overflow: auto;
    z-index: 20;
}
div#WinAlertBox {
    z-index: 21;
}
.popup_close {
    position: absolute;
    right: -15px;
    top: -15px;
    width: 14px;
    padding: 8px 12px;
    color: #fff;
    font: normal bold 1.2rem/1.2rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background-color: #787878;
    border: 3px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
}
.share_popupbox {
    position: absolute;
    top: 50%;
    width: 100%;
    z-index: 20;
}
.share_popup_s,
.share_popup_m,
.share_popup_l {
    margin: 0 auto;
    background: #fff;
}
.share_popup_s {
    width: 30%;
    min-width: 500px;
}
.share_popup_m {
    width: 40%;
    min-width: 750px;
}
.share_popup_l {
    width: 65%;
    min-width: 1000px;
}
.share_popup_header {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    padding: .5rem;
    color: #5f7888;
    font: normal bold 1.5rem/1.5rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background-color: #e1f4ff;
}
.share_popup_header span {
    margin-left: 5px;
}
.popup_sharebox {
    padding: 2rem;
}
.popup_share_title {
    padding: 0 1.5rem 1.5rem 1.5rem;
    font: normal normal 1.2rem/1.5rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.popup_toptab {
    display: flex;
    font: normal normal 1rem/1rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.popup_tabname {
    /*width: 110px;*/
    padding: 20px;
    color: #58839e;
    text-align: center;
    background: #e1f3ff;
}
.popup_tabname.selected {
    color: #222;
    background: #f5fbff;
}
.popup_tabname:hover {
    color: #444;
}
.popup_sharebox .scroll_box {
    max-height: 400px;
    margin: 0 auto;
    overflow-x: hidden;
    overflow-y: auto;
}
.ticon_accept {
    background: url(../images/member/ticon_accept.png?2023102401) no-repeat;
    height: 12px;
}
.ticon_error {
    background: url(../images/member/ticon_error.png?2023102401) no-repeat;
    height: 12px;
}
.ticon_warning {
    background: url(../images/member/ticon_warning.png?2023102401) no-repeat;
    height: 12px;
}
.ticon_problem {
    background: url(../images/member/ticon_problem.png?2023102401) no-repeat;
    height: 12px;
}
.tips_img {
    display: inline-block;
    width: 12px;
    vertical-align: middle;
}
/*********** 跳視窗(共用) ***********/
.share_menu {
    height: 464px;
    padding: 20px;
    background-color: #f5fbff;
    overflow-x: hidden;
    overflow-y: auto;
}
.share_note_inner dt,
.share_note_inner .list_title {
    margin: .5em 0;
    color: #5c7597;
    font: normal bold 1.2rem/1.4rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.share_note_inner {
    min-height: 440px;
    padding: .5em 1em 1em;
    text-align: justify;
    font: normal normal 1rem/1.4rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.share_note_inner ul,
.share_note_inner ol {
    width: 92%;
    padding: .3em 1em;
    margin: 0 auto;
    list-style-type: decimal;
}
.share_note_inner ul {
    list-style-type: square;
}
.share_note_inner li {
    margin-bottom: 10px;
}
.share_note_inner li:last-of-type {
    margin-bottom: 0;
}
/* 讀取中 */
.popup_loadingbg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.46);
    overflow: auto;
    z-index: 111131;
}
.popup_loading {
    position: fixed;
    width: 100%;
    left: 45%;
    top: 40%;
    transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    z-index: 111121;
}
.loader1 {
    position: relative;
    top: 38%;
    width: 40px;
    height: 40px;
    margin: 0 auto;
    -webkit-animation:spin 1.5s linear infinite;
    -moz-animation:spin 1.5s linear infinite;
    z-index: 111141;
}
.loader1 i {
    position:absolute;
    display: block;
    width: 40px;
    height: 40px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}
.loader1 i:before, .loader1 i:after {
    content: '';
    display: block;
    position: absolute;
    width: inherit;
    height: inherit;
    border-radius: inherit;
}
.loader1 i:first-child:before {
    background: #3495dd;
    -webkit-animation: rotate-top-left 1.5s linear infinite;
    -moz-animation: rotate-top-left 1.5s linear infinite;
}
.loader1 i:first-child:after {
    background:#e1492c;
    -webkit-animation: rotate-top-right 1.5s linear infinite;
    -moz-animation: rotate-top-right 1.5s linear infinite;
}
.loader1 i:last-child:before {
    background:#f9ce2b;
    -webkit-animation: rotate-bottom-left 1.5s linear infinite;
    -moz-animation: rotate-bottom-left 1.5s linear infinite;
}
.loader1 i:last-child:after {
    background:#009975;
    -webkit-animation: rotate-bottom-right 1.5s linear infinite;
    -moz-animation: rotate-bottom-right 1.5s linear infinite;
}
.loader_text {
    position: relative;
    top: 41%;
    color: #fff;
    font-size: 1.4em;
    font-weight: bold;
    text-align: center;
    text-shadow: #000 1px 1px 5px;
    width: 100%;
    z-index: 10030;
}
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(-180deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
    }
}
@-webkit-keyframes rotate-top-right {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(-180deg);
        -webkit-transform-origin: 20% 20%;
    }
    100% {
        -webkit-transform: rotate(-360deg);
    }
}
@-webkit-keyframes rotate-top-left {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
        -webkit-transform-origin: 80% 20%;
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}
@-webkit-keyframes rotate-bottom-right {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(-180deg);
        -webkit-transform-origin: 80% 80%;
    }
    100% {
        -webkit-transform: rotate(-360deg);
    }
}
@-webkit-keyframes rotate-bottom-left {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
        -webkit-transform-origin: 20% 80%;
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes spin {
    0% {
        -moz-transform: rotate(0deg);
    }
    50% {
        -moz-transform: rotate(-180deg);
    }
    100% {
        -moz-transform:rotate(-360deg);
    }
}
@-moz-keyframes rotate-top-right {
    0% {
        -moz-transform: rotate(0deg);
    }
    50% {
        -moz-transform: rotate(-180deg);
        -moz-transform-origin: 20% 20%;
    }
    100% {
        -moz-transform: rotate(-360deg);
    }
}
@-moz-keyframes rotate-top-left {
    0% {
        -moz-transform: rotate(0deg);
    }
    50% {
        -moz-transform: rotate(180deg);
        -moz-transform-origin: 80% 20%;
    }
    100% {
        -moz-transform: rotate(360deg);
    }
}
@-moz-keyframes rotate-bottom-right {
    0% {
        -moz-transform: rotate(0deg);
    }
    50% {
        -moz-transform: rotate(-180deg);
        -moz-transform-origin: 80% 80%;
    }
    100% {
        -moz-transform: rotate(-360deg);
    }
}
@-moz-keyframes rotate-bottom-left {
    0% {
        -moz-transform: rotate(0deg);
    }
    50% {
        -moz-transform: rotate(180deg);
        -moz-transform-origin: 20% 80%;
    }
    100% {
        -moz-transform: rotate(360deg);
    }
}
/*********** 跳視窗-幫助中心 ***********/
.help_menu .help_link {
    display: inline-block;
    color: #0074d9;
}
.help_menu .help_link:hover,
.help_menu .help_link:focus,
.help_menu .help_link:active {
    color: #f00;
}
.help_menu .tv_icon1 {
    display: inline-block;
    width: 50px;
    /* height: 57px;
    background: url(../images/help/tv_icon.jpg?230726) no-repeat;
    background-size: 100% auto; */
}
.help_menu .tv_icon2 {
    width: 350px;
    /* height: 235px;
    background: url(../images/help/teamviewer.jpg?230726) no-repeat;
    background-size: 100% auto; */
}
.share_btnbox {
    padding: 10px;
    margin-bottom: 20px;
    background-color: #eaeaea;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}
/*********** 跳視窗-產品信息 ***********/
.share_menu.pd_menu {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
}
.pd_box,
.pd_box50 {
    margin: 0 15px 10px 0;
    background: #fff;
    border: 1px solid #f8fff9;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    vertical-align: top;
}
.pd_box {
    width: 100%;
}
.pd_box50,
.pd_set50 {
    display: inline-block;
    width: 48%;
}
.pd_title {
    width: 100%;
    line-height: 34px;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #5583a1;
    background: #b9dcf2;
    border-top: 1px solid #b9dcf2;
    -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;
}
.pd_img {
    display: flex;
    justify-content: space-between;
    width: 90%;
    max-height: 300px;
    text-align: center;
    margin: 15px auto;
}
.pd_img img {
    width: 100%;
    height: 220px;
    margin: 0 10px;
    overflow: hidden;
}
.pd_group {
    display: flex;
    padding: 1.5rem 1.5rem 0 1.5rem;
    font: normal normal .95rem/1.1rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.pd_set,
.pd_set50 {
    display: flex;
    align-items: flex-start;
    justify-content: space-around;
    margin: 0 auto 1.5rem;
    text-align: justify;
}
.pd_group dd {
    margin-left: 10px;
}
.pd_item {
    margin-top: 1.5rem;
}
.pd_group div {
    margin-bottom: 1.5rem;
}
.pd_group div:last-of-type {
    margin-bottom: 0;
}
/*********** 跳視窗-個人訊息 ***********/
.share_menu.msg_menu {
    height: 437px;
}
.msg_title_set {
    padding: 10px 0;
}
.msg_title_set .msg_text {
    display: inline-block;
    color: #555;
    font-size: 17px;
    text-align: center;
}
.msg_title_set .cell1,
.msg_list .title_left {
    width: 9%;
    text-align: center;
}
.msg_title_set .cell2,
.msg_list .title_center {
    width: 18%;
}
.msg_title_set .cell3,
.msg_list .title_right {
    width: 72%;
}
.msg_list .title_right,
.r-msgtitle {
    display: flex;
    align-items: center;
}
.r-msgtitle {
    width: 100%;
}
.r-msgtext,
.news_title {
    width: 90%;
    font: normal bold 1rem/1rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.msg_info_set,
.news_info_set {
    color: #666;
    background-color: #fff;
    cursor: pointer;
}
.msg_title_set,
.msg_info_set,
.news_info_set {
    border-top: 1px solid #eee;
}
.news_list,
.msg_list {
    display: flex;
    align-items: center;
    height: 2.5rem;
    background: #f8f8f8;
    border-bottom: 1px solid #eee;
}
.no_msg,
.no_news {
    font-size: 16px;
    text-align: center;
    padding: 10px 0;
    background: #F2F9FE;
}
.no_read {
    display: inline-block;
    width: 40px;
    padding: 3px;
    margin: 0 5px 0 0;
    text-align: center;
    color: #fff;
    font: normal normal .85rem/.85rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background: #d91f48;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}
/*********** 跳視窗-線上留言 ***********/
.popup-onlinemsg .share_menu {
    height: 514px;
}
.mag_text h5 {
    text-align: center;
}
.mag_text textarea {
    width: 96%;
    height: 20rem;
    margin: 0 auto;
    padding: 2%;
    color: #666;
    font: normal normal 1rem/1.2rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background: #fff;
    border: 1px solid #eee;
    outline: none;
    resize: none;
}
.mag_btn {
    margin: 20px auto 0;
    text-align: center;
}
/*********** 跳視窗-最新消息 ***********/
.share_menu.news_menu {
    height: 514px;
}
.news_title_left {
    width: 12%;
    padding: 0 10px 0 0;
    text-align: center;
}
.news_title_center {
    width: 20%;
}
.news_title_right {
    width: 67%;
    display: flex;
    justify-content: space-between;
}
.news_title_right i {
    padding-right: 5px;
}
.news_type {
    display: inline-block;
    min-width: 50px;
    padding: 5px;
    color: #fff;
    font: normal normal .85rem/1rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    vertical-align: middle;
}
.news_container,
.msg_container {
    padding: 15px;
    font: normal normal 1rem/1.3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background-color: #fff;
}
/*********** 跳框-投訴箱 ***********/
.complain_form {
    padding: 2.1875rem 1.5625rem;
    background: #D2E5F1;
}
.complain_title {
    padding: 0 20px 20px 20px;
    text-align: justify;
    font: normal normal 1.2rem/1.4rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.complain_box {
    padding: 20px;
    background-color: #F2F9FE;
}
.complain_list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin: 0 0 20px 0;
}
.complain_list:last-child {
    margin: 0;
}
.complain_tip {
    width: 90%;
    margin: 0 auto 10px;
}
.complain_item {
    width: 25%;
    margin: 0 10px 0 0;
    text-align: right;
}
.complain_input,
.complain_select {
    width: 60%;
}
.comment_textarea {
    margin: 0;
    align-items: flex-start;
}
.popup-complain textarea {
    width: 96%;
    height: 5.6rem;
    margin: 0 auto;
    padding: 0.5rem;
    color: #666;
    background: #fff;
    border: 1px solid #eee;
    outline: none;
    resize: none;
}
/*********** 跳框-會員註冊 ***********/
.reg_captcha {
    display: flex;
    justify-content: flex-end;
}
.reg_captcha .btn50 {
    margin: 0 0 0 5px;
}
.check_code {
    display: flex;
    align-items: center;
    /* justify-content: flex-end; */
}
.check_code .input33 {
    width: 36%;
}
.check_code .reg_input {
    width: 55%;
}
.RegNumber {
    width: 90px;
    height: 35px;
    padding-left: 3px;
}
.popup_logo {
    height: 40px;
}
/*********** 跳框-未讀信件 ***********/
.mail_item {
    padding: 0 5px;
    color: #f22;
    font: normal bold 1.2rem/1.2rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
/*********** 跳框-快速轉帳 ***********/
.transfast_points {
    display: flex;
    flex-direction: row;
    width: calc(100% - 15px);
    padding: 5px;
    color: #666;
    font: normal normal 1rem/1rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background-color: #fff;
    border: 1px solid #eee;
    vertical-align: middle;
}
.points_left,
.points_right {
    display: inline-block;
    width: 48.5%;
    padding-bottom: 5%;
    vertical-align: top;
}
.money_set {
    height: 45px;
    line-height: 45px;
    background-color: #d5d5d5;
    border-radius: 3px;
    text-align: center;
    color: #00ae08;
    font-size: 1.2em;
}
/*********** 跳框-最新消息 ***********/
.flash_icon {
    max-width: 50px;
}
.flash_msg {
    width: calc(100% - 55px);
    margin-left: 5px;
}
.popup-flash-detail .flash_msg {
    width: calc(100% - 5px);
}
.popup-flash .flash_msg {
    width: 80%;
}
.flash_title {
    margin-bottom: 3px;
    color: #666;
    font: normal bold 1rem/1rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.flash_text {
    color: #aaa;
    font: normal normal .85rem/1rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.flash_box {
    padding: 5px;
    margin-bottom: 5px;
    cursor: pointer;
}
.flash_box.line {
    border-bottom: 1px solid #ccc;
}
.flash_box.line:last-of-type {
    border-bottom: 0;
}
.flash_box.line:first-of-type {
    border-bottom: 1px solid #ccc;
}
.flash_detail {
    padding: 1rem;
    color: #666;
    font: normal normal .95rem/1.2rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
/*********** 客服中心 ***********/
.service_header {
    display: flex;
    align-items: center;
    padding: 8px 0 8px 35px;
    font: normal bold 1.5rem/1.7rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    color: #fff;
    background: linear-gradient(180deg, #86b7ff 0, #bbd6ff 100%);
}
.service_center {
    /*height: 580px;*/
    padding: 0 0 20px 0;
    background: url(../images/index/winbet-chat-bg1.png?230726) no-repeat #fff;
    background-size: 100% auto;
    overflow-y: auto;
}
.on_service_logo {
    width: 130px;
    margin: 0 10px 0 0;
}
.on_service_title {
    color: #266686;
    margin: 15px 0;
    font: normal bold 1.3rem/1.3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.service_box_1 {
    width: 40.5rem;
    padding: 20px;
    margin: 1rem auto;
    box-shadow: 0 6px 6px 0 rgba(166, 201, 255, .25);
    background: linear-gradient(180deg, #F2F7FF 0, #FFF 100%), linear-gradient(0deg, #FFF, #FFF);
}
.sb_girls_item {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 30px 0 0;
}
.sb_girls_grounp {
    display: flex;
    align-items: center;
    justify-content: center;
}
.service_girls1,
.service_girls2,
.service_girls3 {
    width: 100px;
    margin-bottom: 10px;
}
.service_box_2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40rem;
    margin: 1.5rem auto;
}
.more_service {
    width: 12rem;
    border: 1px solid #578fe2;
    -webkit-border-radius: 0 0 .5rem .5rem;
    -moz-border-radius: 0 0 .5rem .5rem;
    -ms-border-radius: 0 0 .5rem .5rem;
    -o-border-radius: 0 0 .5rem .5rem;
    border-radius: 0 0 .5rem .5rem;
}
.more_service_title {
    position: relative;
    padding: 5px 0 5px 20px;
    text-align: left;
    color: #fff;
    font: normal bold 1.2rem/1.3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background: linear-gradient(90deg, #3c7bd8 0, #7eabf1 100%);
}
.more_service_title:after {
    content: "";
    position: absolute;
    left: 8px;
    top: 5px;
    width: 5px;
    height: 20px;
    background: #fff;
}
.more_service_pic {
    width: 10rem;
    height: 10rem;
    margin: 15px auto;
    background: #D9D9D9;
}
.more_service_pic img {
    width: inherit;
    height: inherit;
}
.return_service_box {
    width: 90%;
    margin: auto;
}
.reply_service_title {
    position: relative;
    width: 39.5rem;
    padding: 10px 0 10px 30px;
    margin: 1.5rem auto .5rem;
    font: normal normal 1.25rem/1.3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    color: #666;
    background: #EBF3FF;
}
.reply_service_title:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 1rem;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    background: linear-gradient(90deg, #2B67FE 0, #5E8AFF 100%);
}
.reply_service_info {
    width: 39.5rem;
    margin: 1rem auto;
}
.reply_service_info .title {
    text-align: left;
    font: normal normal 1.2rem/1.4rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
/*********** APP下載 ***********/
.app_main {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2rem auto;
}
.app_pic {
    width: 40%;
    margin: 0 1rem 0 0;
    text-align: center;
}
.app_pic img {
    width: 80%;
}
.qr_title {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    margin: 1rem auto;
    font: normal normal 1.3rem/1.5rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    background: linear-gradient(33deg, #f3f3f3 0, rgba(255,255,255,0) 100%);
}
.qr_title img {
    width: 200px;
    margin-bottom: 10px;
}
.qr_app {
    display: inline-block;
    margin: 0 60px 0 0;
}
.qr_app_and {
    margin: 0;
}
.qr_store {
    width: 12rem;
}
.qr_pic {
    width: 12rem;
    height: 12rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px;
    background: #efefef;
}
.qr_ios,
.qr_android {
    width: 11rem;
}
.qr_ios canvas,
.qr_android canvas {
    width: 11rem;
}
/*********** APP下載-安裝指引 ***********/
.app_bg {
    width: 100%;
}
.appbox_ios,
.appbox_android {
    margin: auto;
    text-align: center;
    z-index: 4;
}
.btn_app,
input.btn_app,
a.btn_app {
    position: absolute;
    top: 16%;
    left: 5%;
    width: 90%;
    margin: auto;
    text-align: center;
    z-index: 5;
}
.appbox_ios .btn_app {
    top: 5.5%;
    left: 28%;
    width: 20%;
}
.appbox_ios .btn_app,
.appbox_android .btn_app {
    padding: 0 1rem;
    font: normal bold 1.2rem/2rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
}
.appbox_ios .setup,
.appbox_android .setup {
    position: absolute;
    padding: 0 2rem;
    color: #fdac12;
    font: normal bold 1.2rem/2rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    border: 1px solid #fdac12;
    cursor: pointer;
    z-index: 5;
}
.appbox_ios .setup {
    top: 5.5%;
    right: 5%;
}
.appbox_android .setup {
    top: 3%;
    right: 1rem;
}

/*********  以下為 手機畫面_設定  *********/
/* 寬度大於 1024px (電腦)*/
@media screen and (min-width: 1024px) {
    /* 跳框-共用 */
    .share_popupbox {
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    /* App下載 */
    .appbox_ios .setup,
    .appbox_android .setup {
        padding: .5rem 2rem;
        font: normal bold 2rem/2.5rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
    .appbox_ios .btn_app,
    .appbox_android .btn_app {
        padding: .5rem 2rem;
        font: normal normal 2.5rem/3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}

/* 寬度大於 1920px (電腦)*/
@media screen and (min-width: 1920px) {
    .share_popup_s {
        width: 25.5%;
        min-width: 430px;
    }
}

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

/* 寬度介於 1024px - 1300px (ipad) */
@media screen and (min-width: 1024px) and (max-width: 1300px) {
    /* 跳框-共用 */
    .share_popup_s {
        min-width: 450px;
    }
    /* 跳框-最新公告 */
    .flash_icon {
        max-width: 30px;
    }
    /* App下載 */
    .appbox_ios .btn_app,
    .appbox_android .btn_app {
        padding: .5rem 2rem;
        font: normal normal 2rem/2.5rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}

/* 寬度小於 1023px (平板+手機)*/
@media screen and (max-width: 1023px) {
    /* 跳框-共用 */
    .share_popupbox {
        top: 5%;
    }
    .share_popup_m {
        min-width: 400px;
    }
    .share_popup_m {
        min-width: 550px;
    }
    .share_popup_l {
        min-width: 700px;
    }
    .share_popup_header {
        height: 25px;
    }
    .popup_sharebox {
        padding: 1.5rem;
    }
    /* App下載 */
    .appbox_ios .btn_app,
    .appbox_ios .setup,
    .appbox_android .btn_app,
    .appbox_android .setup {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
        border-radius: 5px;
    }
}

/* 寬度介於 901px - 1023px (ipad) */
@media screen and (min-width: 901px) and (max-width: 1023px) {
    /* App下載 */
    .appbox_ios .btn_app,
    .appbox_android .btn_app {
        font: normal bold 1.8rem/3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}

/* 寬度介於 751px - 900px (iPad, 手機橫放) */
@media screen and (min-width: 751px) and (max-width: 900px) {
    /* 最新公告 */
    .flash_icon {
        max-width: 40px;
    }
    /* App下載 */
    .appbox_ios .btn_app,
    .appbox_android .btn_app {
        font: normal bold 1.8rem/3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}

/* 寬度介於 671px - 750px (iPad, 手機橫放) */
@media screen and (min-width: 671px) and (max-width: 750px) {
    /* 跳框-共用 */
    .share_popupbox {
        top: 0;
    }
    .share_popup_s {
        min-width: 480px;
    }
    /* App下載 */
    .appbox_ios .btn_app,
    .appbox_android .btn_app {
        font: normal bold 1.8rem/3rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}

/* 寬度介於 551px - 670px (手機橫放) */
@media screen and (min-width: 551px) and (max-width: 670px) {
    /* 跳框-共用 */
    .share_popupbox {
        top: 0;
    }
    .share_popup_s {
        min-width: 480px;
    }
    .popup_sharebox {
        padding: 1rem;
    }
}

/* 寬度介於 401px - 550px (iPhone 6+) */
@media screen and (min-width: 401px) and (max-width: 550px) {
    /* 跳框-共用 */
    .share_popup_s,
    .share_popup_m,
    .share_popup_l {
        min-width: 400px;
    }
    .share_popup_header {
        font: normal bold 1.4rem/1.4rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
    .popup_sharebox {
        padding: 1rem;
    }
    /* App下載 */
    .appbox_ios .setup,
    .appbox_android .setup {
        padding: 0 1rem;
        font: normal bold 1rem/1.8rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}

/* 寬度介於 480px - 500px */
@media screen and (min-width: 480px) and (max-width: 500px) {
    /* 跳框-共用 */
    .share_popup_s, .share_popup_m, .share_popup_l {
        min-width: 370px;
    }
}

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

/* 寬度介於 321px - 400px (iPhone 5,iPhone 6,Galaxy S5) */
@media screen and (min-width: 321px) and (max-width: 400px) {
    /* 跳框-共用 */
    .popup_sharebox .scroll_box {
        max-height: 300px;
    }
    .share_popup_s,
    .share_popup_m,
    .share_popup_l {
        min-width: 300px;
    }
    .share_popup_header {
        font: normal bold 1.4rem/1.4rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
    .popup_sharebox {
        padding: 1rem;
    }
    /* App下載 */
    .appbox_ios .btn_app,
    .appbox_ios .setup,
    .appbox_android .btn_app,
    .appbox_android .setup {
        padding: 0 1rem;
        font: normal bold 1rem/1.8rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}

/* 寬度小於 320px */
@media screen and (max-width: 320px) {
    /* 跳框-共用 */
    .share_popup_s,
    .share_popup_m,
    .share_popup_l {
        min-width: 250px;
    }
    .share_popup_header {
        font: normal bold 1.4rem/1.4rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
    .popup_sharebox {
        padding: 1rem;
    }
    /* App下載 */
    .appbox_ios .btn_app,
    .appbox_ios .setup,
    .appbox_android .btn_app,
    .appbox_android .setup {
        padding: 0 1rem;
        font: normal bold 1rem/1.8rem "Century Gothic", Arial, "Microsoft JhengHei", "PMingLiU", sans-serif;
    }
}