@charset "utf-8";
*{ padding:0; margin:0; font-family:"微軟正黑體", "新細明體"; }

.header{ background:#fff; height:100px; }
.header .mar{ max-width:1060px; margin:0 auto; }
.header .mar .logo{ width:460px; height:103px; display:block; background-image:url(../images/main/logo.jpg); }


/*banner*/
.banner{ background:#22a1c4; font-size:0px; }
.banner .bannerimg{ max-width:1060px; margin:0 auto; }
.banner .bannerimg img{ max-width:100%; }
.banner .bannerimg .dis-a{ display:none; }


/**/
.centers{ max-width:1060px; margin:0 auto; }

.centers .titlesbox{ display:table; width:100%; margin:25px 0; }
.centers .titlesbox .tads-a{ display:table-cell; vertical-align:middle; font-size:0px; }
.centers .titlesbox .tads-b{ display:table-cell; vertical-align:middle; width:300px; }
.centers .titlesbox .tads-a .grids{ width:25%; padding:0 20px; display:inline-block; vertical-align:top; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.centers .titlesbox .tads-a .grids .imgs{ width:100%; height:0px; padding-bottom:100%; position:relative; overflow:hidden; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; }
.centers .titlesbox .tads-a .grids .imgs img{ position:absolute; top:0px; left:0px; right:0px; bottom:0; margin:auto; max-width:100%; }
.centers .titlesbox .tads-a .grids .txts{ color:#555; font-size:20px; text-align:center; padding:10px 0 0 0; }

.centers .titleimg{ text-align:center; margin:25px 0; }

.forms{ background:#f6f6f6; padding:10px 60px 40px 60px; position:relative; }
.forms .neces{ text-align:right; font-size:20px; padding:0 0 25px 0; }
.forms .tables{ font-size:0px; }
.forms .tables .tds{ display: inline-block; width:50%; vertical-align:top; }
.forms .tables .tds.whauto{ width:100%; }
.forms .tables .tds .listtab{ display:table; width:100%; margin:0 0 30px 0; }
.forms .tables .tds .listtab .tad-a{ display:table-cell; vertical-align:middle; width:120px; font-size:26px; }
.forms .tables .tds .listtab .tad-b{ display:table-cell; vertical-align:middle; font-size:24px; }
.forms .tables .tds .listtab .tad-b input{ border:1px solid #000; font-size:24px; line-height:normal; padding:0 5px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border-radius: 5px;}
.forms .tables .tds .listtab .tad-b select{ border:1px solid #000; font-size:24px; line-height:normal; min-width:124px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; border-radius: 5px;}
.forms .tables .tds .listtab .tad-b select.wht{ width:274px; }
.forms .tables .tds .listtab .tad-b input:focus,
.forms .tables .tds .listtab .tad-b select:focus{ border: 1px solid #22a1c4;}
.forms .btnsbox{ text-align:center; padding:0 0 20px 0; }
.forms .btnsbox .btnlink{ background:none; background-color:#360729; border:none; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; color:#fff; font-size:26px; text-decoration:none; padding:2px 25px; cursor:pointer; display:inline-block; }
.forms .s_txt{ text-align:center; font-size:18px; color:#000; padding:0 0 20px 0; }

.codeboxs{ font-size:0px; padding:10px 30px; background:#e9e9e9; width:300px; margin: 0 auto 10px auto; border-radius:50px; -webkit-border-radius:50px; -moz-border-radius:50px; }
.codeboxs .inbox{ display:inline-block; vertical-align:middle; font-size:20px; color:#000; margin:0 10px 0 0; }
.codeboxs .inimg{ display:inline-block; vertical-align:middle; }
.codeboxs .inputbox{ display:inline-block; vertical-align:middle; width:120px; }
.codeboxs .inputbox input{ background:none; border:none; background:#fff; width:100%; line-height:32px; padding:0 5px; box-sizing:border-box; -webkit-box-sizing:border-box;  -moz-box-sizing:border-box; }

.timeTable{ width:100%; border-collapse:collapse; }
.timeTable td{ font-size:18px; color:#6d6d6d; text-align:center; padding:10px; }
.timeTable td.bg01{ background:#ccc; border:1px solid #bedde2; color:#6d6d6f; font-weight:bold; }
.timeTable td.bg02{ background:#deeaf6; border:1px solid #bedde2; color:#308db8; }
.timeTable td.bg03{ background:#c4e1ef; border:1px solid #bedde2; color:#308db8; }
.timeTable td.bg04{ background:#fff2cc; border:1px solid #bedde2; color:#308db8; }
.timeTable td.bg05{ background:#ffcccc; border:1px solid #bedde2; color:#308db8; }

.timerem{ display:none; }

/*--------倒數----------*/
.recips{ padding:60px 10px; text-align:center; font-size:26px; color:#000; }
.recips .set{ padding:10px 0 0 0; }

/*footer*/
.footer{ background:#22a1c4; padding:30px 0; margin:30px 0 0 0; }
.footer .mar{ display:table; width:100%; max-width:1060px; margin:0 auto; }
.footer .mar .tds-a{ display:table-cell; vertical-align:middle; width:130px; }
.footer .mar .tds-b{ display:table-cell; vertical-align:middle; padding:0 0 0 30px; font-size:18px; line-height:30px; }
.footer .mar a{ font: inherit; color: inherit;}

/*************************平版****************************/
@media screen and (min-width:768px) and (max-width:1023px) {
/**/
.centers .titlesbox{ display:block; }
.centers .titlesbox .tads-a{ display:block; }
.centers .titlesbox .tads-b{ display:block; width:auto; text-align:center; padding:30px 0 0 0; }

.forms{ padding: 10px 20px 40px 20px; }
.forms .tables .tds .listtab .tad-b input{ width:90%; }

}

/*************************手機****************************/
@media screen and (max-width:767px) {
.header{ height:60px; padding:10px 0; }
.header .mar .logo{ width:260px; height:58px; background-image:url(../images/main/logo_m.jpg); background-size:100%; }

/*banner*/
.banner .bannerimg .dis-a{ display:block; width:100%; }
.banner .bannerimg .dis-b{ display:none; }
	
/**/
.centers .titlesbox{ display:block; max-width:320px; margin:25px auto; }
.centers .titlesbox .tads-a{ display:block; }
.centers .titlesbox .tads-a .grids{ width:50%; padding:10px 20px; }
.centers .titlesbox .tads-a .grids .txts{ font-size:18px; }
.centers .titlesbox .tads-b{ display:none; }


.forms{ padding: 10px 10px 20px 10px; }
.forms .neces{ font-size:16px; padding:0 0 15px 0; }
.forms .tables .tds{ display:block; width:100%; }
.forms .tables .tds .listtab{ margin:0 0 15px 0; }
.forms .tables .tds .listtab .tad-a{ font-size:18px; width:90px; }
.forms .tables .tds .listtab .tad-b{ font-size:18px; }
.forms .tables .tds .listtab .tad-b input{ width:90%; font-size:18px; }
.forms .tables .tds .listtab .tad-b select{ font-size:18px; }
.forms .tables .tds .listtab .tad-b select.wht{ width:90%; }
.forms .btnsbox{ position:static; text-align: center; margin:0 0 40px 0; }
.forms .btnsbox .btnlink{ font-size:20px; }
.forms .s_txt{ font-size:16px; padding:0 0 20px 0; }

.codeboxs{ padding:10px 20px; width:250px; }
.codeboxs .inbox{ font-size:16px; }
.codeboxs .inputbox{ width:100px; }

.timeTable td{ font-size:12px; padding:0; }
.timeTable td .spans{ display:block; }
.timeTable td .disnone{ display:none; }

.timerem{ display:block; padding:5px 0 0 0; }
.timerem .timetxt{ font-size:12px; color:#000; line-height:18px; }
.timerem .fcolor{ color:#0096ff; }

/*--------倒數----------*/
.recips{ font-size:20px; padding:40px 10px; }

/*footer*/
.footer{ padding:20px 10px; margin:20px 0 0 0; }
.footer .mar{ width:100%; }
.footer .mar .tds-a{ width:65px; }
.footer .mar .tds-a img{ width:100%; }
.footer .mar .tds-b{ font-size: 13px; padding: 0 0 0 15px; line-height: 20px; }
}