@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
#container { position: relative; width: 100%; overflow: hidden; }
#container * { box-sizing: border-box;vertical-align: top; font-family: 'Noto Sans TC';}
.textCenter { text-align: center !important; }
/*
.setop.navbar-default { border-bottom:none; position: relative; z-index: 99; box-shadow: 0 0 5px rgba(0,0,0,0.3)}
.setop.navbar-default {background: #eee; }
.setop.navbar-default * { color: #2a2a2a }
.setop.navbar-default .navbar-nav > li > a { color:#2a2a2a; }
/*.setop { display: none }*/

/*.go2fb , .scroll2top { display: none !important}*/




body {overflow-x: hidden; background: url(../images/background_body.jpg) #eee bottom center no-repeat fixed;}
body.cherry {overflow-x: hidden; background: url(../images/background_body_1.jpg) top center no-repeat fixed;}
body.rape {overflow-x: hidden; background: url(../images/background_body_2.jpg) top center no-repeat fixed;}
body.tuli {overflow-x: hidden; background: url(../images/background_body_3.jpg) top center no-repeat fixed;}
body.violet {overflow-x: hidden; background: url(../images/background_body_4.jpg) top center no-repeat fixed;}
body.wisteria {overflow-x: hidden; background: url(../images/background_body_5.jpg) top center no-repeat fixed;}


iframe { width: 100%; }

.phohoShowArea { display: none; position: fixed; top:0; left: 0; padding-top: 5vh; width: 100%; height: 100%;text-align: center !important; z-index: 99999; background: rgba(0,0,0,0.8) ;}
.phohoShowArea .inner { text-align: center !important; }
.phohoShowArea h2 { margin-bottom: 20px; font: 30px/30px "arial","Noto Sans TC"; color: #fff; text-align: center !important; }
.phohoShowArea img { width: 90%; max-width: 800px; }
.phohoShowArea > .close { display: block; margin-top:20px; font: 100 16px/22px "arial","Noto Sans TC"; color: #fff; text-align: center !important; cursor: pointer;  }

.mobileMenuButton { display: none }



.textCenter { text-align: center !important; }
#container .mainPageButton { position:sticky; position: -webkit-sticky; top:0px; left: 0; width: 100%; margin-bottom: -60px;/* border-top: 5px solid #2a2a2a*/; text-align: center; z-index: 50}
#container .mainPageButton ul { display: inline-block; margin:0 auto;padding: 0 60px; width: auto; text-align: center; white-space:nowrap;
	border-radius: 0 0 50px 50px ; box-shadow: 0 0 5px rgba(0,0,0,0.5); background: #cb307f}
#container .mainPageButton ul * { transition: .5s;-webkit-transition: .5s;  }
#container .mainPageButton ul li { display:inline-block; margin:5px 0; padding: 5px 20px; border-right: 1px solid #ddd; white-space:nowrap;}
#container .mainPageButton ul li:last-child { border-right: none; }
#container .mainPageButton ul li a b { display: block; font: 500 22px/22px "arial","Noto Sans TC"; color: #fff; text-align: center;  }
#container .mainPageButton ul li a small { display: block; font: 200 12px/18px "arial","Noto Sans TC"; color: #fff; text-align: center; letter-spacing: 2px }
#container .mainPageButton ul li:hover { transform: translateY(-3px);  }
#container .mainPageButton ul li:hover a b  { color:#fffd80 }
#container .mainPageButton ul li:hover a small { color:#fffd80 }

#container .hasButton { position: relative;  z-index: 1 }
#container .hasButton .secButton { display: none; position: absolute; top: 50px; left: 0; width: 100%; z-index: 2; background: rgba(0,0,0,0.8) }
#container .hasButton .secButton a { display: block; padding: 5px 0 ; font: 200 14px/14px "arial","Noto Sans TC"; color:#fff; text-align: center; }
#container .hasButton .secButton a:hover { font-weight: 500; color: #fff800 }

#container .topBanner { position: relative; width: 100%; z-index: -1; }
#container .topBanner.game .img { height: 500px } 
#container .topBanner h1 { position: absolute; top:25%; display: inline-block; width: 100%;  text-shadow: 0 0 10px  #cb307f;z-index: 5 }
#container .topBanner h1.game { top:10%; }
#container .topBanner h1 > div { position: relative; margin:0 auto; width: 80%; max-width: 1100px; text-align: right;}
#container .topBanner h1 > div .animationBird { position: absolute; top:-25px; right: -190px; transform: scaleX(-1); z-index: 10 }
#container .topBanner h1 > div .animationBird img {  transform: scale(0.5); }
#container .topBanner h1 .text { display: inline-block;  padding: 10px; /*background: rgba(0,0,0,0.8)*/;}
#container .topBanner h1 .text b { display: block;font: 600 70px/90px "arial","Noto Sans TC"; color: #fff; text-align: center !important; letter-spacing: 1px }
#container .topBanner h1 .text small { display: block; margin: 0 auto; transform: translateY(-0px); padding: 2px 5px; width: 50%; font: 20px/20px "arial","Noto Sans TC"; color: #fff; text-align: center !important;  letter-spacing: 1px; border:1px solid #fff;background: #cb307f}
#container .topBanner .img { width: 100%; height: auto; overflow: hidden; display:  flex; vertical-align: top; align-items: center;justify-content:  center}
#container .topBanner .img img { /*position: absolute; top:0; left: 0;*/ margin:0 auto; width: auto; vertical-align: top; z-index: 1 }




/*
#container .topBanner .video { position: relative; width: 100%; height: 500px; overflow: hidden; }
#container .topBanner .video video { position: absolute; top: 0; left: 0; margin-top: -20%; width:100%; height:auto;  }
*/

.bannerBase { margin:20px 0 0 0; padding:0;   }
.bannerBase .bannerArea { position: relative; margin:0 auto;padding: 0px; width: 90%; max-width: 1440px; border-radius: 5px; overflow:; z-index: 1;
	letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
    *letter-spacing: normal; /* reset IE < 8 */
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */}
.bannerBase .bannerArea {}
.bannerBase .bannerArea img { width: 100%; vertical-align: top }
.bannerBase .bannerArea .box3 { margin:0 5px; display: inline-block; width: 30% }


.contentBase { margin: 0 auto; width: 90%; max-width: 1400px; ; }
.contentBase > article { display: inline-block; letter-spacing: normal; }
.contentBase .photoBase { padding-top: 30px; width: 30%;  }

.contentBase h3 { text-align: center; letter-spacing: normal; }

.itemBase { padding:0; width: 70%; }
.itemBase .itemArea  { margin:0 auto;padding: 0px; width: 100%;  }


/*C23 use*/
#container .carrier {   margin: 0 0 20px 0 ;width: 100%; height: auto; text-align: center;  }
.intro-anchors { display: none; }
#container .carrier .box-head p { display:block; }
h4 { position: relative; vertical-align: top; display: block; margin:0; padding:20px; width: 100%; height:auto; letter-spacing: normal;
 font: 30px/30px "Noto Sans TC","arial"; color: #cb307f; text-align: center !important;  }
#container .carrier ul { display: block; padding: 20px; width:100% ; }
#container .carrier ul li { position: relative; box-sizing: border-box; width: 100%; margin: 0 0 20px 0; padding: 0 0 25px 0; text-align: left;/* border-top:5px solid #cb307f*/; box-shadow: 5px 5px 10px #e5e5e5;
transition: .5s;  -webkit-transition: .5s; background: #fff;list-style-type: none;}
#container .carrier ul li a { display: block;padding: 0 0 10px 10px;  font:16px/20px "arial","Noto Sans TC"; color: #0a72ff}
#container .carrier ul li a strong { margin: 0 0 10px -10px; padding: 10px; font: 20px/30px "arial","Noto Sans TC"; display: block; text-align: left; color: #545454 ;transition: .5s;  -webkit-transition: .5s;}
#container .carrier ul li em { position: absolute;bottom: 10px; right: 20px;font:16px/16px "arial","Noto Sans TC"; color:#cb307f; }
#container .carrier ul li em span {font: 18px/18px "arial","Noto Sans TC";}
#container .carrier ul li:hover { border:1px solid #cb307f; }
#container .carrier ul li:hover a strong  { background: #cb307f ; color: #fff }



.c26H4Base { padding: 0px 0; text-align: center !important; position: static; top: 0px; left: 0; width: 100%; background: rgba(0,0,0,0.8);
	overflow: hidden;overflow-y: hidden; overflow-x:auto;-webkit-overflow-scrolling: touch;overflow-scrolling: touch; }
.c26H4Base div {position:relative; width: 100%; z-index: 10; padding: 0 0px; text-align: center !important; white-space:nowrap; width:auto; border-radius: 0;}
.c26H4Base span { display: inline-block; margin: 0 0 0px 0; padding: 10px 15px; font:16px/16px "arial","Noto Sans TC"; text-align: center !important;color:#fff; 
transition: .5s;-webkit-transition: .5s; cursor: pointer; }
.c26H4Base span:hover { color: #fff200 }


/*
.c26H4Base { padding: 10px 0; text-align: center !important; position: fixed; top: 50px; right: 0; width: 100px; }
.c26H4Base span { display: block; margin: 0 0 2px 0; padding: 5px 10px 5px 10px; font:16px/16px "arial","Noto Sans TC"; text-align: center !important;color:#fff; background: rgba(0,0,0,0.8);
transition: .5s;-webkit-transition: .5s; cursor: pointer; }
.c26H4Base span:hover { color: #fff200 }
*/


/*C26*/
.group-type-ph { text-align: center !important;display: block; padding-top: 30px; width: 100%; max-width: 1400px;margin:0 auto; padding-bottom: 20px; }
.group-type-ph .ph { display: inline-block; position: relative; margin:10px; width:300px; text-align: left; vertical-align: top; overflow: hidden;}
.group-type-ph .ph a { display: block; width: 300px; height: 200px; }
.group-type-ph .ph .ph-img,.group-type-ph .ph .ph-img img{display: block;width:300px ; height:200px;margin:0 auto;}
.group-type-ph .ph .ph-img { position: absolute; width: 300px; height: 200px; z-index: 1;
transition: 1s;  -webkit-transition: 1s; }
.ph-title { position: absolute; bottom: 0; padding:2% 5%; width: 100% ; font: 500 16px/20px "arial","Noto Sans TC"; text-align: center; color: #fff;text-align: center !important; background: #cb307f; letter-spacing: 1px; z-index: 2}
.ph-detail { margin: 0 auto; padding:5% 3% 1% 3%; width: 100% ; font: 14px/20px "arial","Noto Sans TC"; letter-spacing: 1px; color: #fff;  overflow: hidden; background: rgba(0,0,0,0.7);
opacity: 0 ;transition: 1s;  -webkit-transition: 1s;}
.ph img { width: 300px; height: 200px; }
.ph-feature { margin: 0 auto; padding: 0 3%; width:100%; text-align: left;font: bold 14px/20px "arial","Noto Sans TC"; color: #fff;background: rgba(0,0,0,0.7);
opacity: 0 ;transition: 1s;  -webkit-transition: 1s; }
.ph em { display: block; padding-bottom: 100px;  width: 100%; font: bold 16px/30px "arial","Noto Sans TC"; color: #000; text-align: center !important; letter-spacing: 0px; color: #fff200; background: rgba(0,0,0,0.7);
opacity: 0;transition: 1s; -webkit-transition: 1s;}
.ph em span{ margin: 0 0 0 -5px ; font: bold 30px/30px "arial","Noto Sans TC"; color:  #fff200;}
.ph em i { margin: 0 0 0 -5px;line-height: 40px; }
.ph a,
.ph a:link { color: #000 }

.group-type-ph .ph:hover .ph-img { z-index: -1 ; } 
.group-type-ph .ph:hover .ph-detail { opacity: 1 }
.ph:hover .ph-feature { opacity: 1 }
.ph:hover em { opacity: 1 }
 


.florid .box2 { display: inline-block; width: 49%; }
.florid .box2 * { letter-spacing: normal; }
.florid h3 { font-weight: 500 }
.florid .group-type-ph { text-align: center !important;display: block; padding-top: 0px; width: 100%; max-width: 1400px;margin:0 auto; padding-bottom: 20px; }
.florid.smallWidth .group-type-ph { max-width: 1000px }
.florid.floridItemWidth .group-type-ph { width: 90%; max-width: 500px; }
.florid .group-type-ph .ph { display: inline-block; position: relative; margin:10px; width:100%; text-align: left; vertical-align: top; overflow: hidden;}
.florid .group-type-ph .ph a { display: block; width: auto; height: auto; margin: 0 auto }
.florid .group-type-ph .ph .ph-img { position: static; width: auto; height: auto; z-index: 1; transition: 1s;  -webkit-transition: 1s; }
.florid .group-type-ph  .ph-title { position: static; bottom: 0; padding:2% 1%; width: 100% ; font: 400 16px/20px "arial","Noto Sans TC"; text-align: center; color: #fff;text-align: center !important;
 background: #cb307f; letter-spacing: 1px; z-index: 2}
.florid .group-type-ph  .ph-detail { vertical-align: top;padding: 0 2%; opacity: 1 ;transition: 1s;  -webkit-transition: 1s; color: #2a2a2a; background: none}
.florid .group-type-ph .ph img { width:100%;  height: auto; }
.florid .ph-feature {position: static; letter-spacing: normal; margin: 0 auto; padding: 0 3%; width:100%; text-align: left;font: bold 14px/20px "arial","Noto Sans TC"; color: #2a2a2a;background: none;
opacity: 1 ;transition: 1s;  -webkit-transition: 1s; background: none}
.florid .group-type-ph  .ph em { display: block; padding-bottom: 0px;  width: 100%; font: bold 16px/30px "arial","Noto Sans TC"; color: #000; text-align: center !important; letter-spacing: 0px; color: #cb307f; background: rgba(0,0,0,0.7);
opacity: 1;transition: 1s; -webkit-transition: 1s;background: none}
.florid .group-type-ph  .ph em span{ margin: 0 0 0 -5px ; font: bold 30px/30px "arial","Noto Sans TC"; color: #cb307f;}
.florid .group-type-ph  .ph em i { margin: 0 0 0 -5px;line-height: 40px; }
.florid .group-type-ph  .ph a,
.florid .group-type-ph  .ph a:link { color: #000 }
.florid .group-type-ph h6 { display: inline-block;  font: bold 16px/30px "arial","Noto Sans TC"; color: #cb307f; }






#container .informationBase { margin:20px 0 100px 0; padding:0;   }
#container .informationBase h2 { margin:0px 0 20px 0; font:30px/30px "arial","Noto Sans TC"; color: #457cce; text-align: center; letter-spacing: normal; }
#container .informationBase .informationArea { position: relative; margin:0 auto;padding: 0px; width: 90%; max-width: 1440px; border-radius: 5px; overflow:; z-index: 1;
	letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
    *letter-spacing: normal; /* reset IE < 8 */
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */}
#container .informationBase .informationArea {}
#container .informationBase .informationArea img { width: 100%; vertical-align: top }
#container .informationBase .informationArea h3 { padding: 5px 0; width:100%; font:20px/16px "arial","Noto Sans TC"; color: #fff; text-align: center; letter-spacing: normal;  background:#000}
#container .informationBase .informationArea p { padding: 5px ;width:100%; font:16px/24px "arial","Noto Sans TC"; color: #555; text-align: center; letter-spacing: normal; }
#container .informationBase .informationArea .box3 { margin:0 5px; cursor: pointer; }

#container .informationShow { display: none; position: fixed; top:0; left: 0; width: 100%; height: 100vh; text-align:center;  background: rgba(0,0,0,0.8); z-index: 99999 }
#container .informationShow .box3 { margin:20px auto 0 auto; width: 90%; max-width: 800px; }
#container .informationShow .box3 img { width: 100% }
#container .informationShow .box3 h3 { padding: 5px 0; width:100%; font:30px/36px "arial","Noto Sans TC"; color: #fff; text-align: center; letter-spacing: normal;}
#container .informationShow .box3 p{ padding: 5px ;width:100%; font:18px/30px "arial","Noto Sans TC"; color: #fff; text-align: center; letter-spacing: normal; }
#container .informationShow .closeInformationShow { display: inline-block; padding: 5px 10px; font:18px/18px "arial","Noto Sans TC"; color: #fff; text-align: center; border: 1px solid #fff; letter-spacing: normal; cursor: pointer;}

#container  .photoBase .photoArea { margin-bottom:30px; padding: 10px; }
#container  .photoBase .photoArea h2 {  font: 200 22px/34px "arial","Noto Sans TC"; color: #fff; text-align: center; letter-spacing: 1px; background:#cb307f }
#container  .photoBase .photoArea img { margin-bottom: 10px; width: 100% }
#container  .photoBase .photoArea p { display: none ;font: 200 16px/24px "arial","Noto Sans TC"; color: #2a2a2a; text-align: left; }



div.fixTop { position: fixed; z-index: 20 }



.note { background: #555 }
.note ul { margin: 5% auto 0 auto; width: 80%; max-width: 1400px;font-size: 16px; line-height: 30px; color: #fff; font-weight: 100; text-align: left;}
.note ul li {font: 200 14px/24px "arial","Noto Sans TC"; text-align: left; letter-spacing: 1px }
.note ul li strong { color: #fff800 }
.note ul li a:link,
.note ul li a:visited { color: #fff !important; text-decoration: underline !important; }

*.backGroundColor1 { width: 100%; max-width: 100%; background: rgba(203,48,127,1) }
*.backGroundColor1 .group-type-ph .ph-title { background: #2951ff; color: #fff800 }
*.backGroundColor1 .group-type-ph .ph-feature,
*.backGroundColor1 .group-type-ph .ph-detail { background: #fff; color: #2a2a2a }
*.backGroundColor1 .group-type-ph .ph em { background: #fff }
 h3 { font: 200 24px/36px "arial","Noto Sans TC"; color: #cb307f; text-align: center; letter-spacing: normal;  }
*.backGroundColor1 h3 { color: #fff }
*.backGroundColor1 h2 { color: #fff !important }



.content_base { margin-top: 50px  }
.content_title > img { width: auto; max-width: 100% }
.memnerBnArea { display: inline-block; width:auto; height:auto; }
.memnerBnArea .memnerBnAreaTitle { margin: 0 0 -15px 0 ; text-align: center; }
.memnerBnArea .memnerBn { background: #7f2ccb; text-align: center; }
.memnerBnArea .memnerBn img { margin: 3%; width: 94% }

.shareCashGuide { margin: 0 0 3% 0; }
.shareCashGuide li { display: block; padding: 10px 15px; margin: 1% auto; width:100%; max-width: 800px; height: auto ; font: 16px/20px "arial","Noto Sans TC";color:#2b2b2b; background:#ffce27; }
.shareCashGuide li strong { font-weight: bold; text-decoration: underline; color: #000 !important; }

.content_area .text h6 { font:bold 30px/40px "arial","Noto Sans TC"; text-align: center; }
.content_area .text h4 { font:bold 20px/28px "arial","Noto Sans TC"; text-align: left; color:#f0e325; }
.content_area .text p { margin: 0 auto 10px auto; max-width: 800px; font:16px/24px "arial","Noto Sans TC"; text-align: left; }


.couponsCatch { margin: 20px 0; }
.couponsCatch .coupons { width: 90%; max-width: 800px; box-shadow: 3px 3px 10px rgba(0,0,0,0.3); cursor: pointer; transition: .5s; -webkit-transition: .5s }
.couponsCatch .coupons:hover { transform: translateY(-20px); }

.memberAlertBase { position: fixed; top:0; left: 0; padding: 10%; width: 100vw; height: 100vh; text-align: center; background: rgba(0,0,0,0.8); z-index: 99999; }
.memberAlertArea { display: inline-block; padding: 20px; background: #fff; }
.memberAlertBase p { margin-bottom:30px; font: 200 20px/28px "arial","Noto Sans TC"; text-align: center; color:#2a2a2a }
.memberAlertBase .button { display: inline-block; padding: 5px 20px;  border-radius: 20px; background: #cb307f; box-shadow: 0 3px 0 rgba(0,0,0,0.5) }
.memberAlertBase .button a { font: 200 16px/28px "arial","Noto Sans TC"; text-align: center; color:#fff200; }
.closeMemberAlertBase { margin: 50px auto 0 auto; width: 150px; font: 200 16px/28px "arial","Noto Sans TC"; text-align: center; color:#ddd; border: 1px solid #ddd; cursor: pointer; }


@media only screen and (max-width: 1300px) {
#container .topBanner .video video { margin-top: 0; }
}

@media only screen and (max-width: 1000px) {
#container .mainPageButton ul li {  padding: 5px 5px;}
#container .mainPageButton ul li a b { display: block; font: 500 18px/18px "arial","Noto Sans TC"; color: #fff; text-align: center;  }
#container .mainPageButton ul li a small { display: block; font: 200 12px/18px "arial","Noto Sans TC"; color: #fff; text-align: center; letter-spacing: 2px }



}

@media only screen and (max-width: 800px) {
#container .topBanner .img img {width: 200% }


}


@media only screen and (max-width: 768px) {
.mobileMenuButton { display: inline-block; position: fixed; bottom:0; left:calc(50%); padding: 5px; width:auto; height:auto; z-index: 999; background: rgba(0,0,0,0.5) }
#container .mainPageButton { position:fixed; top:-100vh; left: 0; width: 100%; height: 100vh;margin-bottom:0;background: rgba(0,0,0,0.8); z-index:98; }
#container .mainPageButton ul { margin:0 auto;padding: 0px; width: 90%; max-width: 1440px; text-align: center; }
#container .mainPageButton ul li { display: block; margin:5px 0; padding: 5px 10px; border-right: none; }
#container .mainPageButton ul li a,
#container .mainPageButton ul li a:link { font:16px/16px "arial","Noto Sans TC"; color: #fff }

#container .topBanner.game .img { height: 300px} 
#container .topBanner h1.game { top:0; }
#container .topBanner h1 { position: absolute; top:0%; width: 100%; }
#container .topBanner h1 img { width: 80% }
#container .topBanner h1 > div { text-align: center;}
#container .topBanner h1 > div img { width: auto; padding-top: 10% }
#container .topBanner h1 > div.textCenter > img { width: 100%; padding-top: 10% }
#container .topBanner .img img {width: 100% }

#container .topBanner h1 > div .animationBird { position: absolute; top:-25px; right: -10%; transform: scaleX(-1); }
#container .topBanner h1 > div .animationBird img {  transform: scale(0.5); }

#container .topBanner h1 .text b { font:40px/40px "arial","Noto Sans TC"; color: #fff; text-align: center;  }
#container .topBanner h1 .text small { display: inline-block; transform: translateY(0px); padding: 2px 5px; font: 16px/16px "arial","Noto Sans TC";  letter-spacing: 5px; border:1px solid #fff; }

#container .topBanner .img { height:auto; }


#container .hasButton { position: relative; z-index: 1 }
#container .hasButton .secButton { display: block; position: static;width: 100%; z-index: 2; background: rgba(255,255,255,0.2) }
#container .hasButton .secButton a { display: block; padding: 5px 0 }




.contentBase > article { display: block; letter-spacing: normal; }
.contentBase .photoBase { padding-top: 30px; width: 100%; }
 #container .contentBase .photoBase .photoArea { display: inline-block; width: 49% ; padding: 0; margin-bottom: 0;  }
 #container  .photoBase .photoArea h2 {  font: 200 14px/20px "arial","Noto Sans TC"; }

.itemBase { padding:0; width: 100%; }



#container .carrier ul li {  padding-bottom:8%;  }
#container .carrier ul li a img { display: block; margin: 0 auto; margin-left: -2%; margin-top:-2%; width: 104%; height: auto; }
#container .carrier ul li a { text-align: left; padding: 2% }
#container .carrier h4 { padding:0 5%;  font: 20px/20px "Noto Sans TC","arial";  }

/*C26*/
.group-type-ph .ph { display: inline-block; position: relative; margin:10px; width:300px; text-align: left; vertical-align: top; overflow: hidden;}
.group-type-ph .ph a { display: block; width: 300px; height:auto; }
.group-type-ph .ph .ph-img,.ph-title { position: static;}
.ph-detail,.ph-feature,.ph em { opacity: 1 ; color: #000 ; background: none }
.ph em { display: block; padding-bottom:0; color:#cb307f ; }
.ph em span { color:#cb307f }

/*
.c26H4Base { padding: 0px 0; text-align: center !important; position: static; top: 0px; left: 0; width: 100%; 
	overflow: hidden;overflow-y: hidden; overflow-x:auto;-webkit-overflow-scrolling: touch;overflow-scrolling: touch;; }
.c26H4Base div {position:relative; width: 100%; z-index: 10; padding: 0 0px; white-space:nowrap; width:auto; border-radius: 0; text-align: left !important;}
.c26H4Base span { display: inline-block; margin: 0 0 0px 0; padding: 10px 15px; font:16px/16px "arial","Noto Sans TC"; text-align: center !important;color:#fff; background: rgba(0,0,0,0.8);
transition: .5s;-webkit-transition: .5s; cursor: pointer; }
.c26H4Base span:hover { color: #fff200 }
*/

}


@media only screen and (max-width: 650px) {
#container .topBanner h1 > div .animationBird { right: -40% }
}
@media only screen and (max-width: 480px) {
#container .topBanner.game .img { height:  ;} 
#container .topBanner h1 > div .animationBird { right: -50% }
}
@media only screen and (max-width: 410px) {

#container .topBanner h1 > div .animationBird { right: -80% }
}




/*
.mobileFilterButton { top:calc(100vh - 40px); right:50vw };
*/
/*複寫C23篩選器的CSS*/
.areaIntroduction { display: none !important }
#c23FilterArea #slider-range .ui-widget-header ,
#c23FilterArea #searchRight #searchStart ,
#c23FilterArea #searchRight #searchCancel ,
#c23FilterArea #h4ButtonBase p,
#c23FilterArea .areaIntroduction,
#c23FilterArea #h4ButtonBase .colorMat { background:#cb307f; text-align: center; }
#c23FilterArea .showPrice { text-align: center; }
#c23FilterArea #amount { color:#cb307f  }