/* --- init --- */
html,
body { overflow-x:hidden !important; padding: 0; margin: 0;  font-family: "微軟正黑體", "Microsoft JhengHei", "Segoe UI", Arial, sans-serif;            border: none; }
a { cursor : pointer; display : inline-block; text-decoration : none;  background-color: transparent; color:inherit; border : none; }
p { margin: 0 }
img {  max-width : 100%; vertical-align: middle; border : none }
* { box-sizing: border-box; margin : 0; padding : 0; outline : none; }
span { display: inline-block; }
ul, ol { margin : 0; padding-left: 22px;}
ul.decimal, ol.decimal { list-style: decimal; }
ul.disc, ol.disc { list-style: decimal; }
ul.upper_alpha, ol.upper_alpha { list-style: upper-alpha; }
ul.cus, ol.cus { list-style: none;  padding: 0; }
ul.cus>li, ol.cus>li {  position : relative;  padding-left: 22px; }
/*ul.cus>li::before, ol.cus>li::before {  content : attr(str);  position: absolute; top : 0;  left : 0; }
ul.cus._gh>li::before, ol.cus._gh>li::before {  content: "("attr(str) ")" }
ul.cus._num>li:nth-child(n + 10), ol.cus._num>li:nth-child(n + 10) { padding-left: 30px; }*/
ul.none, ol.none { list-style: none; padding: 0;}
@media (min-width:1025px) {
  .up_lg_hide {display: none !important }
}

@media (max-width:1024px) {
  .lg_hide { display: none !important}
}

@media (min-width:769px) {
  .up_md_hide { display: none !important }
}

@media (max-width:768px) {
  .md_hide { display: none !important }
}

@media (min-width:577px) {
  .up_sm_hide { display: none !important }
}

@media (max-width:576px) {
  .sm_hide { display: none !important }
}

@media (min-width:451px) {
  .up_ssm_hide { display: none !important }
}

@media (max-width:450px) {
  .ssm_hide { display: none !important }
}

/* --- header --------------------------------------------- */
header { position: fixed; top: 0; left: 0; right: 0; display: block; background-color: #ffffff; border-bottom:10px solid #ed1b2e; 
         font-size:0; z-index:5; }
