input {outline: none; border: none; background: none; }  
input[type="number"] { -moz-appearance: textfield; appearance: none; -webkit-appearance: none;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {  -webkit-appearance: none;}


 input:focus::-webkit-input-placeholder { color:transparent; }
 input:focus:-moz-placeholder { color:transparent; }
 input:focus::-moz-placeholder { color:transparent; }
 input:focus:-ms-input-placeholder { color:transparent; }
  
textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; }
textarea:focus::-moz-placeholder { color:transparent; }
textarea:focus:-ms-input-placeholder { color:transparent; }
  
 input::-webkit-input-placeholder {color: #999999;}
 input:-moz-placeholder {color: #999999;}
input::-moz-placeholder {color: #999999;}
 input:-ms-input-placeholder {color: #999999;}
  
 textarea::-webkit-input-placeholder {color: #999999;}
 textarea:-moz-placeholder {color: #999999;}
 textarea::-moz-placeholder {color: #999999;}
 textarea:-ms-input-placeholder {color: #999999;}


 /*---------------------------------------------*/
 input[type="button"], input[type="reset"]{ display: block; }
 button {  outline: none !important; border: none; }
 button:hover { cursor: pointer; }

 table { border-spacing: 1; border-collapse: collapse; background: white; border-radius: 6px; overflow: hidden; max-width: 1000px; width: 100%; margin: 0 auto; position: relative; }
 table * { position: relative; }
 table th{ font-size:0.7em;}
 table td, table th { padding-left: 8px; }
 table thead tr { height: 40px; background: rgba(159, 69, 150, 0.8); font-size: 1.1em; color: #FFFFFF; }
 table tbody tr { height: 48px; border-bottom: 1px solid #E3F1D5; }
 table tbody tr:last-child { border: 0; }
 table td{ color: #333333;}
 table td, table th { text-align: center;  }
 table td.l, table th.l { text-align: right; }
 table td.c, table th.c { text-align: center;}
 table td.r, table th.r { text-align: center; }
 
  
  @media screen and (max-width: 35.5em) {
    table { display: block; margin: 20px auto; width: 96%;  }
    table > *, table tr, table td, table th { display: block;}
    table td { text-align: left;  }
    table thead { display: none; }
    table tbody tr {  height: auto;  padding: 8px 0;}
    table tbody tr td { padding-left: 25%; margin-bottom: 12px; }
    table tbody tr td:last-child { margin-bottom: 0; }
    table tbody tr td:before { position: absolute; font-weight: 500;  width: 20%; left: 10px; top: 0;  color: rgba(159, 69, 150, 0.65);}

    .tb_a tbody tr td:nth-child(1):before { content: "姓  名"; }
    .tb_a tbody tr td:nth-child(2):before { content: "䁥  稱"; }
    .tb_a tbody tr td:nth-child(3):before { content: "電  話"; }

    .tb_b tbody tr td:nth-child(1):before { content: "獎  項"; }
    .tb_b tbody tr td:nth-child(2):before { content: "姓  名"; }
    .tb_b tbody tr td:nth-child(3):before { content: "卡  號"; }

    .tb_c tbody tr td:nth-child(1):before { content: "獎  項"; }
    .tb_c tbody tr td:nth-child(2):before { content: "姓  名"; }
    .tb_c tbody tr td:nth-child(3):before { content: "卡  號"; }

    .tb_d tbody tr td:nth-child(1):before { content: "獎  項"; }
    .tb_d tbody tr td:nth-child(2):before { content: "姓  名"; }
    .tb_d tbody tr td:nth-child(3):before { content: "卡  號"; }

    .tb_e tbody tr td:nth-child(1):before { content: "獎  項"; }
    .tb_e tbody tr td:nth-child(2):before { content: "電  話"; }
    .tb_e tbody tr td:nth-child(3):before { content: "地  址"; }
  }
  .box a{ color: #FFFFFF; text-decoration: none;}

/* DeskTop First 桌機版優先－－－－－－－－－－－－－－－－－－ */
@media screen and (min-width: 1400px) {

/**贈獎活動主框架**/
.bg_second main { width: 100%; max-width: 1400px; padding: 2% 4% 2% 4%; margin: 0 auto; display:flex; flex-flow: row wrap; justify-content: center; font-size: 1.2em;}
section { display: none; width: 100%; height: auto; min-height: 60vh; padding: 3% 0 0 0; color: #fff; /*border-top: 1px solid #abc;*/}
main input { display: none; }
main label { display: inline-flex; margin: 0 0 -1px; padding: 12px 25px ; font-weight: 600; text-align: center; color: #E02589; border: 1px solid transparent; float: right; font-size: 1.6rem; /*background: rgba(0, 0, 0, 0.1); */ border-radius: 0px; position: relative; border: #E02589 1px solid;}
main label:hover {-webkit-transition: all 0.6s; -o-transition: all 0.6s; -moz-transition: all 0.6s; transition: all 0.6s; color: rgba(255, 255, 255, 1);  cursor: pointer; background: transparent center 80% no-repeat;}
main input:checked + label {color: rgba(255, 255, 255, 1);  background: url(../images/tab_bg.svg) center bottom no-repeat;border: none; }
	  
#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4,
#tab5:checked ~ #content5 { display: block; }
p:not(:last-child) { margin: 0 0 20px; }

#content1,#content2,#content3,#content4,#content5{width:100%;padding:5% 0 5% 0; }
main .box{width: 100%; border-left: rgba(255, 255, 255, 0.8) 1px solid; margin: 15px auto; padding: 0 20px ; margin: 1.5em 0;}
.box_ul{list-style: none;}
main h2{ color: rgba(255, 255, 255, 1); padding: 0 0 5px 0; line-height: 1.8em;}
main h3{ line-height: 1.2em;}
main h3, main p, main ul, main ol{ color: rgba(255, 255, 255, 0.8); margin: 10px 0;}
main li{ margin-left:35px; list-style-type: disc; list-style-position: outside;}
main p, main li{color: rgba(255, 255, 255, 0.7); font-size: 0.9em; font-weight: normal; line-height: 1.6em; letter-spacing: 1px;}
main b{ color: rgba(255, 255, 255, 0.9) ;padding: 0 3px; text-decoration: underline;}
main span{ color: rgba(255, 227, 70, 0.9) ;}
main>ul::before{ content: "◎"; padding-right: 5px;}
ul>strong{ color: rgba(255, 255, 255, 0.9); font-weight: 400 ; padding: 0 5px;}

/** 活動消息+圖片也+按鈕**/
.ev_vi.w70{ width: 70%; }
.ev_vi>img{ width: 100%; height: auto;}


/** 許願表單 **/
.wish_fo{width: 100%; max-width: 1300px; background-color: rgba(0, 0, 0, 0.2); border-radius: 10px; padding: 20px 25px ;}
.wish_fo input{ background-color: none; border-bottom: #ffffff 1px solid;}
.wish_fo input { outline: none; border: none; background: none; }
.wish_fo textarea { outline: none; border: none; }
.wish_fo textarea:focus,.wish_fo input:focus { border-color: transparent !important;}
.f_btn{ display: flex; flex-flow: row wrap;  justify-content: flex-end;}
input[type="button"], input[type="reset"] {border-radius: 50px;color: #fff; background: #E02589; line-height:1.6em; font-size: 1.1em; padding: 3px 30px; margin: 0 10px;}

/*[ Input ]----------------------*/
.wrap-input {  justify-content:flex-start;position: relative; margin-bottom:3px;}
.wrap-input:nth-child(1), .wrap-input:nth-child(2), .wrap-input:nth-child(3), .wrap-input:nth-child(4){display: inline-flex;flex-flow: row nowrap;width: 46%;}
.wrap-input:nth-child(5){display: inline-flex;flex-flow: row nowrap;width: 100%;}
.wrap-input:nth-child(6){display:flex;flex-flow: column nowrap; width: 100%;}
.label-input { display: block; position: relative;  width: 110px; text-align: right; color: rgba(255, 255, 255, 0.8); font-size: 0.8em;line-height: 1em; padding: 13px 10px; text-align: justify; }
.label-input::before{position: absolute; content: "*"; color: #E02589; left: -5px;}
.label-input:nth-child(6) {width:100%;}
.wrap-input textarea{width: 100%; background: rgba(0, 0, 0, 0.2); border-radius: 5px;  padding: 10px; }
  
.input80 {font-size: 0.7em; color: #ffffff; line-height: 1em; display: block; width: 80%; background: transparent; padding: 0 10px; }
.focus-input80 { position: absolute; display: block; width: 80%; height: 100%; top: 0; left: 0; pointer-events: none; }

  
input.input80 { height: 45px; }
textarea.input80 { min-height: 115px; padding-top: 14px; padding-bottom: 13px; }
.input80:focus + .focus-input100::before { width: 75%; }
.has-val.input80 + .focus-input100::before { width: 75%;}
/***中獎名單**/
.luckylist{ width: 100%; margin: 0 auto;}
.l_tt{ color: rgba(255, 255, 255, 0.9); font-size:1.5em; line-height: 2em; font-weight: 500; display: block; padding: 0 35px; text-align: center; }
.l_tt::before, .l_tt::after { content:"|"; padding: 0 35px; }
.l_cc{ color: rgba(255, 255, 255, 0.9); font-size:1.5em; line-height: 2em; font-weight: 500; display: block; padding: 0 35px; text-align: center; }
.l_cc::before, .l_cc::after { content:" "; padding: 0 35px; }

  


}



/* 以下為 平板電腦－－－－－－－－－－－－－－－－－－以下為 平板電腦－－－－－－－－－－－－－－－－－－以下為 平板電腦－－－－－－－－－－－－－－－－－－以下為 平板電腦－－－－－－－－－－－－－－－－－－ */ 
@media screen and (min-width: 767px) and (max-width: 1399px) {
	
/**贈獎活動主框架**/
main { width:98%;min-width: 767px; max-width: 1300px; padding: 2% 4% 2% 4%; margin: 0 auto; display:flex; flex-flow: row wrap; justify-content: center; font-size: 1.05em;}
section { display: none; width: 98%; height: auto; min-height: 60vh; padding: 3% 0 0 0; margin: 0 0 30px 0; color: #fff;}
input { display: none; }
label { display: flex; margin: 2px 0 ; padding: 10px 10px ; font-weight: 500; text-align: center; color: #E02589; border: 1px solid transparent; float: right; font-size: 1.2rem; background: rgba(0, 0, 0, 0.1); border-radius: 5px; position: relative;border: #E02589 1px solid;}
label:hover { color: rgba(255, 255, 255, 1);  cursor: pointer; }
input:checked + label {color: rgba(255, 255, 255, 1);   background: url(../images/tab_bg.svg) center bottom no-repeat;border: none; }
	  
#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4,
#tab5:checked ~ #content5 { display: block; }
p:not(:last-child) { margin: 0 0 20px; }

#content1,#content2,#content3,#content4,#content5{width:95%; height:inherit;min-width: 767px; max-width: 1200px; padding:5% 0 5% 0; }
main .box{width: 100%; border-left: rgba(255, 255, 255, 0.8) 1px solid; margin: 15px auto; padding: 0 10px ; margin: 1.5em auto;}
main h2{ display: block; border-left: solid 3px #ffffff; color: rgba(255, 255, 255, 1); padding: 0 0 5px 10px;margin: 10px 0 8px 5px; line-height: 1.1em; font-size: 1.2em; }
main h3{ line-height: 1em;}
main h3, main p, main ul, main ol{ color: rgba(255, 255, 255, 0.8); margin: 10px 0;}
main li{ margin-left:35px; list-style-type: disc; list-style-position: outside;}
main p, main li{color: rgba(255, 255, 255, 0.7); font-size: 1em; font-weight: 400; line-height: 1.45em; letter-spacing: 0.5px;}
main b{ color: rgba(255, 255, 255, 0.9) ;padding: 0 3px; text-decoration: underline;}
main span{ color: rgba(255, 227, 70, 0.9) ; font-size: 0.9em;}
main>ul::before{ content: "◎"; padding-right: 5px;}
ul>strong{ color: rgba(255, 255, 255, 0.9); font-weight: 400 ; padding: 0 5px;}

/** 活動消息+圖片也+按鈕**/
.ev_vi.w70{ width: 70%; }
.ev_vi img{ width: 100%; height: auto;}
/* .btn{width: 50%;  position: relative; text-align: center; margin: 2em auto;}
.btn a, .btn a:visited{  border-radius: 50px;color: #fff; background: #E02589; line-height:1.8em; font-size: 1.2em; font-weight: bold; padding: 10px 35px; text-decoration: none; cursor: pointer;}
.btn a:hover{  border-radius: 50px;color: #ffea00; background: #E02589; box-shadow: rgba(0, 0, 0, 0.3) 1px 3px 5px; line-height:1.6em; font-size: 1.2em; font-weight: bold; padding: 8px 35px;} */

/*[ Input ]----------------------*/
.wrap-input {  justify-content:flex-start;position: relative; margin-bottom:3px;}
.wrap-input:nth-child(1), .wrap-input:nth-child(2), .wrap-input:nth-child(3), .wrap-input:nth-child(4){display: inline-flex;flex-flow: row nowrap;width: 46%;}
.wrap-input:nth-child(5){display: inline-flex;flex-flow: row nowrap;width: 100%;}
.wrap-input:nth-child(6){display:flex;flex-flow: column nowrap; width: 100%;}
.label-input { display: block; position: relative;  width: 110px; text-align: right; color: rgba(255, 255, 255, 0.8); font-size: 0.8em;line-height: 1em; padding: 13px 10px; text-align: justify; }
.label-input::before{position: absolute; content: "*"; color: #E02589; left: -5px;}
.label-input:nth-child(6) {width:100%;}
.wrap-input textarea{width: 100%; background: rgba(0, 0, 0, 0.2); border-radius: 5px;  padding: 10px; }
  
.input80 {font-size: 0.7em; color: #ffffff; line-height: 1em; display: block; width: 80%; background: transparent; padding: 0 10px; }
.focus-input80 { position: absolute; display: block; width: 80%; height: 100%; top: 0; left: 0; pointer-events: none; }
 
input.input80 { height: 45px; }
textarea.input80 { min-height: 115px; padding-top: 14px; padding-bottom: 13px; }
.input80:focus + .focus-input100::before { width: 75%; }
.has-val.input80 + .focus-input100::before { width: 75%;}
/** 許願表單 **/
.wish_fo{width: 100%; min-width: 767px; background-color: rgba(0, 0, 0, 0.2); border-radius: 10px; padding: 20px 25px ;}
.wish_fo input{ background-color: none; border-bottom: #ffffff 1px solid;}
.wish_fo input { outline: none; border: none; background: none; }
.wish_fo textarea { outline: none; border: none; }
.wish_fo textarea:focus,.wish_fo input:focus { border-color: transparent !important;}
.f_btn{ display: flex; flex-flow: row wrap; justify-content: flex-end;}
input[type="button"], input[type="reset"] {border-radius: 50px;color: #fff; background: #E02589; line-height:1.6em; font-size: 1.1em; padding: 3px 30px; margin: 0 10px;}


/***中獎名單**/
.luckylist{ width: 100%; margin: 0 auto;}
.l_tt{ color: rgba(255, 255, 255, 0.9); font-size:1.5em; line-height: 2em; font-weight: 500; display: block; padding: 0 35px; text-align: center; }
.l_tt::before, .l_tt::after { content:"|"; padding: 0 35px; }
.l_cc{ color: rgba(255, 255, 255, 0.9); font-size:1.5em; line-height: 2em; font-weight: 500; display: block; padding: 0 35px; text-align: center; }
.l_cc::before, .l_cc::after { content:" "; padding: 0 35px; }


table { border-spacing: 1; border-collapse: collapse; background: white; border-radius: 6px; overflow: hidden; max-width: 1000px; width: 100%; margin: 0 auto; position: relative; }
  table * { position: relative; }
  table th{ font-size:0.7em;}
  table td, table th { padding-left: 8px; }
  table thead tr { height: 40px; background: rgba(159, 69, 150, 0.8); font-size: 1.1em; color: #FFFFFF; }
  table tbody tr { height: 48px; border-bottom: 1px solid #E3F1D5; }
  table tbody tr:last-child { border: 0; }
  table td{ color: #333333;}
  table td, table th { text-align: center;  }
  table td.l, table th.l { text-align: right; }
  table td.c, table th.c { text-align: center;}
  table td.r, table th.r { text-align: center; }
  
}



/* 以下為 手機版－－－－－－－－－－－－－－－－－－ 以下為 手機版－－－－－－－－－－－－－－－－－－ 以下為 手機版－－－－－－－－－－－－－－－－－－ 以下為 手機版－－－－－－－－－－－－－－－－－－ */
@media screen and (max-width: 766px) {

/**贈獎活動主框架**/
main {position: relative; top:80px;width: 100%; height: auto; max-width: 766px; padding: 2% 1% 5% 1%; margin: 0 auto; display:flex; flex-flow: row wrap; justify-content: flex-start; font-size: 1em; clear: both;}
section { display: none; width: 98%; height: auto; min-height: 60vh; padding: 3% 0 0 0; margin: 0 0 30px 0; color: #fff;}
input { display: none; }
label { display: flex; width: 48%; margin: 2px 1% ; padding: 10px 0 10px 25px ; font-weight: 500; text-align: center; color: #E02589; border: 1px solid transparent; float: right; font-size: 1.1rem; background: rgba(0, 0, 0, 0.1); border-radius: 5px; position: relative;border: #E02589 1px solid;}
label:hover { color: rgba(255, 255, 255, 1);  cursor: pointer; }
input:checked + label {color: rgba(255, 255, 255, 1);   background: url(../images/tab_bg2.svg) 10px center no-repeat, rgba(0, 0, 0, 0.3) center center no-repeat; border: none;  background-size: 13px 13px;}
	  
#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4,
#tab5:checked ~ #content5 { display: block; }
p:not(:last-child) { margin: 0 0 20px; }

#content1,#content2,#content3,#content4,#content5{ position: relative; width:100%; height: auto; max-width: 760px; padding:5% 0 5% 0; }
main .box{width: 98%; border-left: rgba(255, 255, 255, 0.8) 1px solid; margin: 15px auto; padding: 0 10px ; margin: 1.5em auto;}
main h2{ display: block; border-left: solid 3px #ffffff; color: rgba(255, 255, 255, 1); padding: 0 0 5px 10px;margin: 10px 0 8px 5px; line-height: 1.1em; font-size: 1.2em; }
main h3{ line-height: 1em;}
main h3, main p, main ul, main ol{ color: rgba(255, 255, 255, 0.8); margin: 10px 0;}
main li{ margin-left:35px; list-style-type: disc; list-style-position: outside;}
main p, main li{color: rgba(255, 255, 255, 0.7); font-size: 1.05em; font-weight: 400; line-height: 1.5em; letter-spacing: 0.5px; padding: 0.25em 0;}
main b{ color: rgba(255, 255, 255, 0.9) ;padding: 0 3px; text-decoration: underline;}
main span{ color: rgba(255, 227, 70, 0.9) ; font-size: 0.9em;}
main>ul::before{ content: "◎"; padding-right: 5px;}
ul>strong{ color: rgba(255, 255, 255, 0.9); font-weight: 400 ; padding: 0 5px; font-size:1.1em; }

/** 活動消息+圖片也+按鈕**/
.ev_vi.w70{ width: 100%; }
.ev_vi img{ width: 100%; height: auto;}
/* .btn{ width: 50%;  position: relative; text-align: center; margin: 2em auto;}
.btn a, .btn a:visited{  border-radius: 50px;color: #fff; background: #E02589; line-height:1.8em; font-size: 1.2em; font-weight: bold; padding: 10px 35px; text-decoration: none; cursor: pointer;}
.btn a:hover{  border-radius: 50px;color: #ffea00; background: #E02589; box-shadow: rgba(0, 0, 0, 0.3) 1px 3px 5px; line-height:1.6em; font-size: 1.2em; font-weight: bold; padding: 8px 35px;} */

/** 許願表單 **/
.wish_fo{width: 100%; min-width: 320px; background-color: rgba(0, 0, 0, 0.2); border-radius: 10px; padding: 10px 10px ;}
.wish_fo input{ background-color: none; border-bottom: #ffffff 1px solid;}
.wish_fo input { outline: none; border: none; background: none; }
.wish_fo textarea { outline: none; border: none; }
.wish_fo textarea:focus,.wish_fo input:focus { border-color: transparent !important;}
.f_btn{ display: flex; flex-flow: row wrap; justify-content: center;}
input[type="button"], input[type="reset"] {border-radius: 50px;color: #fff; background: #E02589; line-height:1.6em; font-size: 1.1em; padding: 3px 30px; margin: 0 10px;}

/*[ Input ]----------------------*/
.wrap-input {  justify-content:flex-start;position: relative; margin-bottom:3px;}
.wrap-input:nth-child(1), .wrap-input:nth-child(2), .wrap-input:nth-child(3), .wrap-input:nth-child(4){display: inline-flex;flex-flow: row nowrap; justify-content: flex-start; align-items:flex-start; width: 98%;}
.wrap-input:nth-child(5){display: inline-flex;flex-flow: row nowrap;width: 100%;}
.wrap-input:nth-child(6){display:flex;flex-flow: column nowrap; width: 100%;}
.label-input { display: block; width: 90px; text-align: right; color: rgba(255, 255, 255, 0.8); font-size: 0.8em;line-height: 1.3em; padding: 10px 5px; text-align: justify; }
.label-input::before{position: absolute; content: "*"; color: #E02589; left: -5px;}
.label-input:nth-child(6) {width:100%;}
.wrap-input textarea{width: 100%; background: rgba(0, 0, 0, 0.2); border-radius: 5px;  padding: 0px 0; }
  
.input80 {font-size: 0.8em; color: #ffffff; line-height: 1em; display: block; width: 80%; background: transparent; padding: 0 10px; }
.focus-input80 {display: block; width: 80%; height: 100%; top: 0; left: 0; pointer-events: none; }
  
input.input80 { height: 40px; }
textarea.input80 { min-height: 115px; padding-top: 14px; padding-bottom: 13px; }
.input80:focus + .focus-input100::before { width: 75%; }
.has-val.input80 + .focus-input100::before { width: 75%;}
  
/***中獎名單**/
.luckylist{ width: 100%; margin: 0 auto;}
.l_tt{ color: rgba(255, 255, 255, 0.9); font-size:1.2em; line-height: 2em; font-weight: 500; display: block; padding: 0 35px; text-align: center; }
.l_tt::before, .l_tt::after { content:"|"; padding: 0 35px; }	
.l_cc{ color: rgba(255, 255, 255, 0.9); font-size:1.2em; line-height: 2em; font-weight: 500; display: block; padding: 0 35px; text-align: center; }
.l_cc::before, .l_cc::after { content:" "; padding: 0 35px; }	




}