@charset "utf-8";
body {font-size:16px; font-family:Arial, Helvetica, "微軟正黑體";line-height:150%; color:#222; background-color:#a90018; margin:0; padding:0;}
html {width:100%;height:auto;}
div, p, ul, ol{ margin:0; padding:0;border:0;}
img {border:0; margin:0; padding:0; display:block;}

ul {list-style:none; margin:0; padding:0;}
a {text-decoration:none;}

.fL {float:left;}
.fR {float:right;}
.tL {text-align:left}
.tR {text-align:right}
.tC {text-align:center}
.tB{ font-weight:bold;}
.clr {clear:both;}

/*顯示隱藏-大網*/
.m-none {display:block;}
.m-block {display:none;}

/*頁面設定*/
.pagesize{ margin:0 auto; width:1000px; background-color: #8b0014;/* -moz-box-shadow:0px 0px 10px 0px rgba(40,75,83,0.3); -webkit-box-shadow:0px 0px 10px 0px rgba(40,75,83,0.3); box-shadow:0px 0px 10px 0px rgba(40,75,83,0.3);*/}

.view_Box{ height:570px; background:url(../images/view_bg.jpg) no-repeat;}
.view_Box img{ display:none;}

.award_Box{ height: 311px; background: url(../images/award.jpg) no-repeat;}
.award_Box img{ display: none;}

.step_Box{ height:502px; background:url(../images/step.jpg) no-repeat; position:relative;}
.appSET{ display: none;}
.step_Box .app_and{ width:120px; height:185px; position:absolute; top:220px; left:64px;}
.step_Box .app_ios{ width:120px; height:185px; position:absolute; top:220px; left:190px;}
.step_Box .hamipass{ width:250px; height:230px; position:absolute; top:210px; left:375px;}
.step_Box .cakeTurn{ display:none;}
.step_Box .app_and a, .step_Box .app_ios a, .step_Box .hamipass a, .step_Box .cakeTurn a{ width:100%; height:100%; display:block;}
.step_Box img{ display:none;}

.notice_Box{ padding:0 50px 45px 50px; background: url(../images/notice_Box_bg.png) repeat-x;}
.notice_Box p{ color: #fff; text-align: center; font-size: 18px; font-weight: bold; padding: 45px 0 30px 0;}
.notice_Box ol{ padding-left:20px;}
.notice_Box li{ padding-left:10px; margin-bottom:15px; color: rgba(255, 255, 255, 0.8);}


/*---------------for 小網---------------*/
@media screen and (max-width: 603px) {

.pagesize { width:100%;}
	
.view_Box{ height:auto; background:none;}
.view_Box img{ width:100%; height:auto; display:block;}
	
.award_Box{ height:auto; background:none;}
.award_Box img{ width:100%; height:auto;  display: block;}

.appSET{ display:block;}
.appSET .and{ width: 50%; display: inline-block; vertical-align: middle;}
.appSET .ios{ width: 50%; display: inline-block; vertical-align: middle;}
.appSET img{ width:100%; height:auto; display:block;} 
.step_Box{ height:auto; background:none;}
.step_Box .app_and{ width:50%; height:auto; position:static; }
.step_Box .app_ios{ width:50%; height:auto; position:static; }
.step_Box .hamipass{ width:100%; height:auto; position:static; }
.step_Box .cakeTurn{ width:100%; height:auto; display:block; position:static;}
.step_Box .app_and img, .step_Box .app_ios img, .step_Box .hamipass img, .step_Box .cakeTurn img{ width:100%; height:auto; display:block;}

.notice_Box{ padding:0 20px 25px 20px;}
.notice_Box p{ padding: 30px 0 20px 0;}
.notice_Box li{ padding-left:5px; margin-bottom:5px;}

}

