@charset "utf-8";
html,body{margin:0;height: 100%;}
body{font-size:100%;line-height: 1.5; font-family: "微軟正黑體", 'Century Gothic' ; color: #424242; position: relative; background-color: #9388ff;}
a{text-decoration:none; color: #333;text-decoration: underline;color: #9388ff;
}
a:hover{
    text-decoration: underline;
    color: #574bd5;
    font-size: 1em;
}
img{border: 0 none; line-height:0; display: block;}
form {margin:0;	padding:0;}
ul, ul li {margin: 0;padding: 0;  list-style-type: none;}
dl, dt, dd {margin: 0;padding: 0;}
dl {height: 1%;}
button{border:0 none; cursor:pointer;padding: 0;margin: 0;background: transparent;}
.clearfix:before,.clearfix:after {content: "";display: table;height: 0;overflow: hidden;}
.clearfix:after {clear: both;}
.clearfix {	zoom: 1;}
h1,h2,h3,p{margin:0;padding: 0;}
/*-------------------------------------Globe------------------------------------------------*/


/*主視覺*/
.Header{background:  url(../images/bg.jpg) repeat-x top center; margin: 0 auto 1% auto;}
.Header img {  width: 1280px; height: auto; margin: 0 auto;}

.Wrapper{width: 950px; margin: auto;position: relative;height: auto;}
.Masthead .Wrapper{overflow: hidden;}
.Splash{background: url(../images/main.png) no-repeat top center;position: absolute;right: 0;left: 0; top: 0; bottom: 0;z-index: 2;}
.TopTitle{ padding: 40px 0 260px 30%; text-align: center;position: relative;z-index: 3;}





.Discount{font-size: 9.5rem;color: #e93536; font-weight: bold;line-height: .8;position: relative;margin-bottom: 30px;}
.Discount::before {content: "$"; font-size: 3rem;}
.Label{font-size: 2rem; color: #fff;letter-spacing: 1px;width: 320px;line-height: 1.3;z-index: 1;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d75555+1,ea464c+50,f15258+51,ed4a4f+98,e5383e+100 */
background: #d75555; /* Old browsers */
background: -moz-linear-gradient(top, #d75555 1%, #ea464c 50%, #f15258 51%, #ed4a4f 98%, #e5383e 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #d75555 1%,#ea464c 50%,#f15258 51%,#ed4a4f 98%,#e5383e 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #d75555 1%,#ea464c 50%,#f15258 51%,#ed4a4f 98%,#e5383e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d75555', endColorstr='#e5383e',GradientType=0 ); /* IE6-9 */
left: 50%;
position: absolute;
top: 50%;
margin: 56px 0 0 -20px;
padding-left: 130px;
z-index: 1;
}
.Label:before{content: "";position: absolute;right: 0;width: 0;top: -3px;
height: 0;
border-style: solid;
border-width: 24px 20px 24px 0;
border-color: transparent #fffeff transparent transparent;}
.AppBlock{ background-color: #434343;color: #fff;text-align: center;}
#AppM .AppBlock{padding: 1%;}
.AppBlock ul {width: 605px; margin: auto;}
.AppBlock ul li{display: inline-block; text-align: center;}

.AppBlock ul li:first-child a{ background-image:url(../images/appdownload.png);display: block;	width: 450px; height: 150px;background-size: 100%; text-indent: -9999px;}
.AppBlock ul li:first-child a:hover{ background-image:url(../images/appdownloadhover.png);}

.AppBlock ul li:last-child a{ background-image:url(../images/qrcode2.png); width: 150px; height: 150px;background-size: 100%; text-indent: -9999px;display: block;}
.ActivityRow{margin:0 auto;text-align:justify; color: #fff; font-size: 1.2rem;line-height: 1.8;}
.WTxt{display:inline-block;vertical-align:top}
.Txt{display:inline-block;width:90%}
.ActivityRow a{color: #ffff00;text-decoration: underline;}
.Table{width:100%;text-align:center;font-size: 1rem;}
.Table th{background:#373737;color:#fff;}
.Table td{padding:1%;background-color:#fff5dd;color: #373737;}
.Tip{ font-size: 1rem;}
.Pw{border: 0; height:60px; width:200px; color:#3F3F3F; padding: 5px;font-weight: 1.3rem;}
form label{display: block;font-size: 1.2rem; line-height: 1.5;margin-bottom: 1%;}
.BtnSubmit{background: url(../images/btn.png);width: 97px;height: 80px;vertical-align: top;border: 0 none;text-indent: -9999px;}
.InputPW{border: 0;height:60px; width:200px; padding: 5px;color:#3F3F3F;  font-size: 2rem;}
.InputPW:focus{border:1px solid #C10003;}

/*說明文字*/
.info_title{
    margin: 0 auto;
    padding: 2% 3%;
    color: #ffffff;
    font-size: 2em;
    line-height: 1.3em;
    background-color: #ff467a;
    text-align: center;
    -webkit-border-top-left-radius: 30px;
    -webkit-border-top-right-radius: 30px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}

.info_word span{ color: #EA4447; font-size: 1.4em; }
.info_word{ color: #474747; font-size: 1em; }

.word_bg{  
    background-color:#fff0f1;
    background-color: #fff0f1;
    padding: 1% 0;
    margin: 0 0 3% 0; 
}

.word_box{  margin:  0 auto; width: 80%; }



@media screen and (max-width:768px){
	.Wrapper{width:100%;height: auto;}
	.AppBlock ul li:first-child{width: 72%;}
	.AppBlock ul li:last-child{width: 26%;}
	.AppBlock ul li:first-child a{width: 100%;height: 0;padding-bottom: 34%;}
	.AppBlock ul li:last-child a{width: 100%;height: 0;padding-bottom: 100%;}
	.AppBlock ul{width: 100%;}
	.RoutinePage{padding: 5%;}
	.Splash{background-size: 105%;}
	.TopTitle{padding:5% 5% 25% 30%;}

	.TopTitle .Caption1{font-size: 3vmin}
	.TopTitle .Caption2{font-size: 11vmin; margin: 0 auto 2% auto;}
	.TopTitle .Caption3{
	font-size: 3.4vmin;
    line-height: 1.4;
    padding-left: 10%;
	}
	
	.Discount{font-size: 14vmin;}
	.Discount:before{font-size:5vmin;}
	.Label {width: 42%;padding: 0 0 0 12%;font-size: 3vmin;margin: 7% 0 0 0;}
	.Label:before{display: none;}
	.Header{background-size: 180%;}

/*主視覺*/
.Header img {  width: 100%; height: auto; margin: 0 auto;}
    
/*說明文字*/
.info_title{
    padding: 3%;
    font-size: 1.6em;
}

}