/* CSS Document */
@charset "utf-8";

@-webkit-viewport   { width: device-width; }
@-moz-viewport      { width: device-width; }
@-ms-viewport       { width: device-width; }
@-o-viewport        { width: device-width; }
@viewport           { width: device-width; }

/* General usage */
@font-face{font-family:reader;font-style:normal;font-weight:700;src:url(../fonts/reader-bold-web.eot?) format("eot"),url(../fonts/reader-bold-web.woff) format("woff"),url(../fonts/reader-bold-web.ttf) format("truetype"),url(../fonts/reader-bold-web.svg#reader) format("svg")}
@font-face{font-family:reader;font-style:normal;font-weight:400;src:url(../fonts/reader-medium-web.eot?) format("eot"),url(../fonts/reader-medium-web.woff) format("woff"),url(../fonts/reader-medium-web.ttf) format("truetype"),url(../fonts/reader-medium-web.svg#reader) format("svg")}
@font-face{font-family:reader;font-style:normal;font-weight:300;src:url(../fonts/reader-regular-web.eot?) format("eot"),url(../fonts/reader-regular-web.woff) format("woff"),url(../fonts/reader-regular-web.ttf) format("truetype"),url(../fonts/reader-regular-web.svg#reader) format("svg")}

html, body{ font-family: reader,Helvetica,"Noto Sans CJK TC","Noto Sans TC","微軟正黑體","Microsoft JhengHei",MHei,PMingLiU,"儷黑 Pro","LiHei Pro","新細明體",Arial,sans-serif; height:100%; font-size:1em; }
.cbtn,
.btnclass { cursor:pointer; }
#content-wrapper{ position:relative; margin:0 auto; height:100%; }

/* Facebook */
.removescroll{ overflow:hidden; }
.removecount { overflow:hidden; height:21px; width:51px;}

/* Hover Button */
.mbtn{ cursor:pointer; background:left top no-repeat; display:block; }
.mbtnactive,
.mbtn:hover{ background-position:left bottom; }

.btn_checkbox.mbtnactive{ background-position:left bottom; }

/* lightbox & Loader */
.dialog,
.mask{ display:none; }
.dialog{ position:absolute; z-index:10000; }
.mask {position: fixed; top:0; left: 0; background: rgba(0,0,0,0.7); z-index: 9999; width: 100%; height: 100%;}
.premask {position: fixed; top:0; bottom:0; left:0; right:0; margin:auto; background: rgba(255,255,255,1); z-index: 10000; width: 100%; height: 100%; display:block;}
.btnclose{ position:absolute; top:0px; right:0px; cursor:pointer; z-index:5; display: inline-block; line-height: 0px; }
.btnclose:before { content: "×"; }
.cdialog{ position:fixed; top:0; bottom:0; left:0; right:0; margin:auto; }
.popcontent{ width:100%; height:100%; overflow-y:auto; position:relative; }

#loader{ position:fixed; top:0; bottom:0; left:0; right:0; margin:auto; z-index:10000; font-size: 10px; text-indent: -9999em;
	border-top: 1.1em solid #EEE; border-right: 1.1em solid #E21A47; border-bottom: 1.1em solid #EEE; border-left: 1.1em solid #E21A47;
	-webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 1.1s infinite linear; -ms-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear;
}
#loader,
#loader:after{ border-radius: 50%; width: 10em; height: 10em; }
@-ms-keyframes load8 {
	0%{ -ms-transform: rotate(0deg); }
  100% { -ms-transform: rotate(360deg);  }
}
@-webkit-keyframes load8 {
	0%{ -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg);  }
}
@keyframes load8 {
  0%{ transform: rotate(0deg); }
  100%{ transform: rotate(360deg); }
}

.sred{ color:#E21A47; } 
.bgcolor{ background-color:#064095; }
.bgwhite{ background-color:#FFF; }
.bgyellow{ background-color:#FF0; }
.bgpurple{ background-color:#FAF8FD; }
.linebar{ border:1px solid #E5E4E9; }

.sgold{ background-color:#D4B35B; }

/* The container */
.checkbox-container { display:inline-block; position: relative; padding-left: 36px; margin-top:6px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
/* Hide the browser's default checkbox */
.checkbox-container input { position: absolute; opacity: 0; cursor: pointer; height:inherit !important; font-size:inherit !important; }
/* Create a custom checkbox */
.checkbox-container .checkmark { position: absolute; top: 0px; left: 0; height: 20px; width: 20px; border: 1px solid #000; background-color:transparent; }
/* On mouse-over, add a grey background color */
.checkbox-container:hover input ~ .checkmark { background-color: #FFF; }
/* When the checkbox is checked, add a blue background */
.checkbox-container input:checked ~ .checkmark { background-color: #FFF; }
/* Create the checkmark/indicator (hidden when not checked) */
.checkbox-container .checkmark:after { content: ""; position: absolute; display: none; }
/* Show the checkmark when checked */
.checkbox-container input:checked ~ .checkmark:after { display: block; }
/* Style the checkmark/indicator */
.checkbox-container .checkmark:after {  left: 5px; top: 0px; width: 8px; height: 15px; border: 1px solid #E21A47; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

/* Customize the label (the container) */
.radio-container { display:inline-block; position: relative; padding-left: 36px; margin-bottom: 12px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-weight:normal; padding-right:10px; }
/* Hide the browser's default radio button */
.radio-container input { position: absolute; opacity: 0; }
/* Create a custom radio button */
.radio-container .checkmark { position: absolute; top: 0; left: 0; height: 22px; width: 22px; border: 1px solid #000; background-color:transparent; border-radius: 50%; }
/* On mouse-over, add a grey background color */
.radio-container:hover input ~ .checkmark { background-color: #FFF; }
/* When the radio button is checked, add a blue background */
.radio-container input:checked ~ .checkmark { background-color: #000; }
/* Create the indicator (the dot/circle - hidden when not checked) */
.radio-container .checkmark:after { content: ""; position: absolute; display: none; }
/* Show the indicator (dot/circle) when checked */
.radio-container input:checked ~ .checkmark:after { display: block; }
/* Style the indicator (dot/circle) */
.radio-container .checkmark:after { top: 6px; left: 6px; width: 8px; height: 8px; border-radius: 50%; background: white; }

/* custom css start from below */
.btnclose{ top:20px; right:20px; color: #000; font-size: 50px; font-weight: bold; padding: 5px; }
.bold{ font-weight:bold; }
.mobileshow{ display:none; }

.xcenter{ left:50%; -ms-transform: translate(-50%); -webkit-transform: translate(-50%); transform: translate(-50%); position:absolute; }
.ycenter{ top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); position:absolute; }
.ccenter{ top:50%; left:50%; -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); position:absolute; }

.nopadding{ padding-left:0; padding-right:0; }
.nomargin{ margin-left:0; margin-right:0; }

#content-wrapper{ width:100%; max-width:1920px; }
body{ background-color:#FFF; color:#000; }

.btntop{ display:none; height: 40px; width: 40px; position: fixed; bottom: 120px; right: 20px; z-index: 10; border:1px #E21A47 solid; background: #E21A47 url(../images/btn_top.svg) no-repeat center 50%; opacity:0.8; cursor:pointer; }

/*

*/
#menu{ display:block; width:100%; position:absolute; top:0; left:0; }
.mmenu{ display:block; width:64px; height:64px; position:absolute; top:0; left:0; z-index:99; background:url(../images/1920/btn_menu.png) top left no-repeat; cursor:pointer;  }
.mmenu.mmactive{ background-position:left bottom; }
.pop_menu{ display:none; position:absolute; top:64px; left:0; z-index:10; }
#menu .pop_menu_item{ display:block; cursor:pointer; width:500px; height:64px; }
#menu .pop_menu_item:hover{ background-position:left bottom; }

.menu1{ background:url(../images/1920/btn_menu1.png) left top no-repeat; }
.menu2{ background:url(../images/1920/btn_menu2.png) left top no-repeat; }

section{ position:relative; display:block; width:100%; max-width:1920px; margin:0 auto; }

.form-control::-webkit-input-placeholder { color:#BABABA; }
.form-control:-moz-placeholder { color:#BABABA; }
.form-control::-moz-placeholder { color:#BABABA; }
.form-control:-ms-input-placeholder { color:#BABABA; }
.form-control{ color:#000; background-color:#FFF; border:#666 solid 1px; border-radius:0px; box-shadow:none; padding:6px 8px;}
.form-control.form-control-no-border{ border:none; background-color:transparent !important; }
.form-control.form-control-bottom-border{ border:none; background-color:transparent !important; border-bottom:1px solid #666; }
.form-control.shop{ color:#000; background-color:#FFF; }

.form-control:focus{ border:#666 solid 1px; outline: 0; -webkit-box-shadow: none; box-shadow: none; }
.form-control.form-control-no-border:focus{ border:none;outline: 0; -webkit-box-shadow: none; box-shadow: none; }
.form-control.form-control-bottom-border:focus{ border:none; outline: 0; -webkit-box-shadow: none; box-shadow: none; border-bottom:1px solid #666; }

/*
.formfields input, .formfields select, .formfields textarea{font-size:20px;}
.formfields input, .formfields select{ height:55px; }
*/

.topheader{ background:url(../images/1920/hss1.jpg) top center no-repeat; height:476px; }

.bg{ border:1px solid #000; }

.bg .row{ margin-bottom:15px; }
.bg .caption{ background-color:#EEE; margin-left:-15px; margin-right:-15px; }
.bg .caption .grayblock{ padding:10px 50px; position:relative; display:block; height:192px; }
.bg .caption .grayblock .icon{ padding-top:15px; float:left; }
.bg .caption .grayblock .contenttxt{ top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); position:absolute; left:240px; padding-right:50px; line-height:2.5em; }
.bg .caption .grayblock .contenttxt p:last-child{ margin:0 !important; }
.bg .title{ text-align:center; margin-bottom:5px; font-size:2em; color:#E21A47; line-height:0.8; margin-top:15px; }
.bg .subtitle{ text-align:center; margin-bottom:10px; font-size:1.5em; letter-spacing:3px; text-indent:3px; }
.bg .step1txt .blackbar{ padding-right:5px; border-left:3px solid #000; }

.bg .fixheight{ height:850px; }
.btnleanmore{ color:#FFF; box-shadow: 0px 0px 50px #9A0000; text-shadow: 1px 1px 2px #9A0000, 0 0 25px #9A0000, 0 0 5px #9A0000; padding:5px 20px; margin:0 auto; text-decoration:none; font-size:1.2em; border:2px solid #fff; border-radius:2px; }
.btnleanmore:hover, .btnleanmore:active, .btnleanmore:focus{ color:#FFF; text-decoration:none; }
.bg .fixheight2{ height:90px; }
.bg .formfix{ max-width:700px; }
.bg .formfix .fixtxt{ line-height:34px; }
.bg .formfix .row{ margin-bottom:15px; }
.bg .formfix .btnauth{ padding:5px 20px; cursor:pointer; border:1px solid #E21A47; background-color:#E21A47; text-align:center; display:block; color:#FFF; }
.bg .formfix .btnsubmit{ background:url(../images/1920/btn_submit.jpg) center no-repeat; width:212px; height:41px; margin:0 auto; display:none; cursor:pointer; }

.btnpre{ background:url(../images/1920/btn_back.jpg) left top no-repeat; width:212px; height:41px; cursor:pointer; display:none; }
.btnnext{ background:url(../images/1920/btn_next.jpg) left top no-repeat; width:212px; height:41px; cursor:pointer; display:none; }

.step1title{ background:url(../images/1920/step1.jpg) center no-repeat; width:100%; height:100px; }
.step2title{ background:url(../images/1920/step2.jpg) center no-repeat; width:100%; height:100px; }
.step3title{ background:url(../images/1920/step3.jpg) center no-repeat; width:100%; height:100px; }

.step1content{ max-width:700px; }
.step1content .row{ margin-bottom:20px; }
.step1content .listtxt{ border:1px solid #CCC; line-height:38px; color:#E21A47; font-size:1em; }
.step1content .listtxt.active{ border:1px solid #E21A47; font-weight:bold; }
.step1content .form-control.shop{ border:1px solid #CCC; background-color:#CCC !important; color:#000 !important; font-size:1em !important; height:40px !important; text-align:center; text-align-last: center; }
.step1content .btnpre{ display:block; }
.step1content .btnnext{ float:right; }

.step2.calenderblock{ margin:0 auto; width:600px; text-align:center; position:relative; }
.step2.calenderblock .calender{ width:100%; }
.step2.calenderblock .calender .row{ margin-bottom:20px; }

.step2.calenderblock .calender .cheader{ font-size:1em; }
.step2.calenderblock .calender .cheader .ctitle{ }
.step2.calenderblock .calender .container-fluid{ border:1px solid #000; }
.step2.calenderblock .calender .mchange{ cursor:pointer; }

.step2.calenderblock .calender ol { display: table; list-style-type:none; border:0px; border-spacing:0; padding:0; margin:0; }
.step2.calenderblock .calender ol li { display: table-cell; border:0px; border-spacing:0; vertical-align:top; padding:0; margin:0; }

.step2.calenderblock .calender ol{ margin:0 auto; width:560px; }
.step2.calenderblock .calender ol li{ text-align:center; width:80px; }

.step2.calenderblock .calender ol li>div{ width:40px; height:40px; line-height:40px; margin:0 auto; }
.step2.calenderblock .calender ol li .option{ background-color:#CCC; border-radius: 40px; cursor:pointer; }
.step2.calenderblock .calender ol li .option.mselect{ background-color:#E21A47; color:#FFF; }

.time{ width:600px; }
.time .row{ margin-bottom:20px; }
.time .listtxt{ border:1px solid #CCC; line-height:38px; color:#E21A47; font-size:1em; }
.time .form-control.slot{ border:1px solid #CCC; background-color:#CCC !important; color:#000 !important; font-size:1em !important; height:40px !important; text-align:center; text-align-last: center; }

.time .btnpre{ display:block; }
.time .btnnext{ float:right; }

.step3content{ max-width:700px; }
.step3content .row{ margin-bottom:20px; }
.step3content .stepcaption{ line-height:2.5em; }
.step3content .timer{ width: 100%; height: 80px; line-height: 80px;; text-align: center; font-weight: bold; font-size: 1.5em; border:#CCC 1px solid; }

.step3content .redbar{ padding-right:5px; border-left:3px solid #E21A47; }

.step3content .step3form{ border:1px solid #E21A47; }
.step3content .step3form .row{ margin-bottom:20px; }
.step3content .step3form .fixtxt{ line-height:34px; }

.step3content .step3form .btnpre{ display:block; }
.step3content .step3form .btnnext{ display:block; float:right; background:url(../images/1920/btn_submit.jpg) left top no-repeat; }

.step3content a{ color:#000 !important; text-decoration:none; }
.step3content a:hover, .step3content a:active{ color:#000 !important; text-decoration:none; }

.thxtxt{ font-size:1em; }

#poptnc{ width:100%; max-width:960px; height:100%; max-height:800px; background-color:#FFF; border:2px solid #9A0000; color:#000; }
#poptnc .popcontent{ padding:30px; }
#poptnc .popcontent ol li{ margin-bottom:15px; }
#poptnc .popcontent ol li:last-child{ margin-bottom:inherit; }

#popend{ width:600px; height:150px; background-color:#FFF; border:2px solid #9A0000; color:#000; }
#popend .popcontent{ padding:30px; }
#popend a{ text-decoration:underline; color:#000; }
#popend a:hover,#popend a:active,#popend a:focus{ text-decoration:underline; color:#000; }

.mobilehidden{display:block; }
.mobileshow{display:none; }

@media (max-width: 1199px) {
.bg .caption .grayblock .contenttxt{ line-height:1.8em; }
}

@media (max-width: 768px) {
body{ font-size:2em; }
#content-wrapper{ width:640px; }

.mobilehidden, #dmenu{ display:none; }
#menu,.mobileshow{ display:block; }

.redline{ display:none; }

.checkbox-container { margin-top:0px; padding-left:42px; }
.checkbox-container .checkmark { height: 32px; width: 32px; top:5px; }
.checkbox-container .checkmark:after { left: 8px; top: 0px; width: 12px; height: 25px; }

.radio-container{ padding-left:42px; }
.radio-container .checkmark { height: 32px; width: 32px; }
.radio-container .checkmark:after { width: 18px; height: 18px; }

.mmenu{ width:64px; height:64px; background:url(../images/640/btn_menu.png) top left no-repeat;  }
.mmenu.mmactive{ background-position:left bottom; }
.pop_menu{ top:64px; right:0; z-index:10; }
#menu .pop_menu_item{ display:block; cursor:pointer; width:550px; height:64px; }
#menu .pop_menu_item:hover{ background-position:left bottom; }

.menu1{ background:url(../images/640/btn_menu1.png) left top no-repeat; }
.menu2{ background:url(../images/640/btn_menu2.png) left top no-repeat; }

.btntop{ height: 50px; width: 50px; bottom: 20px; right: 2%; }

section{ max-width:640px; }

.formfix input, .formfix select, .formfix textarea{font-size:1em;}
.formfix input, .formfix select{ height:55px; }

.btnpre{ background:url(../images/640/btn_back.jpg) left top no-repeat; width:200px; height:66px; cursor:pointer; display:none; }
.btnnext{ background:url(../images/640/btn_next.jpg) left top no-repeat; width:200px; height:66px; cursor:pointer; display:none; }

.topheader{ background:url(../images/640/hss1.jpg) center top no-repeat; height:864px; }

.bg .caption .grayblock{ padding:0 45px; position:relative; display:block; height:auto; }
.bg .caption .grayblock .icon{ float:inherit; padding-bottom:15px; }
.bg .caption .grayblock .contenttxt{ position:relative; display:block; -ms-transform:inherit; -webkit-transform:inherit; transform:inherit; left:inherit; top:inherit; padding-right:0; width:100%; }
.bg .caption .grayblock .contenttxt p:last-child{ margin:0 0 20px !important; }

.bg .caption p{ padding-left:20px; padding-right:20px; line-height:1.5em; margin-bottom:20px; }
.bg .title{ text-align:center; margin-bottom:5px; font-size:1.8em; }
.bg .subtitle{ text-align:center; margin-bottom:10px; font-size:1.2em; letter-spacing:10px; text-indent:10px; }
.bg .step1txt .blackbar{ padding-right:10px; padding-top:2px; border-left:6px solid #000; }
.bg .row{ margin-bottom:30px; }

.bg .formfix{ max-width:600px; }
.bg .formfix .fixtxt{ line-height:normal; }
.bg .formfix .row{ margin-bottom:40px; }
.bg .formfix .btnauth{ padding:5px 20px; cursor:pointer; margin-top:15px; }
.bg .formfix .btnsubmit{ background:url(../images/640/btn_submit.jpg) center no-repeat; width:200px; height:66px; margin:0 auto; display:none; cursor:pointer; }
.bg .formfix .counter{ text-align:center; }

.step1title{ background:url(../images/640/step1.jpg) center no-repeat; height:130px; }
.step2title{ background:url(../images/640/step2.jpg) center no-repeat; height:130px; }
.step3title{ background:url(../images/640/step3.jpg) center no-repeat; height:130px; }

.step1content{ max-width:600px; }
.step1content .row{ margin-bottom:40px; }
.step1content .listtxt{ border:1px solid #CCC; line-height:68px; color:#E21A47; font-size:1em; }
.step1content .listtxt.active{ border:1px solid #E21A47; font-weight:bold; }
.step1content .form-control.shop{ border:1px solid #CCC; background-color:#CCC !important; color:#000 !important; font-size:1em !important; height:68px !important; }

.step2.calenderblock .calender .cheader{ font-size:1em; }
.step2.calenderblock .calender ol{ font-size:0.8em; }
.step2.calenderblock .calender ol li>div{ width:50px; height:50px; line-height:50px; }
.step2.calenderblock .calender ol li .option{ border-radius: 50px;}

.time .row{ margin-bottom:40px; }
.time .listtxt{ border:1px solid #CCC; line-height:68px; color:#E21A47; font-size:1em; }
.time .form-control.slot{ border:1px solid #CCC; background-color:#CCC !important; color:#000 !important; font-size:1em !important; height:68px !important; }

.step3content{ max-width:600px; }
.step3content .row{ margin-bottom:40px; }
.step3content .stepcaption{ line-height:1.5em; }
.step3content .timer{ height: 192px; line-height: 192px; }
.step3content a{ color:#000 !important; text-decoration:none; }
.step3content a:hover, .step3content a:active{ color:#000 !important; text-decoration:none; }

.step3content .redbar{ padding-right:10px; padding-top:2px; border-left:6px solid #E21A47; }

.step3content .step3form .row{ margin-bottom:40px; }
.step3content .step3form .fixtxt{ line-height:68px;font-size:1em; }
.step3content .step3form .form-control{ font-size:1em !important; height:68px !important; }
.step3content .step3form .termtxt{ font-size:1em; }
.step3content .step3form .btnnext{ background:url(../images/640/btn_submit.jpg) left top no-repeat; }

.thxtxt{ font-size:1em; }

#poptnc{ max-width:620px; max-height:700px; }

#popend{ height:310px; }

span.block{ display:inline-block; }
}

label{ font-weight:normal; }

.carousel-control.left,.carousel-control.right{ background-image:none;}

iframe[name='google_conversion_frame'] { height: 0 !important; width: 0 !important; line-height: 0 !important; font-size: 0 !important; margin-top: -13px; float: left; }