header .head_ctn { position  : relative;  max-width : 1140px;  margin: auto; width: 95%; text-align: left; }
header .head_ctn .logo {  position: relative;  z-index : 2;   }
header .head_ctn .tab_box {  z-index: 1;  position: absolute; right: 0;  bottom: 0; color: #505050;  text-align: right; }
header .head_ctn .tab_box .tab_item { padding: 5px 15px 0px 20px; cursor: pointer; display: inline-block; font-size: 18px; color: #6d6d6d;
                                      font-weight: 700; -webkit-transition: .3s linear; transition: .3s linear}
header .head_ctn .tab_box .tab_item:hover { color: #ed1b2e; }
header .head_ctn .menu_box { cursor: pointer; position: absolute; top: 50%; right: 5%; padding-top: 6px; padding-left: 10px;
                             -webkit-transform: translateY(-50%); transform: translateY(-50%);  }
header .head_ctn .menu_box>div { background-color: #ed1b2e; width: 30px; height: 2px; margin-bottom: 6px; }
header .tab_box2 { background-color: #ffffff; cursor: pointer; position: absolute; top: 119px; left: 0; right: 0; font-size:20px; 
                   display: none; }
header .tab_box2 .tab_item { background-color: #ffffff; padding: 20px; border-bottom: 1px solid #cccccc; color: #888888; font-weight:700;                                  text-align: center; line-height: 1; -webkit-transition: .25s linear; transition: .25s linear;}
header .tab_box2 .tab_item:hover {  background-color: #efeeee;  color: #888888; opacity: .7; }
header, .head_filler { height: 110px; }
header .head_slogan { font-size: 14px; font-weight: bold; color: #667088; display: inline-block; vertical-align: bottom; padding-bottom: 2%; }

header .logo_m{  display: none;}

/* --- header MENU for mb--------------------------------------------- */
header .nav_btn { cursor: pointer; position: absolute;  top: 50%;  right: 20px;  transform: translateY(-50%) }
header .nav_btn .nav_line { width: 32px;  height: 3px;  background-color: #ed1b2e; transition: .3s; }
header .nav_btn .nav_line:not(:last-child) { margin-bottom: 8px; }
header .nav_btn .nav_line._1 { transform-origin: left bottom; }
header .nav_btn .nav_line._3 { transform-origin: left top }
header .nav_btn.active { transition: .5s linear }
header .nav_btn.active .nav_line._1 { transform: rotate(42deg) }
header .nav_btn.active .nav_line._2 { opacity: 0; }
header .nav_btn.active .nav_line._3 { transform: rotate(-42deg) }

@media screen  and (max-width:1024px) {
  header { border-bottom-width: 8px; width: 100%;}
  header .head_ctn { text-align: center; width: 100%; height: 100%; }
  header .head_ctn>* { vertical-align: middle; }
  header .head_ctn::before { content: ""; display: inline-block; vertical-align: middle; width: 0; height: 100%; font-size: 0; }
  header .head_ctn .logo { margin-left: 0; }
  header .tab_box2 { top: 60px; }
  header, .head_filler { height: 80px;}
    header .logo_m{max-width: 50%;  margin: 0 auto; display: block; position: fixed; top: 0px; left: 50px;}

}



@media screen  and ( max-width:516px) {
* {	-webkit-box-sizing: border-box;	box-sizing: border-box;}
   header .logo_m{max-width: 75%; display: block; position: fixed; top:2px; left: 25px;}
header, .head_filler { height: 60px;}
}

/* --- 外層------------------ --------------------------------------- */
.space_frame { max-width : 1920px; margin : auto; overflow-x: hidden;}

/*===========BANNER----------------=============*/
.kv_frame { position: relative; }
.kv_frame > img { width: 100%; }
.kv_frame #scene { position: absolute; top: 90px;  left:350px;  right: 0px; bottom: 0px; }

.kv_frame .kv_title { width: 42%;   top: 20% ;  left: 10% ; 
-webkit-animation:heartbeat 2.5s ease-in-out infinite both;animation:heartbeat 2.5s ease-in-out infinite both}

@-webkit-keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}



@media only	screen and (min-width: 812px) and (max-width: 1366px) {
* {	-webkit-box-sizing: border-box;	box-sizing: border-box;}
    .kv_frame #scene { position: absolute; top: 50px;  left:170px;  right: 0px; bottom: 0px; }
    .kv_frame .kv_title { width:45%;   top: 5% ;  left: 50% ; }
}

@media screen and ( max-width:1024px) {
  .kv_frame #scene { display: none;}
}

@media screen and ( max-width:812px) {
	 .kv_frame #scene { display: none;}
}


/*==================****====獎項 for PC====================================*/
.jia_frame { width: 100%; overflow: hidden; padding-top: 2%;   }
.jia_frame .midline { margin-bottom: 20px; font-weight: bold;}
.jia_frame h3{ font-size: 38px; text-align: center; line-height: 1.5em;}
.giftBOX{  width :100%; margin: 0 auto;  padding: 0% 2% 0% 2%; }
.giftBOX ul{ width: 56%; margin: 0 auto; }
.giftBOX ul li{ width: 25%; padding: 2% 1% 4% 0%; float:left; display:inline-block;}
.giftBOX li .pic{margin:0; }
.giftBOX li{
	transition:All 0.4s ease-in-out;
	-webkit-transition:All 0.4s ease-in-out;
	-moz-transition:All 0.4s ease-in-out;
	-o-transition:All 0.4s ease-in-out;
}
.giftBOX li:hover {
	transform:translate(0,-10px);
	-webkit-transform:translate(0,-10px);
	-moz-transform:translate(0,-10px);
	-o-transform:translate(0,-10px);
	-ms-transform:translate(0,-10px);
}

.gift_S {   display:none;}/*===========手機板關掉=============*/
.btn_member { margin: 0% 0% 2% 0%;     }
.btn_member a {width: 52%; line-height: 1.6em;  margin: 0 auto; display: block; 
	text-align: center; color: #FFFFFF; font-size: 28px;  background-color: #ff0042; 
	border-radius: 10px; font-weight: bold;}
.btn_member a:hover{ background-color: #d20036;}

/*======================獎項 for ipad====================================*/
@media only	screen and (min-width: 812px) and (max-width: 1366px) {
* {	-webkit-box-sizing: border-box;	box-sizing: border-box;}
.jia_frame { width: 100%; overflow: hidden; padding-top: 1%;  }
	.jia_frame h3{ font-size: 38px; text-align: center; line-height: 2em;}
.btn_member a {width: 72%; line-height: 1.6em;  margin: 0 auto; display: block; 
	text-align: center; color: #FFFFFF; font-size: 28px;  background-color: #ff0042; 
	border-radius: 10px; font-weight: bold;}
	
.giftBOX{ width :80%; margin: 0 auto; text-align:center; padding: 0% 2% 0% 2%;   position:relative;}
.giftBOX ul{ width: 100%; margin: 0 auto;}
.giftBOX ul li{ width: 25%; padding: 1% 1% 3% 0%; float:left; display:inline-block;}
.giftBOX li .pic{margin:0; }
.giftBOX li{
	transition:All 0.4s ease-in-out;
	-webkit-transition:All 0.4s ease-in-out;
	-moz-transition:All 0.4s ease-in-out;
	-o-transition:All 0.4s ease-in-out;
}
.giftBOX li:hover {
	transform:translate(0,-10px);
	-webkit-transform:translate(0,-10px);
	-moz-transform:translate(0,-10px);
	-o-transform:translate(0,-10px);
	-ms-transform:translate(0,-10px);
}
	
.gift_S { display:none;}/*======手機板關掉=========*/
	
}


@media screen and ( max-width:1024px) {}
/*======================獎項 for MB====================================*/
@media screen and ( max-width:812px) {
* {	-webkit-box-sizing: border-box;	box-sizing: border-box;}
    html, body {-webkit-text-size-adjust: none;}    
	.jia_frame { width: 100%;}	
	.jia_frame h3{ font-size: 28px; text-align: center; line-height: 2.5em;}
.btn_member a {width: 96%; line-height: 1.6em;  margin: 0 auto; display: block; 
	text-align: center; color: #FFFFFF; font-size: 26px;  background-color: #ff0042; 
	border-radius: 10px; font-weight: bold; margin-bottom: 5%;}
	
	.jia_frame .midline { margin-bottom: 4%; padding-top: 3%; width: 95%; font-weight: normal;}
}

@media (max-width:576px) {
.jia_frame { padding: 0% 0 0%; }
.giftBOX { width :100%; margin: 0 auto; padding: 0% 2% 2% 2%;}
.gift_S{ width: 100%;  margin: 0 auto;display:block;  padding-bottom:5px;}/*====手機板===========*/
.giftBOX ul {display:  none; }/*========桌機板===關掉===============*/
}







/*=============投保限額 展開=================================================================================*/
.methods_frame2 .more { font-size : 0; text-align: center;  margin : 20px auto; }
.methods_frame2 .more img, .methods_frame2 .more p { display: inline-block; vertical-align: middle; cursor: pointer; }
.methods_frame2 .more p { font-size: 38px; font-weight: bold; color : #262b33; padding-left: 15px; }
#ntc_frame_award { color: #000000; background-color: #f5f6f8;  }
.quota_L{ width:100%; height: auto; margin: 0 auto; padding: 1% 2%;}
.quota_S{ display: none;}

.ntc_frame .ntc_ctn { padding: 10px 40px;  }
.ntc_frame .ntc_txt { line-height: 2em ; font-size: 18px; margin-bottom: 10px; }
.ntc_frame .ntc_txt:not(.test) { display: none; }
.ntc_frame .ntc_txt x { font-weight: bold; }
.ntc_frame .ntc_title .more > * { vertical-align: middle; }
.ntc_frame .ntc_title .more::before { content: ""; display: inline-block;  vertical-align: middle;  width: 0;  height: 100%;  font-size: 0; }
.ntc_frame ._plus {  position: relative; width: 20px;  height: 20px;  display: inline-block; margin-left: 15px; }
.ntc_frame ._plus::before, .ntc_frame ._plus::after { content: ""; position: absolute; top: calc(50% - 1px); left: 0; right: 0;  height: 2px;       background-color: #262b33; transition: .3s; }
.ntc_frame ._plus:not(.active)::after { transform: rotate(-90deg) }

@media only	screen and (min-width: 812px) and (max-width: 1366px) {
  .ntc_txt p { line-height: 2em ; font-size: 18px; }
.quota_S{ display: none;}	
}

@media (max-width:1024px) {
  .ntc_txt p { line-height: 2em ; font-size: 18px; }
	.quota_S{ display: none;}	

}


@media (max-width:768px) {

  .methods_frame li { font-size: 20px; }
  .methods_frame li p { font-size: 16px;   }
  .methods_frame2 .more { margin: 30px auto; }
  .methods_frame2 .more p { font-size: 28px; }
  .ntc_txt p { line-height: 2em ; font-size: 16px; }
  .decimal_gift li { font-size : 18px; font-weight: bold;  color: #4c0014;  line-height: 1.7; margin-top : 30px; }
  .decimal_gift p { font-size: 16px; line-height: 2em; font-weight : normal;  color: #4b4a4a;  padding-left: 5px; }
		.quota_S{display: block; width:99%; height: auto; margin: 0 auto; padding: 1% 0% 1% 3%;}
	.quota_L{ display: none;}	

}

@media (max-width:576px) {
		#ntc_frame_award  { width: 100%; padding: 0% 2% 0% 0%  }
  .ntc_frame .ntc_ctn {  }    
  .ntc_frame ._plus { width: 15px; height: 15px;   }
  .methods_frame2 .more { margin: 20px auto; }
  .methods_frame2 .more p { font-size: 28px; padding-left: 0;  }    
  .ntc_txt p { line-height: 2em ; font-size: 16px; }
		.quota_S{display: block; width:99%; height: auto; margin: 0 auto; padding: 1% 0% 1% 3%;}
		.quota_L{ display: none;}	

}



/*=============活動辦法 展開=====================*/
.methods_frame2 .more { font-size : 0; text-align: center;  margin : 20px auto; }
.methods_frame2 .more img, .methods_frame2 .more p { display: inline-block; vertical-align: middle; cursor: pointer; }
.methods_frame2 .more p { font-size: 38px; font-weight: bold; color : #262b33; padding-left: 15px; }
#ntc_frame_activ { color: #000000;  }
.ntc_frame .ntc_ctn { padding: 10px 40px; }
.ntc_frame .ntc_txt { line-height: 2em ; font-size: 18px;}
.ntc_frame .ntc_txt:not(.test) { display: none; }
.ntc_frame .ntc_txt x { font-weight: bold; }
.ntc_frame .ntc_title .more > * { vertical-align: middle; }
.ntc_frame .ntc_title .more::before { content: ""; display: inline-block;  vertical-align: middle;  width: 0;  height: 100%;  font-size: 0; }
.ntc_frame ._plus {  position: relative; width: 20px;  height: 20px;  display: inline-block; margin-left: 15px; }
.ntc_frame ._plus::before, .ntc_frame ._plus::after { content: ""; position: absolute; top: calc(50% - 1px); left: 0; right: 0;  height: 2px;       background-color: #262b33; transition: .3s; }
.ntc_frame ._plus:not(.active)::after { transform: rotate(-90deg) }

@media only	screen and (min-width: 812px) and (max-width: 1366px) {
  .ntc_txt p { line-height: 2em ; font-size: 18px; }
}

@media (max-width:1024px) {
  .ntc_txt p { line-height: 2em ; font-size: 18px; }
}

@media (max-width:768px) {
  .methods_frame li { font-size: 20px; }
  .methods_frame li p { font-size: 16px; padding-left: 3px;  }
  .methods_frame2 .more { margin: 30px auto; }
  .methods_frame2 .more p { font-size: 28px; }
  .ntc_frame .ntc_txt { line-height: 2em ; font-size: 16px;}
  .decimal_gift li { font-size : 18px; font-weight: bold;  color: #4c0014;  line-height: 1.7; margin-top : 30px; }
  .decimal_gift p { font-size: 16px; line-height: 2em; font-weight : normal;  color: #4b4a4a;  padding-left: 5px; }
}

@media (max-width:576px) {
  .ntc_frame .ntc_ctn { padding: 20px; }    
  .ntc_frame ._plus { width: 15px; height: 15px;  margin-left: 10px; }
  .methods_frame2 .more { margin: 20px auto; }
  .methods_frame2 .more p { font-size: 28px; padding-left: 0;  }     
}


/*=============注意事項 展開=====================*/
.methods_frame2 .more { font-size : 0; text-align: center;  margin : 20px auto; }
.methods_frame2 .more img, .methods_frame2 .more p { display: inline-block; vertical-align: middle; cursor: pointer; }
.methods_frame2 .more p { font-size: 38px; font-weight: bold; color : #262b33; padding-left: 15px; }
#ntc_frame { color: #000000; background-color: #f5f6f8;  }
.ntc_frame .ntc_ctn { padding: 10px 20px; }
.ntc_frame .ntc_txt{ line-height: 2em ; font-size: 18px; font-weight: normal;}
.ntc_frame .ntc_txt:not(.test) { display: none; }
.ntc_frame .ntc_txt x { font-weight: bold; }
.ntc_frame .ntc_title .more > * { vertical-align: middle; }
.ntc_frame .ntc_title .more::before { content: ""; display: inline-block;  vertical-align: middle;  width: 0;  height: 100%;  font-size: 0; }
.ntc_frame ._plus {  position: relative; width: 20px;  height: 20px;  display: inline-block; margin-left: 15px; }
.ntc_frame ._plus::before, .ntc_frame ._plus::after { content: ""; position: absolute; top: calc(50% - 1px); left: 0; right: 0;  height: 2px;       background-color: #262b33; transition: .3s; }
.ntc_frame ._plus:not(.active)::after { transform: rotate(-90deg) }

@media only	screen and (min-width: 812px) and (max-width: 1366px) {
  .ntc_txt p { line-height: 2em ; font-size: 16px; }
}

@media (max-width:1024px) {
  .ntc_txt p { line-height: 2em ; font-size: 16px; }
}
@media (max-width:768px) {
  .methods_frame li { font-size: 20px; }
  .methods_frame li p { font-size: 16px; padding-left: 3px;  }
  .methods_frame2 .more { margin: 30px auto; }
  .methods_frame2 .more p { font-size: 28px; }
  .ntc_frame .ntc_txt { line-height: 2em ; font-size: 16px;}
  .decimal_gift li { font-size : 18px; font-weight: bold;  color: #4c0014;  line-height: 1.7; margin-top : 30px; }
  .decimal_gift p { font-size: 16px; line-height: 2em; font-weight : normal;  color: #4b4a4a;  padding-left: 5px; }
}

@media (max-width:576px) {
  .ntc_frame .ntc_ctn { }    
  .ntc_frame ._plus { width: 15px; height: 15px;  margin-left: 10px; }
  .methods_frame2 .more { margin: 20px auto; }
  .methods_frame2 .more p { font-size: 28px; padding-left: 0;  }     
}




/* --- footer ------------------------------------ */
footer { display: block; text-align: center; padding: 25px 10px 50px 10px; border-bottom: 16px solid #ed1b2e; font-size:15px; color: #6d6d6d; 
         line-height: 1.5; box-shadow: 0px -2px 10px #eeeeee; }
footer .fo_ctn { max-width: 600px; margin: auto; }
footer .fo_ctn .fo_media a { width : 30px; padding: 0 8px 8px;  box-sizing : content-box; font-size: 0; line-height: 1; }
footer .fo_link a {  color : #6d6d6d;  -webkit-transition: .5s;  transition: .5s; line-height: 30px; text-decoration: underline;}
/*--- footer .fo_link a::after {  content: "｜";  padding: 0 5px; } ----*/
footer .fo_link a:nth-of-type(5)::after, footer .fo_link a:nth-of-type(9)::after { content: ""; }
footer .fo_link a:hover {  color: #ed1b2e; }

@media (max-width:1024px) { footer { border: none; } }

@media (max-width:576px) {
	footer { padding: 25px 10px 40px 10px; border-bottom: 16px solid #ed1b2e;
         line-height: 1.5; box-shadow: 0px -2px 10px #eeeeee; }
	footer .fo_ctn { max-width: 350px; } 
	footer .fo_link a {  color : #6d6d6d;  -webkit-transition: .5s;  transition: .5s; line-height: 24px;}
}


/*=============手機板 固定下方按鈕=====================*/
btn_mobile { width: 100%; height: auto;  }
#btn_mobile img#btnS{ display: none;}

@media screen and ( max-width:812px) {
* {	-webkit-box-sizing: border-box;	box-sizing: border-box;}
    html, body {-webkit-text-size-adjust: none;}
    
#btn_mobile img#btnS{ width: 100%; display: block; height: auto; position: fixed;  bottom: 0px;}
}

@media  ( max-width:1024px) {
btn_mobile { width: 100%; height: auto;  }

    
#btn_mobile img#btnS{ width: 100%; display: block; height: auto; position: fixed;  bottom: 0px;}
}

@media only	screen and (min-width: 812px) and (max-width: 1366px) {
* {	-webkit-box-sizing: border-box;	box-sizing: border-box;}
#btn_mobile img#btnS{ display: none;}
#go-buy-btn{}    
}










.ctn1 { max-width: 1140px; margin: auto; }
.fx { display: flex; }
.jcc { justify-content: center; }
.aic { align-items: center; }
.h100 { height: 100%; }
._noto { font-family: "Noto Sans TC", "微軟正黑體", "Microsoft JhengHei", "Segoe UI", Arial, sans-serif; }
.nav_mask { position: fixed; top: 0; left: 0; right: 0;  bottom: 0; z-index: 4;  background-color: rgba(0, 0, 0, 0.5) }
.nav_mask:not(.active) { display: none; }



