@charset "utf-8";

@font-face {
  font-family: Microsoft JhengHei;
  unicode-range: U+7db0, U+78A7, U+7B75;
  font-style: normal;
  font-weight: normal;
  src: local(Microsoft JhengHei);
}

/*全BOX版面*/
.WRAPPER { position: relative; display:block; margin: 0 auto; padding: 0; width:100%;  min-width:1220px; overflow:hidden; font-family:"微軟正黑體","Microsoft JhengHei",Helvetica; background: url(bg_repeat.jpg?t=1751020131695) center repeat-y;background-color: #007e5c;}
.WRAPPER img { width:100%; border:0px; vertical-align:top;}
.WRAPPER a { text-decoration:none;}
		@media screen and (max-width:767px){
		.WRAPPER { min-width: inherit;  background: url(m_bg_repeat.jpg?t=1751020131695) center repeat-y; background-size: 100%;}
			}


/*PC背景*/
.Area_bgtop {z-index: 0; position: absolute; top: 0; left: 50%; width: 2000px; -webkit-transform:translateX(-50%); transform: translateX(-50%); pointer-events: none; }
.Area_bgtop .bgtop_{position:absolute;top:0;left:0;width:100%;height:1000px}
.Area_bgtop .bgtop_ span{position:absolute;display:block;width:100%;height:100%;background-position:center top}
	/*PC背景*/
		@media screen and (min-width:768px){
			.Area_bgtop_1 { height: 780px; overflow: hidden;}
			.Area_bgtop_1 .bgtop_ { opacity: 1;}
			.Area_bgtop_1 .bgtop_ span { height: 100%; }
			.Area_bgtop_1 .bgtop_1  { width:100%; height: 700px; top: 0; opacity: 1;}
			.Area_bgtop_1 .bgtop_1 span { background-image: url(bgtop_1.jpg?t=1751020131695); background-position: top center; background-repeat: no-repeat;}
	    }



/*MB背景*/
.m_Area_bgtop { z-index:0; position:absolute;top:0vw;left:0;width:100%; height:100%; pointer-events:none; }
.m_Area_bgtop .m_bgtop_ { position:absolute;top:0; left:0; width:100%; height:0; padding-bottom:100%; }
.m_Area_bgtop .m_bgtop_ span { position:absolute; display:block; width:100%;height:100%; padding-bottom:100%; overflow:hidden; background:center top no-repeat; background-size:100%;}
		@media screen and (max-width: 767px){
			.m_bgtop_1 span { z-index:-1; background-image:url( m_bgtop_1.png?t=1751020131695 ) }
		}



/*區塊_all*/
.Area { position: relative; margin:0 auto; padding:0; border-radius:0; text-align:center; }
/*.Area a { display:block;} */
.Area .go_bt {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;}
.Area .go_bt:hover {
  -webkit-transform:scale(0.95);
     -moz-transform:scale(0.95);
      -ms-transform:scale(0.95);
       -o-transform:scale(0.95);
          transform:scale(0.95);}
.Area1220 { margin:0 auto; width:1220px;}
.Area960 { margin:0 auto; width:960px;}
	@media screen and (max-width:767px){
		.Area1220 { width:100%;}
		.Area960 {width:100%;}
		/*區塊_切割*/
		.Area_1bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn a { float:left; margin:0 0 2% 0; padding:0; width:100%; list-style: none;}
		.Area_2bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn a { float:left; margin:0 1% 2%; padding:0; width:48%; list-style: none;}
		.Area_3bn { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn a { float:left; margin:0 1% 2% ; padding:0; width:31.3%; list-style: none;}
		.Area_1bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_1bn_nopadding a { float:left; margin:0; padding:0; width:100%; list-style: none;}
		.Area_2bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_2bn_nopadding a { float:left; margin:0; padding:0; width:50%; list-style: none;}
		.Area_3bn_nopadding { margin: 0 auto; padding:0; overflow:hidden;}
		.Area_3bn_nopadding a { float:left; margin:0; padding:0; width:33.3%; list-style: none;}
	}

/*共用*/

body{ margin:0; padding:0;background-color: #007e5c;}

table{	border-collapse: collapse;	margin:0px auto;font-family: "Century Gothic","Microsoft JhengHei" ;}
th{	border:1px solid#FFFFFF;height: 30px;text-align: center;}
td{	border:1px solid#FFFFFF;height: 30px;text-align: center;}

.space { margin-bottom:80px;}
	@media screen and (max-width:767px){
		.space {margin-bottom: 10vw;}
		.m_Area96p {width:96%} 
	}
	



/*版頭*/
.Area_top {position: relative; height: 650px;}
.Area_top .box{position:absolute;display: flex; margin: 0 auto 0;}
    .Area_top .box{ height: 500px; width:90%;top:55px;right:379px;margin:0 auto;padding:0; display: flex;flex-direction:column;flex-wrap:wrap;align-items:center;justify-content: center;}
    .Area_top .box ul li { list-style:none; float:left; width:33.33%;}
    .Area_top .box ul li img{ width:100%;}

    .Area_top .box .date {position:relative;font-size:2em;color:#414141;font-family: "Century Gothic","Microsoft JhengHei";font-weight: bold;}
    .Area_top .box .logo1 {position:relative; width: 45%; }
    .Area_top .box .sub {position:relative; width: 45%; }
    .Area_top .box .subFree {position:absolute;font-size:3.5em;top:30px;left:40px;color:#FFF;}
    .Area_top .box .PdTitle {position:relative;font-weight:900;font-size:4.5em;color:#000;font-family:Noto Sans CJK SC, "Microsoft JhengHei", Helvetica;bottom: 10px;}
    .Area_top .box .logo2 { position:relative;  width: 33%;}
    .Area_top .morebtn { z-index:6; position:absolute; top: 69px; right:45px;}
    .Area_top .morebtn img { width: 100%; }

	@media screen and (max-width:767px){
    .Area_top {position: relative; height:70vw;}
    .Area_top .box{position:absolute;display: flex; margin: 0 auto 0;}
        .Area_top .box{height:53vw;width:100%;top:3vw;right:20vw;margin:0 auto;padding:0; display: flex;flex-direction:column;flex-wrap:wrap;align-items:center;justify-content: center;}
        .Area_top .box ul li { list-style:none; float:left; width:33.33%;}
        .Area_top .box ul li img{ width:100%;}
    
        .Area_top .box .date {position:relative;font-size:1.5em;color:#414141;font-family: "Century Gothic","Microsoft JhengHei";font-weight: bold;}
        .Area_top .box .logo1 {position:relative; width: 55%; }
        .Area_top .box .sub {position:relative; width: 53%; }
        .Area_top .box .subFree {position:absolute;font-size:1.8em;top:3vw;left:7vw;color:#FFF;font-weight:800;}
        .Area_top .box .PdTitle {position:relative;font-weight:900;font-size:2.1em;color:#000;font-family:Noto Sans CJK SC, "Microsoft JhengHei", Helvetica;bottom: 4px;left: 5px;}
        .Area_top .box .logo2 { position:relative;  width: 40%;bottom: 1vw;}
        .Area_top .morebtn { z-index:6; position:absolute; top: 69px; right:45px;}
        .Area_top .morebtn img { width: 100%; }
	}




    /*登記活動*/
    .Area_grabgift {width:1000px;font-size: 46px;margin-top:2rem;margin-bottom:3rem;}
    .Area_grabgift .BGbox{overflow:hidden; border-radius: 30px;}
    .Area_grabgift .BGbox .title {background-color:#f08200; color:#fff;font-size:2.5rem; padding:8px 0;}
    .Area_grabgift .box {position: relative; display:flex; text-align: left; align-items:flex-start;gap:1.75rem; padding: 2.75rem 3rem 2.75rem;left:0;right: 0;background:#e5e5e5;margin-inline:auto;}
    .Area_grabgift .BGbox h3{position: relative; color: #fff;top:10px;}
    .Area_grabgift .BGbox .title img{width: 10%;padding-top:.4rem;}
    .Area_grabgift .pd-info {position: relative;display: flex;flex-direction: column;flex-basis: 49%;}
    .Area_grabgift .pd-info .txt01 {color:#302f2f;font-weight: bolder;font-size: 2.5rem;margin-bottom: .5rem;font-family:Noto Sans CJK SC, "Microsoft JhengHei", Helvetica;line-height: 1.2em;letter-spacing: -0.025em;}
    .Area_grabgift .pd-info .txt01 a {position:relative; font-size: 25px;top: -10px;left:-10px;}
    .Area_grabgift .pd-info .txt02 {color:#555960;font-weight:500;font-size: 2rem;margin-top: 0.5rem;margin-bottom: 0.5rem;font-family:"Century Gothic";}
    .Area_grabgift .pd-info .txt03 {font-size: 25px;font-weight:600;margin-bottom: .5rem;}
    .Area_grabgift .pd-info .btn {width:60%;}
    .Area_grabgift .pd-info .txt_cpNum {position:relative;font-size:1.5rem;font-weight:bold;color: #555960;margin-top: 0.5rem;margin-bottom: 1rem;}
    .Area_grabgift .pd-info .pd-info-notice{position: relative;font-size:1.5rem;color: #555960;list-style:none;}


        @media screen and (max-width:767px){
          .Area_grabgift {width:96%;font-size: 39px;margin-top:0;margin-bottom:2rem;}
		  .Area_grabgift .BGbox{border-radius:3vw;}
    	  .Area_grabgift .BGbox .title { background-color:#f08200; color:#fff;font-size:1.5rem;padding-block:0.25rem;}
          .Area_grabgift .box {position: relative;display: flex;text-align: left;align-items:flex-start;gap: 0.6rem;padding: 0.72rem;;left:0; background:#e5e5e5;} 
          .Area_grabgift .BGbox h3{position: relative; color: #fff;top:0;font-size: 33px;transform: scale(0.8);}
          .Area_grabgift .BGbox .title img{width: 16%;padding-top:.2rem;}
		  .Area_grabgift .pd-img { flex-basis:45%;}
		  .Area_grabgift .pd-info {position: relative;display: flex;flex-direction: column; flex-basis:55%;}
          .Area_grabgift .pd-info .txt01 {color:#302f2f;font-weight: bolder;font-size: 1.44rem;margin-bottom:0.1em;letter-spacing:-0.025em;line-height: 1.1em;}
		  .Area_grabgift .pd-info .txt01 a {position:relative; font-size:1.2rem; top: inherit;}
          .Area_grabgift .pd-info .txt02 {color:#555960;font-size: 1.2rem;margin-top: 0.275rem;margin-bottom: 0.275rem;}
          .Area_grabgift .pd-info .txt03 {font-size: 16px;font-weight:900;font-size: 1rem;margin-top: 0.275rem;margin-bottom: 0.275rem;}
          .Area_grabgift .pd-info .btn {width:75%;}
          .Area_grabgift .pd-info .txt_cpNum {position:relative;font-size:1rem;font-weight:bold;color: #555960;line-height: 1rem; margin-top: 0.275rem;margin-bottom: 0.4rem;}
          .Area_grabgift .pd-info .pd-info-notice{position:relative;font-size:0.82rem;color: #555960;list-style:none;}
			/*好康2*/
			.Area_grabgift2 .pd-info .txt02 { margin-bottom: -.3em;}
			.Area_grabgift .pd-info .pd-info-notice { font-size:0.9rem; letter-spacing: -.02em;}
        } 

    /*活動說明*/
    .Area_grabgift .box_list { margin-top: 1em;}
    .Area_grabgift .box_list a { display: inline; text-decoration: underline; color: #942a0e;}


.Area_bgfooter { color: #fff; font-family: "Century Gothic","Microsoft JhengHei"; font-size: 16px;}
.Area_bgfooter .box_list { text-align: justify;}
.Area_bgfooter .box { width: 90%; margin: 0 auto;  }
.Area_bgfooter .box_list h3 { font-size: 2rem; margin-bottom: 0.25em;line-height:140%;}
.Area_bgfooter .box_list ol { margin: 0; padding: 0; padding-left: 1em;}
.Area_bgfooter .box_list ul { margin: 0; padding: 0; list-style: none;}
.Area_bgfooter .box_list li { margin: 0; padding: 0; margin-bottom: 1.75rem;line-height:150%;}
.Area_bgfooter .box_list li img { margin: 0.25em 0.25em; width:60px;box-shadow:none;}
    @media screen and (min-width:768px){
      .Area_bgfooter .box .box_list { font-size: 1.5em; padding: 0%;}
    }
    @media screen and (max-width:767px){
      .Area_bgfooter .box .box_list { font-size: 0.875em; padding: 0;}
	  .Area_bgfooter .box_list h3 { font-size: 1rem; margin-bottom: 0.25em;line-height:140%;}
      .Area_bgfooter .box_list li { margin: 0; padding: 0; margin-bottom: .875rem;line-height:150%;}
	  .Area_bgfooter .box_list li img { margin: 0.25em 0.25em; width:12.5%;box-shadow:none;}
    }


/*分享浮層*/
.floatBox { position:relative; margin:2% auto; padding: 2% 0; width: 700px; height:auto; background-color:rgba(0,0,0,0.8); text-align:center; position:relative; border-radius:20px;}
.floatBox img { width:100%; height:auto;}
.floatBox .go_bt {
  -webkit-transition: all 0.2s ease;
     -moz-transition: all 0.2s ease;
      -ms-transition: all 0.2s ease;
       -o-transition: all 0.2s ease;
          transition: all 0.2s ease;}
.floatBox .go_bt:hover { filter: brightness(120%);
  -webkit-transform:translateY(-6px);
     -moz-transform:translateY(-6px);
      -ms-transform:translateY(-6px);
       -o-transform:translateY(-6px);
          transform:translateY(-6px);}
.floatBox .closeButton a { display:block; cursor:pointer; position:absolute; top:-20px; right:-20px; width:40px; height:40px; border-radius:50%; border:solid 2px #999999; font:bold 40px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
.floatBox .closeButton:hover {background-color:#666; text-decoration:none;}
.floatBox .closeButton:hover {background-color:#666; text-decoration:none;}
.floatBox .title  { display:inline-block; margin:0 0 10px 0; border-bottom:1px solid #ffd800; font:bold 36px/1.5em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;  color:#ffd800; text-align:center}
.floatBox .box_ { margin:0 auto; width:90%;}
.floatBox .box_:after { content: ""; display:block; clear:both;}
.floatBox .box_btn { margin:20px auto 0; width: 80%;}
.floatBox .box_btn a { display:block; margin:3% 0;}
.floatBox .box_btn img { width:100%;}
.floatBox .box_btn .btn { margin:0 auto; width:60%;}
.floatBox .box_btn2 a { float:left; margin:0 1%; width:48%;}
  @media screen and (max-width:767px){
    .floatBox { padding:5% 0; width:90%; height: auto;}
    .floatBox .closeButton a {display:block; position:absolute; top:-15px; right:-15px; width:30px; height:30px; border-radius:50%; border:solid 2px #999999; font:bold 30px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none; z-index:2}
    .floatBox .closeButton:hover {background-color:#666; text-decoration:none}
    .floatBox .title  { margin:0 5% 3vw; font-size: 5vw; line-height:2rem;}
    .floatBox .box_btn { margin:2% auto 0;}
    .floatBox .box_btn .btn { margin:0 auto; width:80%;}
  }



/*好友進度查詢*/
.refArea { width:700px; position:relative; display:block; margin: 0 auto; padding:0px; height: auto; background-color:rgba(0,0,0,0.8); border-radius:20px;}
.refArea .closeBN a { z-index:2; position:absolute; top:-20px; right:-20px; display:block; width:40px; height:40px; border-radius:50%; border:solid 2px #999999; font:bold 40px/1em "Century Gothic"; color:#FFF; text-align:center; background-color:rgba(0%,0%,0%,0.5);text-decoration: none;}
.refArea .closeBN a:hover { background-color:#666; text-decoration:none}
.refArea .title  { margin:0 50px 10px; border-bottom:1px solid #ffd800; font:bold 45px/2em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;  color:#ffd800; text-align:center}
.refArea .title2 { margin:20px auto 0px; font:bold 28px/1em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: 0.1em;  color:#fff; text-align:center}
.refArea .title3 { margin-top:10px; font:bold 18px/1em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: 0.1em;  color:#fff; text-align:center}
.refArea .ref_Date ul { margin: 0 auto; padding: 10px 50px;}
.refArea .ref_Date li { display:inline-block; margin:5px; padding:0px; width:70px; height:70px;border-radius:50%; text-shadow:rgba(0%,0%,0%,0.15) 1px 1px; color:#fff; letter-spacing: -0.05em; text-align:center; background-color:#979797;text-align:center; box-shadow: 0px 0px 3px 3px rgba(0%,0%,0%,0.15),0px 0px 0px 5px rgba(100%,100%,100%,0.1) inset;}
.refArea .ref_Date li .month {font:bold 20px/1.5em "Century Gothic"; margin: 5px auto 0 auto; border-bottom:#FFF solid 1px; width:80%}
.refArea .ref_Date li .date {font:bold 20px/1em "Century Gothic"; margin:0; margin-top:4px}
.refArea .ref_Date li.opendate { background-color:#8D0000; box-shadow: 0px 0px 3px 3px rgba(0%,0%,0%,0.15),0px 0px 0px 5px rgba(100%,100%,100%,0.1) inset;color:#fff;  }
.refArea .ref_List table { margin:0 auto; padding: 10px 0;}
.refArea .ref_List .table2 {font:bold 20px/1.2em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em; color:#FFF; text-align:center; background-color:#999}
.refArea .ref_List .table3 {font:bold 20px/1.2em "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: 0.0001em; color:#000; text-align:center; background-color:#FFF}
.refArea .ref_List table td,
.refArea .ref_List table td { border: 1px solid #340d4d; font: bold 20px/1.5em "微軟正黑體", "Microsoft JhengHei", "Century Gothic";}
.refArea .ref_List .txtsmall { padding:40px; padding-top:10px; font: 20px/18px "微軟正黑體", "Microsoft JhengHei", "Century Gothic"; color:#fff;  text-align:left;}
  @media screen and (max-width:767px){
    .refArea { width:90%;}
    .refArea .closeBN a { top:-15px; right:-15px; width:30px; height:30px; font-size:30px;}
    .refArea .title  { margin:0 5%; font-size:30px;}
    .refArea .title2 { margin:10px auto 0px; font-size:20px; }
    .refArea .title3 { margin:10px auto 0px; font-size:14px; }
    .refArea .ref_Date ul { margin:0 auto; padding: 10px 20px 20px;}
    .refArea .ref_Date li { margin:3px; width:40px; height:40px;}
    .refArea .ref_Date li .month { font-size:12px; line-height:1.3em; margin-top:4px;}
    .refArea .ref_Date li .date { margin-top:2px; font-size:12px;}
    .refArea .ref_List table { }
    .refArea .ref_List .table2 { font-size:12px;}
    .refArea .ref_List .table3 { font-size:12px;}
    .refArea .ref_List .table2 td,
    .refArea .ref_List .table3 td { font-size:12px; line-height:1.2em;}
    .refArea .ref_List .txtsmall { padding:20px; padding-top:10px; font-size:16px; line-height:18px; color:#fff;  text-align:left;}
  }

	
/*隱鑶*/
.for_pc {}
.for_phone { display:none !important;}
	@media screen and (max-width:767px){
		.for_pc { display:none !important;}
		.for_phone { display: inherit !important;}
	}