body{background: hsl(196, 100%, 70%);}
body#couponPage{background: #fad2c8;}
body, div, ul, ol, li, h1, h2, h3, p, tr, td, img {
    margin: 0;
    padding: 0;
}
img {
    vertical-align: top;
}
html {
    background-color: #e1f8fe;
}
body {
    margin: 0 auto;
    padding: 0;
    text-align: left;
}

.fixBtn{position:fixed; top:30%; right:10px;}
.fixBtn_1000{display: none;}

.space{
    display:block;
    height:24px;
    margin:0 auto;
}
.adBoxArea{
    background:url(../img/adBg.jpg) center top repeat-y;
    margin:0 auto;
    padding:24px 0;
}
.adM1200{
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
    position: relative;
}
.adM1200 div a{
    display: block;
    width:100%;
}
.adM1200 div a img{
    display: block;
    width:100%;
}



.topBanner{background:url(../img/topBanner.jpg) top center no-repeat;height: 536px;}
.topBanner img{display: none;width: 100%;}

#couponPage .topBanner{background:url(../img/coupon_header.jpg) top center no-repeat;}

#couponPage .main-bg {background:#fdadc4;}

/*背景圖*/
.main-bg {
    background: hsl(196, 100%, 70%) url(../img/mainBG.jpg) center bottom no-repeat;
    margin: 0 auto;
    padding:24px 0;
    text-align: left;
    background-size: 100% auto;
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
}
/*共用區塊*/
.max1000Box {
	max-width: 1000px;
	margin: 0 auto;
    padding: 0;
}
.max1200Box {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
}
.max1400Box {
    margin: 0 auto;
    padding: 0;
    max-width: 1400px;
}
.grayBox{
    margin:0 auto 24px;
    padding:15px;
    border:5px solid #e8e8e8;
    text-align: center;
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.topicTxt{
    font:normal 146%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:0 auto 8px;
}
/*按鈕*/
.icon1{
    display: inline-block;
    width:18px;
    height: 18px;
    background:url(../img/icon1.png) left top no-repeat;
    background-size: cover;
    margin-left:4px;
    vertical-align: -3px;
}

a.linkBtn{/*會員加入*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    margin: 0 auto 0 4px;
    background-color:#ff3e67;
    border-radius:3px;
    padding:10px 4em;
    border:1px solid #ff89a2;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.linkBtn:hover{
    box-shadow: 0 0 0 #ccc;
}
a.linkBtn strong{
    font:normal 22px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
a.toFbBtn{/*分享到臉書*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#059eff;
    border-radius:3px;
    margin: 0 auto;
    padding:12px 1.5em;
    border:1px solid #0590e8;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.toFbBtn:hover{box-shadow: 0 0 0 #ccc;}
a.toLineBtn{/*分享到line*/
    display: none;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#38b21c;
    border-radius:3px;
    margin: 0 auto 0 6px;
    padding:12px 1.5em;
    border:1px solid #309e17;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.toLineBtn:hover{box-shadow: 0 0 0 #ccc;}
.extBtn{/*會員登入*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#ff9e21;
    border-radius:3px;
    margin: 0 auto;
    padding:12px 4em;
    border:1px solid #e68e1c;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
.extBtn:hover{box-shadow: 0 0 0 #ccc;}
.extBtn .icon1{
    background:url(../img/icon2.png) left top no-repeat;
    background-size: cover;
}
.extBtn.open .icon1{
    background:url(../img/icon3.png) left top no-repeat;
    background-size: cover;
}
a.birthBtn ,a.okBtn{/*生日禮*//*ok超商*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff !important;
    margin: 0 auto 0 4px;
    background-color:#ff3e67;
    border-radius:3px;
    padding:10px 1.5em;
    border:1px solid #ff89a2;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.birthBtn:hover,a.okBtn:hover{
    box-shadow: 0 0 0 #ccc;
}
a.birthBtn1{/*生日禮*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    margin: 0 auto 0 4px;
    background-color:#009cd6;
    border-radius:3px;
    padding:10px 1.5em;
    border:1px solid #0083b3;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.birthBtn2{/*生日禮*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    margin: 0 auto 0 4px;
    background-color:#25c389;
    border-radius:3px;
    padding:10px 1.5em;
    border:1px solid #25c389;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.birthBtn3{/*生日禮*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    margin: 0 auto 0 4px;
    background-color:#009cd6;
    border-radius:3px;
    padding:10px 1.5em;
    border:1px solid #0083b3;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.birthBtn1:hover,a.birthBtn2:hover,a.birthBtn3:hover{
    box-shadow: 0 0 0 #ccc;
}

.passedBtn{/*過往活動案紐*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#ff9e21;
    border-radius:3px;
    margin: 0 auto;
    padding:12px 4em;
    border:1px solid #e68e1c;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
.passedBtn:hover{box-shadow: 0 0 0 #ccc;}
.passedBtn .icon1{
    background:url(../img/icon2.png) left top no-repeat;
    background-size: cover;
}
.passedBtn.open .icon1{
    background:url(../img/icon3.png) left top no-repeat;
    background-size: cover;
}
/*登入區塊*/
.grayLoginBox{
    margin:0 auto 24px;
    padding:15px;
    border:5px solid #e8e8e8;
    text-align: center;
    font:normal 12px/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.sucessTxt{
    font:bold 16px/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:0 auto 8px;
}
.loginIcon1{
    display: inline-block;
    width:18px;
    height: 18px;
    background:url(../img/icon1.png) left top no-repeat;
    background-size: cover;
    margin-left:4px;
    vertical-align: -3px;
}
.loginBtn{/*會員登入*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#3e79ff;
    border-radius:3px;
    margin: 0 auto;
    padding:12px 4em;
    border:1px solid #81a8ff;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
.loginBtn:hover{
    box-shadow: 0 0 0 #ccc;
}
a.joinBtn{/*會員加入*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    margin: 0 auto 0 4px;
    background-color:#ff3e67;
    border-radius:3px;
    padding:10px 4em;
    border:1px solid #ff89a2;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
a.joinBtn:hover{
    box-shadow: 0 0 0 #ccc;
}
a.joinBtn strong{
    font:normal 22px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.joinEventBtn{/*參加活動按鈕*/
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#3e79ff;
    border-radius:3px;
    margin: 0 auto auto 5px;
    padding:12px 2em;
    border:1px solid #81a8ff;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
.joinEventBtn:hover{
    box-shadow: 0 0 0 #ccc;
}
/*主視覺*/
.mainViewBox {
    margin: 0 auto;
    padding: 0;
    position: relative;
}
.mainViewBox img {
    width: 100%;
    border: 0;
    display:block;
}
.moreBox{
    width:100%;
    position: absolute;
    z-index:2;
    left:0;
    bottom:0;
    text-align: center;
    color:#fff;
    padding:8px 0;
    font:normal 18px/1.5 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff; 
    cursor: pointer;   
    background-color:rgba(33,48,60,0.4);
}

.moreBox .icon1{
    background:url(../img/icon2.png) left top no-repeat;
    background-size: cover;
}
.moreBox.open .icon1{
    background:url(../img/icon3.png) left top no-repeat;
    background-size: cover;
}

/*內容區塊*/

#couponPage .content{background: none;}

.content {
    margin: 0 auto 20px;
    padding: 20px;
    background-color: #fff;
}
/*標題1*/
.titleType1{
    margin:0 auto 4px;
    padding:0;
    font:normal 160%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
}
.titleType1 b{
    color:#bdbdbd;
    padding-right:5px;
    font-weight: normal;
}
/*標題2*/
.titleType2{
    margin:0 auto 8px;
    padding:0;
    font:normal 100%/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    text-align: center;
    background:url(../img/splineBg.jpg) left center repeat-x;
}
.titleType2 span{
    background-color:#fff;
    padding:0 8px;
    display: inline-block;
    font:normal 160%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.titleType2 b{
    display: inline-block;
    width:30px;
    height:30px;
    margin-right:5px;
    vertical-align: -6px;
}
.titleType2 .gift{
    background:url(../img/iconGift.png) center center no-repeat;
    background-size: cover;
}
.titleType2 .cake{
    background:url(../img/iconCake.png) center center no-repeat;
    background-size: cover;
}
.titleType2 .proc{
    background:url(../img/iconProc.png) center center no-repeat;
    background-size: cover;
}


.titleType2 .diamond{
    background:url(../img/iconDiamond.png) center center no-repeat;
    background-size: cover;
}





/*內容簡介1*/
.introArae1{
    margin:0 auto 20px;
    padding:0;
    width:100%;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
}
.introImg1{
    width:45%;
    display: inline-block;
    vertical-align: middle;
    text-align: right;
}
.introImg1 img{
    width:80%;
    display: inline-block;
    margin:0 5px;
}
.introTxt1{
    width:54%;
    display: inline-block;
    vertical-align: middle; 
    text-align: left;  
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.introTxt1_all{
    width:100%;
    text-align: center;  
}
.introTxt1 h2{
    color:#ff0000;
    font:normal 260%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    letter-spacing: -1px;
    border-bottom:1px solid #eee;
    padding-bottom:4px;
    margin:0 auto 8px;
    display: inline-block;
}
.introTxt1 p{
    width:100%;
    display: block;
    text-align: center;
    font:normal 140%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
}
.introTxt1 p strong{
    font:bold 120%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#ff6600;
    padding:0 8px;
}
.introTxt1 h3{
    color:#18b5c3;
    font:normal 180%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    letter-spacing: -1px;
    padding:4px 0;
    margin:0 auto 8px;
    display: block;
}
.introTxt1 blockquote{
    color:#fff;
    font:normal 130%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    letter-spacing: 1px;
    padding:6px 1em;
    margin:4px auto 8px;
    display: inline-block;
    background: #ff6600;
    border-radius:30px;
}
/*廠商簡介*/
.offerInfoBox{
    width:100%;
    display: inline-block;
    margin:0 auto 24px;
    padding:0;
    text-align: center;
    box-sizing: border-box;
    border:5px solid #e8e8e8;
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.offerImgBox{
    width:40%;
    display: inline-block;
    vertical-align: middle;
    padding:0;
    position: relative;
}

.offerImgBox .offerImg{
    display:block;
    width:100%;
}
.offerTxt{
    width:59%;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    padding:15px;
    position: relative; 
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif; 
    text-align: center; 
}
.offerTxt h3{
    font:bold 220%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:0 auto 8px;
    text-align: left;
}

.offerTxt p{
    font:normal 130%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:0 auto 2px;
    text-align: left;
}
.offerTxt p a{
    text-decoration: underline;
}

/*分享出去*/
.shareInfoBox{
    width:100%;
    display: inline-block;
    margin:0 auto 24px;
    padding:0;
    text-align: right;
    box-sizing: border-box;
    border:1px dashed #ccc;
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.shareImgBox{
    width:48%;
    display: inline-block;
    vertical-align: middle;
    padding:0;
    position: relative;
}
.shareImgBox b{
    display:block;
    position: absolute;
    z-index: 2;
    left:0;
    bottom:0;
    width:204px;
    height: 100px;
    background: url(../img/mo.png) right bottom no-repeat;
    background-size: cover;
}
.shareImgBox .shareImg{
    display:block;
    width:100%;
}
.shareTxt{
    width:51%;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    padding:15px;
    position: relative; 
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif; 
    text-align: center; 
}
.shareTxt h3{
    font:bold 220%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:0 auto 8px;
}
.shareTxt h4{
    font:normal 150%/1.2 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#ff6600;
    margin:0 auto 4px;
}
.shareTxt p{
    font:normal 130%/1.2 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:0 auto 2px;
}
.shareTxt .btnBox{
    margin:0 auto;
    padding:16px 0 0;
    text-align: center;
}

/*租借流程*/
.extBox{
    margin:0 auto;
    padding:0;
    display:none;
}
.schBox{
    width:100%;
    margin:0 auto 24px;
    padding:0;
}
.schBox div img{
    max-width:100%;
    margin:0 auto;
    display:block;
}
.schBox div p{
    display:block;
    text-align: center;
    font:bold 126%/1.2 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    padding-bottom:10px;
}
/*生日禮物*/
.giftArea{
   margin:0 auto 24px; 
   padding:0;
   overflow: hidden;
   text-align: center;
}
.giftArea ul{ list-style:none; clear:both; margin:30px 50px;}
.giftArea li{ margin:15px 0;}

.giftBox{
    padding:15px;
    margin:0 8px 15px 8px;
    width:31%;
    min-height:190px;
    display: inline-block;
    box-sizing: border-box;
    vertical-align: top;
    font:normal 100%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}
.giftBox.gfgBox{border:6px solid #ff7b97;}
.giftBox.gfgBox h4{color:#ff7b97; font-weight:bold;}
.giftBox.gfpBox{border:6px solid #25c389;}
.giftBox.gfpBox h4{color:#25c389; font-weight:bold;}
.giftBox.tktBox{border:6px solid #00baff;}
.giftBox.tktBox h4{color:#00baff; font-weight:bold;}

.giftBox h4{
    margin:0 auto 8px;
    padding:0 0 4px;
    text-align: center;
    font:normal 156%/1.3 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    border-bottom:1px solid #eee;
}
.giftBox p{
    margin:0 auto 15px;
    padding:0;
    text-align: center;
    font:normal 130%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    font-weight: bold;
}
.giftBox p strong{
    color:#ff2626;
    font:normal 108%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
}

.giftBox .btnBox{
    margin:0 auto;
    padding:0;
    text-align: center;
}
.birth-title{
    text-align: center;
    font:normal 150%/1.3 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#ff2f5b;
    font-weight:bold;
    margin-top:20px;
}
.tableTitle{
    font-weight: bold;
    text-align: center;
    font:normal 150%/1.3 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#ff2f5b;
    font-weight:bold;
    margin-top:20px;
    font-size:25px;

}

.wording{
    text-align: center;
    font:normal 130%/2 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:10px 0 15px 0;
}

.wording > b{border: 1px solid #ff2f60;  padding: 14px;  display: inline-block;text-align: left;}
.wording b span{background:#ff2f60; border-radius: 20px;color:#FFF; padding: 5px 10px; margin: 0 5px;}
.wording b b {color:#ff2f60;}

.icon-gift{display: inline-block;width: 20px;margin: 0 3px;vertical-align: baseline;}


/*授星獨享*/
.birthOnlyBox{
    width:100%;
    display: inline-block;
    margin:0 auto 24px;
    padding:0;
    text-align: center;
    box-sizing: border-box;
    border:6px solid #ffce59;
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;

}
.birthOnlyImgBox{
    width:40%;
    display: inline-block;
    vertical-align: middle;
    padding:0;
    position: relative;
}

.birthOnlyImgBox .birthImg{
    display:block;
    width:100%;
}
.birthOnlyTxt{
    width:59%;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    padding:15px;
    position: relative; 
    font:normal 100%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif; 
    text-align: center; 
}

.birthOnlyTxt h3{
    font:normal 220%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#ff2f5b;
    margin:0 auto 4px;
    text-align: left;
}
.birthOnlyTxt p{
    font:normal 146%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    margin:0 auto 5px;
    text-align: left;
}
.birthOnlyTxt blockquote{
    font:bold 110%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#ff6600;
    margin:0 auto 8px;
    text-align: left;
}
.birthOnlyTxt div{
    text-align: right;
}
.birthOnlyTxt div a{
    text-decoration: underline;
}
/*兌換流程*/
.exchangeBox{
    width:100%;
    margin:0 auto;
    padding:0;
    max-width: 860px;
}
/*.exchangeBox .slick-track div{
    background:url(../img/arraw.jpg) right 100px no-repeat;
}*/
.exchangeBox .slick-track div.end{
    background:none;
}
.exchangeBox div img{
    width:160px;
    margin:5px auto;
    display:block;
}
.exchangeBox div p{
    display:block;
    text-align: left;
    font:normal 115%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    padding: 1em ;
}
/*新服務*/
.newServTitle{
    margin: 0 auto;
    padding: 0;   
    font:bold 146%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#616161;
    text-align: center;   
}
.addlineBox{
    display: inline-block;
    margin:0 auto 24px;
    padding:0;
    width:100%;
    text-align: center;
}
.addlineBox .addLineList{
    list-style: none;
    display: inline-block;
    width:100%;
    text-align: center;
    vertical-align: middle;
}
.addlineBox .addLineList li{
    width:24%;
    display: inline-block;
    vertical-align: middle;
}
.addlineBox .addLineList li img{
    display:block;
    width:100%;
    margin:0 auto;
}
.addlineBox .addLineList li.arrow{
    width:8%;
    display: inline-block;  
    vertical-align: middle; 
}
.addlineBox .addLineList li.arrow img{
    width:18px; 
}
.lineAreaList{
    display: block;
    list-style: none;
    margin:0 auto 8px;
    padding:24px 0 0;
    font:bold 100%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    text-align: center;
}
.lineAreaList li{
    font:bold 136%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#333;
    cursor: pointer;
    padding:5px 15px;
    border-left:1px solid #fff;
    display: inline-block;
    background-color:#efefef;
}
.lineAreaList li.select{
    background-color:#45b13a;
    color:#fff;
}
.lineAreaList li:first-child{
    border-top-left-radius:20px;
    border-bottom-left-radius:20px;
    border:0;
}
.lineAreaList li:last-child{
    border-top-right-radius:20px;
    border-bottom-right-radius:20px;
}
/*.menu-1st.stuck{position:fixed; z-index:995; top:0px; background-color:#680527;}*/
/*
.tag.stuck {
    position: fixed;
    z-index: 997;
    background-color: #fffdd0;
    display: block;
    top: 40px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3)
}
a[name^="a"] {
    position: relative;
    top: -90px;
}
a[name^="p"] {
    position: relative;
    top: -90px;
}*/


/*回頂部*/

.scroll2top:link, .scroll2top:visited {
    background: url(images/gotop1.png) no-repeat 0 0;
    height: 84px;
    width: 79px;
    margin-left: 928px;
    bottom: 90px;
}
.scroll2top:hover {
    background: url(images/gotop.png) no-repeat 0 -90px;
}

/* line c26模組專用 */
.group-type-ph {
    margin:0 auto;
    padding: 0;
    display:inline-block;
    width:100%;
    text-align: left;
}
.ph {
    position: relative;
    display: inline-block;
    width: 19.5%;
    background: #FFFFFF;
    padding: 5px;
    margin: 0;
    transition: all .3s ease-out;
    box-shadow: none;
    overflow: hidden;
    box-sizing: border-box;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;
}

.ph>a{
    text-decoration: none;
    border: none;
    display:block;
    width:100%;
    margin:0 auto;
    padding:8px;
    border:1px solid #ccc;
    box-sizing: border-box;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;
    cursor: default;
}
.ph>a>img {
    border: none;
}
.ph-img{display:none;}
.ph-title {
    display: block;
    font:bold 106%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    overflow: hidden;
    padding: 0 0 0 17px;
    margin:0 auto 5px;
    color: #263147;
    letter-spacing: -1px;
    background:url(../img/icon4.png) left 2px no-repeat;
}
.ph-detail {
    display:block;
    margin:0 auto;
    color: #FFFFFF;
    font:bold 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
}
.ph-detail>.qrImg{
    display:block;
    width:80%;
    margin:0 auto 15px;
}
.ph-detail>.qrImg>img{
    display:block;
    width:100%;
    margin:0 auto;
}
.ph-detail>h4{
    font:bold 110%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    color:#fff;
    text-align: center;
    padding:3px 0;
    margin:0 auto 6px;
    background-color:#263147;
}
.ph-feature {
    display: block;
    color: #333;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    text-align: center;
}
.ph-feature>h5{
    display: block;
    color: #666;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    text-align: center;
}
.ph-feature>p{
    display: block;
    color: #333;
    margin:0 auto 8px;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    text-align: center;
}
.ph-feature>.lineBtn1{
    display: none;
    margin:0 auto;
    padding:0;
    width:150px;
}

.ph>.price {
    display:none;
}


/*活動專區*/
.ingEventBox{
    margin:0 auto 24px;
    padding:0;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
}
.endEventBox{
    margin:0 auto 24px;
    padding:0;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif; 
   
}
.eventDropBox{
    margin:0 auto;
    padding:0;
    text-align: center;
}

/*進行中+已結束c26模組*/
.ingEventBox > .group-type-ph,
.endEventBox > .group-type-ph {
    margin:0 auto;
    padding: 0;
    display:inline-block;
    width:100%;
    text-align: left;
    
}
.ingEventBox > .group-type-ph > .ph,
.endEventBox > .group-type-ph > .ph {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 32.5%;
    background: #FFFFFF;
    padding: 5px;
    margin: 0;
    transition: all .3s ease-out;
    box-shadow: none;
    overflow: hidden;
    box-sizing: border-box;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;
}

.ingEventBox > .group-type-ph > .ph > a,
.endEventBox > .group-type-ph > .ph > a{
    text-decoration: none;
    border: none;
    display:block;
    width:100%;
    margin:0 auto;
    padding:8px;
    border:1px solid #ccc;
    box-sizing: border-box;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;
    cursor: default;
}
.ingEventBox > .group-type-ph > .ph > a img,
.endEventBox > .group-type-ph > .ph > a img {
    border: none;
}
.ingEventBox > .group-type-ph > .ph > a .ph-img,
.endEventBox > .group-type-ph > .ph > a .ph-img,
.ingEventBox > .group-type-ph > .ph > a .ph-title,
.endEventBox > .group-type-ph > .ph > a .ph-title{
    display: none;
}
.ingEventBox > .group-type-ph > .ph > a .ph-detail,
.endEventBox > .group-type-ph > .ph > a .ph-detail {
    display:block;
    margin:0 auto;
    color: #333;
    font:bold 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
}
.ingEventBox > .group-type-ph > .ph > a .ph-detail .eventImgBox,
.endEventBox > .group-type-ph > .ph > a .ph-detail .eventImgBox{
    display:block;
    width:100%;
    margin:0 auto 5px;
    position: relative;
    overflow:hidden;
}
.ingEventBox > .group-type-ph > .ph > a .ph-detail .eventImgBox .ing,
.endEventBox > .group-type-ph > .ph > a .ph-detail .eventImgBox .ing{
    position:absolute;
    z-index: 2;
    right:0;
    top:0;
    margin:5px 5px auto auto;
    width:70px;
    height:70px;
    font:bold 126%/65px "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    color:#fff;
    background-color:#ff0267;
    border-radius: 50%;
    border:3px solid #fff;
    display:block;
    text-align: center;
    box-shadow: 0 5px 6px rbga(0,0,0,0.5);
}
.endEventBox > .group-type-ph > .ph > a .ph-detail .eventImgBox .ing{
    background-color:#454e5d;
}
.ingEventBox > .group-type-ph > .ph > a .ph-detail .eventImgBox img,
.endEventBox > .group-type-ph > .ph > a .ph-detail .eventImgBox img{
    display:block;
    width:100%;
    margin:0 auto;
    border:0;
}
.ingEventBox > .group-type-ph > .ph > a .ph-detail .eventTopic,
.endEventBox > .group-type-ph > .ph > a .ph-detail .eventTopic{
    font:normal 136%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    color:#333;
    text-align: left;
    padding:0;
    margin:0 auto 10px;
}
.ingEventBox > .group-type-ph > .ph > a .ph-feature .eventTxt,
.endEventBox > .group-type-ph > .ph > a .ph-feature .eventTxt{
    display: block;
    color: #333;
    font:normal 116%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    text-align: left;
}
.ingEventBox > .group-type-ph > .ph > a .ph-feature .eventTxt2,
.endEventBox > .group-type-ph > .ph > a .ph-feature .eventTxt2{
    display: block;
    color: #333;
    font:normal 116%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    text-align: left;
}
.ingEventBox > .group-type-ph > .ph > a .ph-feature > .c26BtnBox,
.endEventBox > .group-type-ph > .ph > a .ph-feature > .c26BtnBox{
    display: block;
    color: #333;
    margin:0 auto 8px;
    font:normal 100%/1.4 "微軟正黑體",Arial,  Microsoft JhengHei, sans-serif;  
    text-align: center;
}
.ingEventBox > .group-type-ph > .ph > a .ph-feature > .c26BtnBox span,
.endEventBox > .group-type-ph > .ph > a .ph-feature > .c26BtnBox span{
    margin:0 auto;
    padding:0;
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    margin: 0 auto 0 4px;
    background-color:#ff3e67;
    border-radius:3px;
    padding:10px 1.5em;
    border:1px solid #ff89a2;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}
.endEventBox > .group-type-ph > .ph > a .ph-feature > .c26BtnBox span{
    background-color:#0dacce;
    border:1px solid #0a93b0;
}
.ingEventBox > .group-type-ph > .ph > a .ph-feature > .c26BtnBox span:hover{
    box-shadow: 0 0 0 #ccc;
}


/* goto fb */
.go2fb:link, .go2tb:visited{position:fixed;top:auto; bottom:15px;right:0; margin-left:auto;display:block; width:20px; height:90px; background:url(/st_ec/img/icon_go2t_fb.gif) no-repeat 0 0; z-index:110;}
.go2fb:hover{background-position:-20px 0;}
.go2fb span{visibility:hidden;}
/*
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .second-menu li a {
        color: #ffffff;
        font-size: 19px;
        font-family: "微軟正黑體";
        text-decoration: none;
        padding: 10px 7.5px;
    }
}*/

/*注意事項*/
.noteBox1{
	margin:60px auto 0 auto;
	padding:0;
	font:normal 100%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
	color:#333;
	text-align: left;
}
.noteBox1.center{text-align: center;}





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

.noteBox1.center h5{font:normal 18px/1.4 "微軟正黑體";}
}

.noteBox1 div{margin:15px auto; font:normal 130%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;}
.noteBox1 p.que{ color:#fff; background:#ff3c73; line-height:3.2rem; padding:0 30px;}
.noteBox1 p.ans{margin:15px auto; padding:0 30px;}
.noteBox1 h5{
	margin:0 auto 8px;
	padding:0 0 3px;
	font:bold 166%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
	color:#333;	
}

.noteBox1 h6{
	margin:0 auto;
	padding:0 0 3px;
	font:bold 156%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
	color:#7c2323;	
}
.noteBox1 h6 a{
	color: #008aff;	
	text-decoration: underline;
	padding:0 4px;
}
.noteBox1 h6 a:hover{
	color:#006cc8;	
}
.noteBox1 ol{
	width:100%;
	display: inline-block;
    box-sizing: border-box;
	list-style: decimal;
	margin:0 auto 10px;
	padding:0 0 0 30px;
	font:normal 100%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
	color:#333;	
}

.noteBox1 ol li{
	display:list-item;
	padding:0;
	font:normal 116%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
	color:#333;	
	text-align: left;	
}
.noteBox1 ol li a{
    text-decoration: underline;
}
.noteBox1 ol li h4{
    display:inline-block;
    margin:0 auto 4px;
    padding:0 15px;
    font:normal 100%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    color:#fff; 
    text-align: left; 
    border-radius: 15px;
    background-color:#ff3c73;     
}
.noteBox1 ol li ul{
    list-style: upper-alpha;
    display: block;
    margin:0 auto 16px;
    padding:0 0 0 34px;
    font:normal 100%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    color:#333; 
    vertical-align: top;
}
.noteBox1 ol li ul li{
    display:list-item;
    padding:0;
    font:normal 100%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    color:#333; 
    text-align: left;       
}
.noteBox1 dl{
    width:96%;
    display: inline-block;
    list-style: decimal;
    margin:0 auto 10px;
    padding:0;
    font:normal 100%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    color:#333; 
    vertical-align: top;
}

.noteBox1 dl dt{
    display:inline-block;
    padding:0 15px;
    font:normal 116%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    color:#fff; 
    text-align: left; 
    border-radius: 15px;
    background-color:#3e79ff;  
}
.noteBox1 dl dd{
    display:block;
    padding:5px 0 10px 15px;
    font:normal 116%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    color:#333; 
    text-align: left; 
}
.noteBox1 dl dd .ivideoImg{
    display:block;
    width:100%;
    margin:0 auto;
}
.noteBox1 dl dd strong{
    color:#ff215a;
    padding:0 3px;
}

.noteBoxContent{display: none;}
.noteImg{width:100%; padding: 20px 0px;margin:0 auto; text-align: center;}

.rr{
    color:#FF0000;    
}
/*加值新服務Shuoof*/
.aboutJP{
    list-style:none;
    padding:0;
    font:normal 116%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    color:#333; 
    text-align: left;   
}
.newServTitle1{
    margin: 0 auto;
    padding: 0;   
    font:bold 166%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#e05603;
    text-align: center;   
}


.JPBtn{
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#ff9e21;
    border-radius:3px;
    margin: 0 auto;
    margin-top:20px;
    padding:12px 4em;
    border:1px solid #e68e1c;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}

.JPBtn2{
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#ff9e21;
    border-radius:3px;
    margin: 0 auto;
    margin-top:20px;
    padding:12px 4em;
    border:1px solid #e68e1c;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}

.JPBtn3{
    display: inline-block;
    font:normal 18px/1 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#fff;
    background-color:#ff9e21;
    border-radius:3px;
    margin: 0 auto;
    margin-top:20px; 
    padding:12px 4em;
    border:1px solid #e68e1c;
    box-shadow: 0 2px 0 #ccc;
    cursor:pointer;
    text-decoration: none;
}




/*ok超商*/
.okTitle{
    margin: 0 auto;
    padding: 0;   
    font:bold 250%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#3b5aa0;
    text-align: center;     
}
.okTitle1{
    margin: 0 auto;
    padding: 0;   
    font:bold 166%/1.6 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    color:#0d3491;
    text-align: center;    
}
.okBtn>span{
    font:normal 60%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
    padding:0 4px; 
}
.oksale{
    margin:20px auto;
}
.oksale img{
    width: 100%;
}


table 
{
width:90%;
margin-top: 10px;
}

table,th,td{ 
font-size: 20px;    
border-collapse:collapse;
 border: 1px solid #666;
 padding: 5px;

}
th
{
font:normal 116%/1.6 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
height:30px;
text-align:center;
background-color:rgb(255, 158, 33);
color: #fff;
}
tr { 
  border-bottom:1px solid #000; 
}
td
{
text-align:center;
}

.infoPic{display: block;width:100%;cursor: pointer;}
.infoPic > img{width:100%;}
.picMargin{margin:20px auto 1px;}
.ividoInfo{height: 0px;overflow: hidden;}
.closeBtn{margin:auto; text-align: center; display: block;background-color: #008aff;color:#fff;font-size: 20px;padding:10px; width:200px;cursor: pointer;}
.wifiInfo{background-color: #d3f5ff;}
.picMargin{cursor: auto;}
.wifiInfo > h2{color:#1b6dca;font-size: 24px; text-align: center;padding:10px;}
.wifiInfo > h2 > span{display: block;font-size: 18px; margin:5px;}
.wifiInfo > article{text-align: center;color:#0d3491;font-size: 16px; line-height: 24px;vertical-align: middle;padding:10px;}
.wifiInfo > article > a{margin:10px auto; text-align: center; display: block;background-color: #008aff;color:#fff;font-size: 20px;padding:10px; width:200px;text-decoration: none;}
.areaMenu{position: fixed; bottom:0px; right: 0px; z-index:99;background-color: rgba(3, 18, 97, 0.8);padding:5px; display: none;}
.areaMenu > ul{list-style: none;text-align: center;}
.areaMenu > ul > li{margin:0px 10px; cursor: pointer; display: inline-block;text-decoration: none;padding:5px 10px; font-size: 16px;border-radius: 50px;color:#fff;transition: .5s;}
.areaTitle{font-size: 20px; text-align: center;background-color: #3b5aa0; margin:10px auto; display: inline-block;color:#fff;padding:10px 50px; border-radius: 20px; width:95%;}
.areaBox{position: relative;margin:20px auto 40px;text-align: center;}


.tktArea{font-size: 0px;text-align: left;display: flex;flex-wrap: wrap;justify-content: center;}

.areaBox > h3{font-size: 28px; margin:0px auto 20px; color:#00afdb;position: relative; display: inline-block;}

#couponPage .areaBox > h3{color:#ffffff;}
#couponPage .areaBox > h3:before{background: #ffffff;}
#couponPage .areaBox > h3:after{background:  #ffffff;}
#couponPage .areaTitle {background: #d535b3;}

.areaBox > h3:before{content: '';width: 10px; height: 10px;  background-color: #00afdb;border-radius: 50%;position: absolute; top:9px; left:-20px;}
.areaBox > h3:after{content: '';width: 10px; height: 10px;  background-color: #00afdb;border-radius: 50%;position: absolute; top:9px; right:-20px;}
.tktBox { vertical-align: top; display: inline-block;width:100%;background-color: #ffedf2;padding: 20px 20px; font-size: 16px;box-shadow: 1px 1px 5px rgba(172, 63, 107, 0.3);border-radius: 10px;margin:10px auto;position: relative; color:#666;}




.tktArea > *:hover{text-decoration: none;}
.tktBox > div{display: inline-block;}




.tktBox > .tktInfo{margin-bottom: 10px;}
.tktBox > .tktInfo > h5{font-size: 20px; color:#7f3da5; line-height: 24px; text-decoration: none;margin: 10px auto;}
.tktBox > .tktInfo > h5 > span{display: block;font-size: 18px; margin:0px;}
.tktBox > .tktImg{width:100%;}
.tktBox > .tktImg > img{width:100%; vertical-align: top;}
.tktBox > a{display: block; text-decoration: none; background-color: #8951c9;color:#fff; padding:10px; width:200px;text-align: center; margin:10px; border-radius: 10px;transition: .5s;}
.tktBox:hover > a{background-color: #6005b6;}

ul.tktBtn{text-align: center;display: block; list-style: none;}
ul.tktBtn > li{display: inline-block;}
ul.tktBtn > li > a{color:#fff;padding: 5px 10px; text-decoration: none;display: block;background: #008aff; border-radius: 10px;cursor: pointer;transition: .5s; text-align: center;}
ul.tktBtn > li.active > a{background-color: #18b5c3;}
ul.tktBtn > li > a:hover{background-color: #18b5c3;}
ul.tktBtn > li > a > img{display: block;}
.topBanner{width: 100%; max-width: 2000px; margin:auto;}
.topBanner > img{width: 100%;}
.wifiInfo > article > .normalLink{display: inline; color:#ff0055; background: transparent; padding: 0px; text-decoration:underline;font-size: 16px;}
.wifiInfo > article > .normalLink:hover{color:#008aff;}


.vipArea{width: 100%;margin: 0 auto;vertical-align: top;position: relative;display: inline-flex;flex-wrap: nowrap;}
.vipBox{width: 32%;margin: 0 5px;vertical-align: top;}
.vipBox.vipLevel1{border: #3ab3d8 1px solid;}
.vipBox.vipLevel2{border: #999898 1px solid;}
.vipBox.vipLevel3{border: #bb9948 1px solid;}


.vipLevel1 .vipBoxTop{background: url(../img/vip01-m2.jpg) no-repeat;}
.vipLevel2 .vipBoxTop{background: url(../img/vip02.jpg) no-repeat;}
.vipLevel3 .vipBoxTop{background: url(../img/vip03.jpg) no-repeat;}


.vipLevel1 .vipBN {margin-top:100px;}
.vipLevel2 .vipBN{background: #999898;text-shadow: #5c5b5b 0px 0px 3px;}
.vipLevel3 .vipBN{background: #d3af60;text-shadow: #43392f 0px 0px 3px;}

.vipBoxTop{margin: 0px auto;width: 100%;padding: 10px;vertical-align: top;min-height: 236px;}
.vipImg {width:28%;display: block;margin: 3% auto;vertical-align: top;}
.vipTitle {display: block;font:bold 28px/1.6 "微軟正黑體";text-align: center;}

.vipTitle p {font:16px/1.6 "微軟正黑體";}
.vipImg img{width: 100%;max-width: 200px;}

.vipBoxTop p{font:16px/1.6 "微軟正黑體";text-align: center;}
.vipBoxText {font:16px/1.6 "微軟正黑體";padding: 20px; }
.vipBoxText p {line-height: 1.4;margin: 10px auto;}
.vipSpecial{color:#000;margin: 10px 0;}
.vipSpecialTitle{background: #5dc2df;border-radius: 30px;color:#FFF;font:20px/1.6 "微軟正黑體";padding: 0px 14px;display: inline-block;}
.vipSpecialTitle.red{background: #e94949;}
.vipSpecialTitle.orange{background: #ffe421; color: #524119;}
.vipBoxText .line{width: 100%; height: 1px ;background: #949494;margin: 5% auto;}
.vipBoxText .vipBoxTextTop{min-height: 140px;}
.vipbtnBox {text-align: center;margin: 30px 0;}
.vipbtnBox a:hover{transform: translateY(-5px);}
.vipbtnBox a{
    display: inline-block; font:24px/1.8 "微軟正黑體"; color:#fff ;margin: 0 auto 0 4px; background-color:#096fe3; border-radius:10px;border:1px solid #075ec2;box-shadow: 0 2px 0 #ccc;
    cursor:pointer;    text-decoration: none;padding: 10px 20px;transition: 0.3s;}
.vipicon1 {display: inline-block;width:30px; height: 30px; background:url(../img/icon1.png) left top no-repeat; background-size: cover;margin-left:4px; vertical-align: -6px;}

.vipBN{width: 100%;border-radius: 20px;background: #d9b870;padding:20px;font:bold 20px/1.2 "微軟正黑體"; color:#FFF;text-shadow: #8e650b 0px 0px 3px;position: relative; }
.vipBN::after {content: "";width:135px;height: 98px;position: absolute;top: 0; background: url(../img/vip00.png) ;left: 0}

.vipBNText{width: 60%;margin:0 0 0 100px;}
.vipBN img{width: 100%;max-width: 329px;}

.bgCar {width: 100%;position: relative;}
.bgCar > img {max-width: 1311px;width: 100%;}

.earnMobile{display: none;}

.table>table{margin: 20px auto;}

.earnStepText { display: inline-block;position: absolute; left: 8%; top: 33%;}
.earnStepText h3 {font:40px/1.2em "微軟正黑體";font-weight: bold; margin:0 10px;text-align: left;}
.earnStepText p  {font:24px/1.2em "微軟正黑體";color:#000; margin:0 10px;text-align: left;}
.earnStepImg {max-width:700px;width: 100%;}
.earnStep {-webkit-animation: up ease-out 1.7s; -webkit-animation-iteration-count: infinite; animation: up ease-out 1.7s;  animation-iteration-count: infinite;cursor: pointer;}
.earnStep1 {position: absolute;top:13%;left:11%; color: #d6393d;}
.earnStep2 {position: absolute;top:12%;left:52%; color:#00a19a;}
.earnStep3 {position: absolute;top:36%;left:32%; color:#20b8f3;}
.earnStep4 {position: absolute;top:61%;left:41%; color:#1d48c5;}


.earnStep1 a {color: #d6393d;}
.earnStep2 a {color:#00a19a;}
.earnStep3 a {color:#20b8f3;}
.earnStep4 a {color:#1d48c5;}

.earnStep2 .earnStepText{ left: 16%;}
.earnStep3 .earnStepText{ left: 10%;}


.earnHand{position: absolute;right:69%;bottom: 11%;}

img.earnFlag {width: 15.7%;max-width: 205px;position: absolute;right:68%; bottom: 10%;cursor: pointer;}
img.earnFlag:hover { transform:  translate(0px,-10px); transition: .3s;-moz-transition:.3s;-webkit-transition:.3s;-o-transition:.3s;}

.earnCollect .earnHand {position: absolute;right:12%;top:61%;}
.earnTip {width: 100%;max-width: 1311px;}
.earnTipsBtn {width:12%;position: absolute;right:12%;top:47%;animation: up ease-out 1.3s;  animation-iteration-count: infinite;cursor: pointer;-webkit-animation: up ease-out 1.3s; -webkit-animation-iteration-count: infinite;}
.earnCollect{position: relative;padding-bottom: 10px;  }
.earnCollect {position: relative;padding-bottom: 0px;  }
.earnOrder {display:none;position: absolute;top:7%;left:32%;box-shadow: 2px 2px 30px #646464; }
.earnOrder > img {width: 100%;}
.earnOrder .earnClose{ top:10px;right:1%;position: absolute; z-index:555;background: rgba(255,255,255,1);width: 36px; height: 36px; font-size: 30px; color: #000; text-align: center; text-decoration: none; border-radius: 50%; transition: .5s;}
.earnOrder .earnClose:hover{background: rgba(255,255,255,0.9);}

.earnTitle {width: 100%; max-width: 644px; position: absolute;left: 50%; top: -18%; margin-left: -322px;}
.earnTitle img{width: 100%;}

.gebietsInfo{background-color: #d3f5ff;margin: 20px auto;padding:0 0 10px 0;}
.gebietsInfo h2{color:#1b6dca;font-size: 24px; text-align: center;padding:10px;}
.gebietsInfo > h2 > span{display: block;font-size: 18px; margin:5px;}
.gebietsInfo >div {width: 100%;}
.gebietsInfo >div >img{max-width: 1200px;width: 100%;}


.gebietsInfo a{margin:0px auto; text-align: center; display: block;background-color: #008aff;color:#fff;font-size: 20px;padding:15px; width:200px;text-decoration: none;}


.bnAD{margin: 10px auto; text-align: center;}
.bnAD img{max-width: 800px;width: 100%;}





@keyframes up{

  0% {transform:  translate(0px,0px);}
  50% {transform:  translate(0px,7px);}
  100% {transform:  translate(0px,0px);}
}

@-moz-keyframes up{
  0% {-moz-transform:  translate(0px,0px);}
  50% {-moz-transform:  translate(0px,7px);}
  100% {-moz-transform:  translate(0px,0px);}
}

@-webkit-keyframes up {
  0% {-webkit-transform:  translate(0px,0px);}
  50% {-webkit-transform:  translate(0px,7px);}
  100% {-webkit-transform:  translate(0px,0px);}
}

@-o-keyframes up {
  0% {-o-transform:  translate(0px,0px);}
  50% {-o-transform:  translate(0px,7px);}
  100% {-o-transform:  translate(0px,0px);}
}

@-ms-keyframes up {
  0% {-ms-transform:  translate(0px,0px);}
  50% {-ms-transform:  translate(0px,7px);}
  100% {-ms-transform:  translate(0px,0px);}
}  


.brightness { -webkit-animation: brightnessUp .4s  infinite alternate; animation: brightnessUp .4s  infinite alternate; }
@-webkit-keyframes brightnessUp {
 0% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
 50% { -webkit-filter: brightness(120%); filter: brightness(120%);  }
 100% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
}
@keyframes brightnessUp {
 0% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
 50% { -webkit-filter: brightness(120%); filter: brightness(120%);  }
 100% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
}

@-moz-keyframes brightnessUp{
 0% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
 50% { -webkit-filter: brightness(120%); filter: brightness(120%);  }
 100% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
}


@-o-keyframes brightnessUp {
 0% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
 50% { -webkit-filter: brightness(120%); filter: brightness(120%);  }
 100% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
}

@-ms-keyframes brightnessUp {
 0% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
 50% { -webkit-filter: brightness(120%); filter: brightness(120%);  }
 100% { -webkit-filter: brightness(100%); filter: brightness(100%);  }
} 

    








@media screen and (max-width:768px){
    .areaMenu{width:100vw;}


}
@media screen and (min-width:769px){
    .wifiInfo > h2 , .gebietsInfo h2{font-size: 36px;}
    .wifiInfo > h2 > span ,.gebietsInfo > h2 > span{font-size: 28px; margin:10px;}
    .wifiInfo > article{font-size: 24px;line-height: 30px;}
    .areaMenu{bottom:50vh;right:15px; border-radius: 10px;padding:15px 5px;}
    .areaMenu > ul > li{display: block; margin:10px 20px;}
    .areaMenu > ul > li:hover{background-color: #18b5c3;padding:5px 20px;}
    .tktBox{width: 47%;margin:1.5%; transition: .5s; font-size: 16px;}
    /* .tktBox:hover{border-radius: 15px; background-color: #9ddbff;box-shadow: 1px 1px 8px 2px rgba(33,48,60,0.4);} */
    .tktBox > .tktInfo{width:64%;margin-right: 0%;}
    .tktBox > .tktInfo > h5{ font-size: 30px; line-height: 36px;}
    .tktBox > .tktInfo > h5 > span{font-size: 24px;}
    .tktBox > .tktImg{width: 35%; position: absolute; top:20px; right: 20px;}
    .wifiInfo > article > .normalLink{font-size: 24px;}



}



.topBanner .pcc{display: block;}
.topBanner .mmm{display: none;}



.otherPage {width: 100%;margin: 30px auto;text-align: center;}
.otherPage img {width: 100%;max-width: 1100px;}



.footerSNS{background: #0c6ec4;padding: 40px 0;}

.snsicon{width: 60%;text-align: center;margin: 0 auto;}
.snsicon img {max-width: 100px;width: 100%;display: inline-block;margin: 0 6px;}






.moreBtn{width: 60%;border-radius: 20px; margin:0 auto;padding: 10px 0; text-align: center;font:bold 24px/1.2 "微軟正黑體";background: #035bac;color:#FFF;transition: 0.3s;position: relative;}
a:hover, a:visited,a:active {text-decoration:none;}
.moreBtn:hover{background: #0e7ee5;}
img.mouseClick{position: absolute;top: 15px;right: 25%;max-width: 40px;}



.notePC{display: block;}
.noteM{display: none;}









@media screen and (max-width:1200px){
img.mouseClick{position: absolute;top: 15px;right: 15%;}

.snsicon{width: 100%;}
}

@media screen and (max-width:900px){
img.mouseClick{position: absolute;top: 15px;right: 0%;}
}

@media screen and (max-width:820px){
.topBanner .pcc{display: none;}
.topBanner .mmm{display: block;}
    }




@media screen and (max-width:700px){
.moreBtn{width: 80%;}
.snsicon img {width: 12%;}
.footerSNS{padding: 20px 0;}


.notePC{display: none;}

.noteM{display: block;text-align: center;}
.up b{font:bold 40px/1.4 "微軟正黑體";color:#94c120;}
.up.up2 b {color:#ef3e30;}

.up p{font:20px/1.2 "微軟正黑體";color:#FFF;background: #fc6188;border-radius: 20px; padding: 5px 10px;}

.snsicon img{margin:0 3px;}



}

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

    img.mouseClick{position: absolute;top: 15px;right: 0%;width: 15%;}
    .moreBtn{font:bold 4.4vw/1.2 "微軟正黑體";width: 90%;}

}



.content .banner.pc{width: 100%; max-width: 860px;}
.content .banner.m{display: none;}
@media screen and (max-width:600px){
.content .banner.pc{display: none;}
.content .banner.m{display: block;max-width: 600px;width: 100%;}
}

.giftArea2021{display: flex; justify-content: center; max-width: 860px; margin: 0 auto 60px auto;}
.giftArea2021 .box{border: #7dc1ea 2px solid; width: 32%; margin: 0.5%; text-align: center; font-size: 22px;border-radius: 20px;overflow: hidden;}
.giftArea2021 .box.silver{border: #ffa35c 2px solid;}
.giftArea2021 .box.black{border: #e8b845 2px solid;}


/*藍金銀樣式*/
/*.giftArea2021 .box h6{font-size: 100%; padding: 1em;     background: url(../img/vip01.jpg) no-repeat; letter-spacing: 0.05em; font-weight: bold; background-size: 100% auto;}
.giftArea2021 .box.silver h6{background: url(../img/vip02.jpg) no-repeat; background-size: 100% auto;}
.giftArea2021 .box.black h6{    background: url(../img/vip03.jpg) no-repeat; background-size: 100% auto;}
*/
.giftArea2021 .box h6{font-size: 100%; padding: 1em;     background:#c1e8ff; letter-spacing: 0.05em; font-weight: bold; background-size: 100% auto;position: relative;}
.giftArea2021 .box h6 img{max-width: 80px;display: block;text-align: center;margin: 10px auto 0 auto;}
.giftArea2021 .box h6:after{content:attr(data-level);position: absolute;right: 10px;top: 0;color: #FFF;font:16px/1.2 "微軟正黑體";}
.giftArea2021 .box.silver h6{background: #fac69e; background-size: 100% auto;}
.giftArea2021 .box.black h6{    background: #ffda37; background-size: 100% auto;}
.giftArea2021 .box p{padding: 1em; letter-spacing: 0.05em;}
.giftArea2021 .box p b{font-size: 100%;}
.giftArea2021 .box p b span{font-size: 160%;color:#6c5eff;margin: 0 3px;}
.giftArea2021 .box small{display: block; font-size: 70%; color: gray; padding-bottom: 0.5em;}


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

.giftArea2021 .box p{padding: 0.5em;}
}


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

    .giftArea2021{flex-wrap: wrap;}
    .giftArea2021 .box{width: 100%; margin:0.2em 0;}
    .giftArea2021 .box p{padding: 1em;}
  
}

.sampleBox{margin: 10px auto; max-width: 860px; font-size: 17px; line-height: 1.5;}
.smapleimg{width: 100%; max-width: 860px;}
.smapleimgM{display: none;width: 100%;}

@media screen and (max-width:640px){
    .smapleimg{display: none;}
    .smapleimgM{display: block;}

  
}

/*20230214成就徽章範例說明*/
.couponBox{margin: 10px auto; max-width: 860px; line-height: 1.5; text-align: center;}
.couponBox .inside{margin: 10px 0 5px;}
.couponBox > h5{margin: 0 auto 25px; font: bold 166%/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif; color: red;}




/*20220427會員好禮大進化*/
.sampleBox dl{ padding: 0.5em 0;}
.sampleBox dl dt{ color: #00af84; font: bold 140%/1.3 "微軟正黑體";}
.sampleBox dt span{ display: inline-block; background-color: #00af84; color: white; border-radius: 5px; width: 1.6em; height: 1.6em; line-height: 1.6em; text-align: center; margin-right: 0.5em;}
.sampleBox dd {padding-left: 3em;word-break: break-all;}
.redword{color: red;font-weight: bold;}

@media screen and (max-width:600px){
    .brmob{display: none;}
    .sampleBox dl dt{font-size: 22px;}
    .sampleBox dd{font-size: 16px; padding: 0.5em 0;}
}





.exchangeBox.index-5,
.exchangeBox .slick-track{display: flex !important; align-items: stretch; justify-content: center;}
.stepBox{ border:solid 1px #ffa86e; margin-right:34px; margin-bottom: 60px;  position: relative; }
.stepBox:last-child{margin-right: 0;}
.stepBox:after{ content: url(../img/arraw.jpg); position: absolute; right: -28px; top: calc(50% - 22px); }
.stepBox:last-child:after{display: none;}
.stepBox .stepTitle{background:#fff4c6; text-align: center; font-weight: bold; padding: 1em 0.5em; font-size: 130%; color: black; letter-spacing: 0.05em;font-family: "微軟正黑體";}
.stepBox.slick-slide{height: auto;}

@media screen and (max-width:480px){
    .stepBox:after{display: none;}
}

.space-20{height: 20px;}
.stepBox{margin: 0 40px 0 0; }
.exchangeBox .stepBox p{text-align: center;}

.book-country{display:flex; max-width:860px; margin: 15px auto 30px auto; justify-content: space-between;}
a.country-single{position: relative;display: inline-block; max-width: 380px; width: 100%; overflow: hidden; transition: 0.3s;}
a.country-single:hover{transform: scale(1.03); transition: 0.3s;}
a.country-single img{max-width: 100%; }
.country-txt{top:calc(50% - 24px); left: calc(50% - 58px); position: absolute; color: #fff; font-size: 16px; letter-spacing: 1px; padding: 16px 24px; background: rgba(0, 0, 0, 0.35); }


.banner{width: 100%;margin: 0 auto;}

/*20230210*/
.slick-track{margin: 0 auto;}
 
p.index7 .banner.pc{max-width: 960px;width: 100%;}
.banner.m {display: none;}

@media screen and (max-width:600px){
.banner.pc{display: none;}
.banner.m{display: block;max-width: 600px;width: 100%;}
}



.couponLoveBase{text-align: center;display: block;}
.couponLoveBox {position: relative;width: 498px;text-align: center;margin: 0 auto;}
.couponLoveBox img{max-width: 498px; width: 100%;}
.couponLoveText{position: absolute;bottom: 24px;left:47px;width: 80%;}
.couponLoveTitle{background: #FFF;text-align: center;border: 5px #FFF solid;}
.couponLoveTitle b{font:bold 24px/ 1.4 "微軟正黑體";color:#31756f;padding: 10px;}
.couponLoveTitle p{font:bold 30px/ 1.4 "微軟正黑體";background: #31756f;padding: 5px 10px;color: #FFF;letter-spacing: 2px;}
.couponLoveText small{font:24px/ 1.6 "微軟正黑體";color:#000;display: block;}
.couponLoveText small b {font-weight: bold;}
.exchangeBox .stepBox {padding:  0 0 10px 0;}
.exchangeBox .stepBox small {font:14px/ 1 "微軟正黑體"; color:#f85858;}

@media screen and (max-width:585px){
.couponLoveBox{width: 100%;}
.couponLoveText{bottom: 10%;left:10%;}
.couponLoveTitle b{font:bold 4vw/ 1.4 "微軟正黑體";}
.couponLoveTitle p{font:bold 4vw/ 1.4 "微軟正黑體";}
.couponLoveText small{font:3.8vw/ 1.4 "微軟正黑體";}

}

@media screen and (max-width:400px){
.couponLoveText {bottom:10%;left: 7%;width: 86%;}
.couponLoveTitle p{padding: 3px 10px;}
}





.tktArea.bnAD a {display: inline-block;margin:  0 10px;width: 47%;transition: 0.3s;} 
.tktArea.bnAD a img.pc{width: 100%;max-width: 550px;}
.tktArea.bnAD a img.m{display: none;}
.tktArea.bnAD a:hover{transform:translateY(-5px);}



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


.tktArea.bnAD a{display: block;margin:  10px auto;width: 100%;}
.tktArea.bnAD a img.pc{display: none;}
.tktArea.bnAD a img.m{display: block;width: 100%;max-width:1000px;}


}


.register-btn{
    position: fixed;
    right: 5%;
    bottom: 10%;
    transition: 0.3s;
    z-index: 10;
    
}
.register-btn img{
    max-width:200px;

}
.register-btn:hover{
    transform: scale(0.95);
}

@media screen and (max-width:1600px){
    .register-btn{
        right: 2%;
    }
    .register-btn img{
        max-width: 125px;
    
    }
        
}

@media screen and (max-width:768px){
    .register-btn{
        right: 2%;
        bottom: 1%;
    }
    .register-btn img{
        max-width:100px;
    
    }
}