@charset "utf-8";

*
{ font-family:'Noto Sans TC', 'PingFangHK-Regular', '微軟正黑體', Arial, Verdana, Geneva, sans-serif; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400;}

/* Main Setting
***********************/
html, body
{ background:#fff; font-size:12px; }
.desbreak
{ display:block; }
.mobbreak
{ display:none; }


#wrapper
{ position:relative; width:100%;}
.mainContent
{ width:100%; max-width: 1000px; margin:0px auto;}

.logo{ max-width:300px; text-align:left}
.slogo{ width:80%; max-width: 150px;}
.slogo img{ width:100%; }
a{ color:#808080}
/* Banner Setting Start
**********************/
.bannerRow
{ position:relative; width:100%; max-width: 1000px;}
.bannerRow img.bg, .img-res
{ width:100%; height: auto;}

/* Promotion Content Setting Start
**********************/
.promotionContentRow
{ position:relative; padding:10px 50px 0px 50px; background:#000 url(../images/bg.jpg) repeat-y; background-size: contain; }

.promotionContentRow h1
{ position:relative; width:90%; max-width: 800px; margin:0px auto; margin-bottom: 40px; font-size: 46px; line-height: 1.5; color:#316475; text-align: center; font-weight: bold; }
.promotionContentRow h1 span
{ font-family: 'Montserrat', sans-serif; font-weight: bold;}

.leadinRow
{ position:relative; width:94%; max-width: 700px; margin:0px auto; padding-bottom: 22px; z-index: 5;}
.leadinRow p b
{ font-size:26px; line-height: 1.3; color:#44341d; font-weight: 700; text-align: left; letter-spacing: 0px;}
.leadinRow p
{ display:block; font-size:23px; line-height: 1.5; color:#44341d; font-weight: 700; text-align: left; letter-spacing: 1.3px; padding-bottom:28px;}
.leadinRow p span
{ font-family: 'Montserrat', sans-serif; font-weight: 800;}
.leadinRow p b
{ font-weight: 900;}
.leadinRow p b.discount
{ font-size: 27px;}
.leadinRow p a
{ font-size:23px; line-height: 1.3; color:#e5149b; font-weight: 700; font-family: 'Montserrat', sans-serif;}
.leadinRow p a:hover
{ color:#ff29b3; }

/* Detail Tbl Setting
********************/
.detailTblRow
{}
.detailTblRow .row01Group
{ width:100%; }
.detailTblRow .rowInner
{ width:94%; max-width: 700px; margin:0px auto; }
.detailTblRow .rowInner .col01
{ padding:10px 0px; width:33%; text-align: left; color:#ee7d00;}
.detailTblRow .rowInner .col02
{ padding:10px 0px; width:22%; text-align: left; color:#4d4d4d;}
.detailTblRow .rowInner .col03
{ padding:10px 0px; width:50%; text-align: left; color:#808080;}
.detailTblRow .rowInner .col04
{ padding:10px 0px; width:23%; text-align: center; color:#BE2329;}


.tCell {
    vertical-align:  top;
}

.detailTblRow .rowInner.row01 .tCell
{ vertical-align: top; font-size:24px; line-height: 1.3; font-weight: 700;}


.detailTblRow .row02Group
{ width:100%;  }
.detailTblRow .rowInner.row02
{ }
.detailTblRow .row02Group.last .rowInner.row02
{ border-bottom:none; }
.detailTblRow .rowInner.row02 .col01
{ font-size:15px; line-height: 1.3; font-weight: 700;}
.detailTblRow .rowInner.row02 .col01 b
{ display:block; font-size:15px; line-height: 1.3; font-weight: 700;}
.detailTblRow .rowInner.row02 .col02
{ font-size:15px; line-height: 1.3; font-weight: 700;}
.detailTblRow .rowInner.row02 .col03
{ font-size:15px; line-height: 1.3; font-weight: normal;}
.detailTblRow .rowInner.row02 .col03 b
{ font-size:28px; line-height: 1.3; font-weight: 700;}
.detailTblRow .rowInner.row02 .col04
{ font-size:15px; line-height: 1.3; font-weight: 700;}
.detailTblRow .rowInner.row02 .col04 b
{ font-size:28px; line-height: 1.3; font-weight: 700;}

.bottomDeco
{ background:#B0E8E0; text-align: right; }
.bottomDeco img 
{ width:auto; height: 122px; }

@media only screen and (max-width: 768px)
{

.promotionContentRow h1
{ margin-bottom: 40px; font-size: 40px; }

.leadinRow
{ padding-bottom: 22px; }
.leadinRow p b
{ font-size:20px;}
.leadinRow p
{ font-size:20px; padding-bottom:28px; letter-spacing:0px;}

}

@media only screen and (max-width: 640px)
{

.leadinRow
{ padding-bottom: 22px; }
.leadinRow p b
{ font-size:16px;}
.leadinRow p
{ font-size:16px; padding-bottom:28px;}


.bottomDeco img 
{ width:auto; height: 80px; }
}

@media only screen and (max-width: 450px)
{


.desbreak
{ display:none; }
.mobbreak
{ display:block; }


.leadinRow
{ padding-bottom: 3vw; width:94%; }
.leadinRow p b
{ font-size:5vw;}
.leadinRow p
{ font-size:4vw; padding-bottom:5vw; }


/* Detail Tbl Setting
********************/
.detailTblRow .rowInner
{ width:94%; }
.detailTblRow .rowInner .col01
{ padding:10px 0px; width:100%;}
.detailTblRow .rowInner .col02
{ padding:10px 1%; width:20%;}
.detailTblRow .rowInner .col03
{ padding:10px 1%; width:24%;}
.detailTblRow .rowInner .col04
{ padding:10px 0px; width:20%;}


.detailTblRow .rowInner.row01 .tCell
{ font-size:4vw;}

.detailTblRow .rowInner.row02 .col01
{ font-size:3.2vw; width: 100%;}
.detailTblRow .rowInner.row02 .col01 b
{ font-size:3.2vw;}
.detailTblRow .rowInner.row02 .tRow
,.tCell
{ display: block;}
.detailTblRow .rowInner.row02 .col02
{ font-size:3.2vw;width: 100%;
padding:0 0 5px 0}
.detailTblRow .rowInner.row02 .col03
{ font-size:3.2vw;width: 100%;
padding:0 0 15px 0;}
.detailTblRow .rowInner.row02 .col03 b
{ font-size:4.5vw;}
.detailTblRow .rowInner.row02 .col04
{ font-size:3.2vw;}
.detailTblRow .rowInner.row02 .col04 b
{ font-size:4.5vw;}

.bottomDeco img 
{ width:auto; height: 15vw; }
}

