@charset "utf-8";
/*基本*/
body { margin: 0; padding: 0; width:100%;background-color:#fff; }
@media screen and (max-width:767px){
  body { background-color:#fff; }
}
.for_phone { display:none;}
 @media screen and (max-width:767px){
                .for_pc{ display:none !important;}
                .for_phone{ display:block !important;}
				 body { margin: 0; padding: 0; background-image:none }
				 .for_m_magintop { margin-top:3vw;}
 }


/*全BOX版面*/
.WRAPPER {position:relative; display:inline-block;  margin:0; padding:0;  width:100%;  overflow:hidden;min-width:1220px;   }
.WRAPPER img {border:0; vertical-align:top;}
.WRAPPER .mainArea {  margin:0 auto; width:1220px; font-family:"Century Gothic", "微軟正黑體", sans-serif; position:relative; }
.WRAPPER .mainArea a{ padding:0; margin:0; text-decoration:none; font-family:"微軟正黑體" }
.WRAPPER  a { text-decoration:none;font-family:"微軟正黑體"} 
/*控制區塊背景的位置*/
.Areabg{ margin-left:-390px;} 
@media screen and ( max-width:736px) {
	.WRAPPER {min-width: inherit; }
	.WRAPPER img {width:100%; height:auto;}
}



/*區塊背景*/
@media screen and (min-width:768px) {
  .repeat_bg2{position:absolute;z-index: -7;left:0;top: 0;width:100%;min-width:1220px;height:40000px;background-image:url(pc_reapet.jpg?t=1724990151425);background-repeat:repeat-y;background-position:center top;pointer-events:none;}
  }
  



/*區塊_all*/
.Area1220 {position: relative;margin:0 auto;width:1220px;}
.Area960 {margin:0 auto;width:960px;}
.Area {position: relative;margin:0 auto;padding:0;border-radius:0;text-align:center; }
.Areaa {position:relative;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);}



 @media screen and (max-width:767px){
  .Area1220 { width:100%;}
  .Area960 {width:100%;}
  .Area .go_bt:hover {  
   -webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none;}
 }
    
/*區塊-共用按鈕*/
.Area .btn_go {}
.Area .btn_go *{-webkit-transition: all 0.1s ease;-moz-transition: all 0.1s ease;-ms-transition: all 0.1s ease;-o-transition: all 0.1s ease;transition: all 0.1s ease;} 
.Area .btn_goa:hover {  -webkit-transition: all 0.35s;transition: all 0.35s;-webkit-transform: scale(0.9);transform: scale(0.9);}
.Area .btn_goa:after  { 
          -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;}
;o:hover a { color:#fff;}
;
.Area .btn_go:hover a:after  { width:150% !important;}
;

.Area .btn_go:hover a i { background-color:#000;transform:translateX(-10px);transition-delay:0.1s;}
.Area .btn_goastrong {z-index:2;position: relative; }
.Area .btn_goai {z-index: 3;position: absolute;top: -63px;right: -278px;display: inline-block;border-radius: 60px;width: 60px;height: 60px;background: #09006e url(btn_icon_r.png?t=1696598482216);background-size: contain;
}
 @media screen and (max-width:736px){ 
   .Area{width:100%;height:100%;min-width:100%;}
  .Area .btn_go {position:absolute; }
  .Area .btn_go *{-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;} 
  .Area .btn_go a {display:block;color:#fff;letter-spacing:-2px;}
  .Area .btn_go a:after  {}
  .Area .btn_go:active a,
  .Area .btn_go:focus a,
  .Area .btn_go:hover a { color:#fff;}
  .Area .btn_go:active a:after,
  .Area .btn_go:focus a:after,
  .Area .btn_go:hover a:after  { width:150% !important;}
  .Area .btn_go:active a i,
  .Area .btn_go:focus a i,
  .Area .btn_go:hover a i { background-color: transparent;transform:translateX(-10px);transition-delay:0.1s;}
  .Area .btn_go a strong {z-index:2;position: relative; }
  .Area .btn_go a i {z-index:3;position: absolute;top:0;right:0;display:inline-block;border-radius:35px;width:35px;height:35px;}
 }



/*---統一設定---*/
:root{
  /*色系*/
  ---black-txt-color:#121212;
  ---gray-txt-color:#353535;
  ---light-gray-txt-color:#7c7c7c;
  ---white-txt-color:#ffffff;
  ---font-size:16px;
  ---main-color:#37a1f3;
  ---middle-color:#a9deff;
  ---border-color:#e0eef7;

}
@media screen and (min-width:768px){
  :root{
    ---border-radius:20px;
  }
}
@media screen and (max-width:767px){
  :root{
  ---border-radius:3vw;
}
}

#HH,#MM,#SS{display: none;}

/*---公版微調---*/
.PD_layout  ul,.PD_layout .PD_into,.PD_layout[data-pd-li=BN] ul, .PD_layout[data-pd-li=BN-AWD] ul, .PD_layout[data-pd-li=PDBN] ul{padding: 0;}
.PD_layout ul li{border: none;}


/*---影片(橫式)---*/
@media screen and (min-width:768px){
  .Area_video{margin: 50px auto 0 auto;height: 510px;}	
  .Area_video .video {position: relative;top: 67px;width: 960px;margin: 0 auto;height: 425px;background:rgba(0,0,0,1);}
  .Area_video .video iframe.mo { width:100%; height:100%;}
  }
  @media screen and (max-width:767px){
  .Area_video {}	
  .Area_video .video {position: relative;left: 50%;transform: translate(-50%);width: 100%;height:auto;background:rgba(0,0,0,1);}
  .Area_video .video iframe.mo {width:100%;height: 43vw;}
  }
  

/*--- 大標---*/
@media screen and (min-width:768px){
  .Area_main{margin: 0px auto 0 auto; height: auto;}	
  .Area_main .ly{width: 90%;overflow: hidden;}	
  .Area_main .ly ul {background-color: transparent;}
  .Area_main .ly ul li h3{color:var(---black-txt-color );font-size: calc(var(---font-size)*2.5);max-height: 3em;line-height: 1.5em;text-align: left;}	
  .Area_main .ly ul li h3 span{overflow-wrap: break-word;}	
  }
  @media screen and (max-width:767px){
  .Area_main {margin: 4vw auto 0 auto;}	
  .Area_main .ly{width: 90%;overflow: hidden;}	
  .Area_main .ly ul {}	
  .Area_main .ly ul li h3{color:var(---black-txt-color );font-size: calc(var(---font-size)*1.3);max-height: 3em;line-height: 1.5em;text-align: left;}	
  .Area_main .ly ul li h3 span{overflow-wrap: break-word;}	

  }




/*IT機制*/
 .Area_it {position: relative;margin: 0 auto;width: 55.7%;height: 494px;}
 .Area_it .sale .bg img { width: 100%;}
 .Area_it .target {text-align: left;font: bold 35px/39px "微軟正黑體","Microsoft JhengHei";color:var(---light-gray-txt-color);position: absolute;top: 190px;left: 169px;font-weight: 500;}
 .Area_it .target span { font-family: "Century Gothic";}
 .Area_it .percent {display: inline-flex;text-align: center;font: bold 43px/43px "Century Gothic";color:var(---black-txt-color);position: absolute;top: 88px;left: 50%;transform: translateX(-50%);}
 .Area_it .percent p { margin: 0; padding: 0;}
 .Area_it .price {display: inline-flex;text-align: left;font: bold 55px/65px "Century Gothic";color:var(---gray-txt-color);position: absolute;top: 113px;left: 172px;}
 .Area_it .price p { margin: 0; padding: 0;}
 .Area_it .quantity {display: inline-flex;text-align: left;font: bold 32px/24px "微軟正黑體","Microsoft JhengHei";color:var(---black-txt-color);position: absolute;top: 424px;left: 67px;}
 .Area_it .quantity p { margin: 0; padding: 0; font-family: "Century Gothic";}
@media screen and (max-width:767px){
  .Area_it {position: relative;margin: 0 auto;width: 90.7%;height: 49vw;}
  .Area_it  .momologo { display: none;}
  .Area_it .main { width: 100%; padding-top: 0; margin: 0;}
  .Area_it .topPD { position: inherit; top: 0; right: 0; width: 100%; margin-bottom: 10vw;}
  .Area_it .Area_it {width: 100%;padding: 0;top: 137vw;}
  .Area_it .target {font: bold 4vw/5vw "微軟正黑體","Microsoft JhengHei";top: 15.5vw;left: 24.5vw;font-weight: 400;}
  .Area_it .percent {font: bold 5vw/5.5vw "Century Gothic";top: 9VW;left: 12vw;letter-spacing: -1px;}
  .Area_it .price {font: bold 6vw/6vw "Century Gothic";top: 7vw;left: 25vw;}
  .Area_it .quantity {font: bold 4vw/5vw "微軟正黑體","Microsoft JhengHei";top: 39vw;left: 17vw;}
  .Area_it .quantity span{font-size: 3.5vw;font-weight: 400;}
}


/*倒數人數*/
@media screen and (min-width:768px){
  .Area_it .time_border{width: 90%; margin: 0 auto;border-top: 2px solid var(---border-color);}
  .Area_it .border01{position: relative;top: 330px;}
  .Area_it .border02{position: relative;top: 490px;}
  .Area_it .time_bg{position: absolute;top: 370px;left: 50%;transform: translateX(-50%);pointer-events: none;}
}
@media screen and (max-width:767px){
  .Area_it .time_border{width: 90%; margin: 0 auto;border-top: 2px solid var(---border-color);}
  .Area_it .border01{position: relative;top: 30vw;}
  .Area_it .border02{position: relative;top: 47vw;}
  .Area_it .time_bg{position: absolute;top: 34vw;pointer-events: none;}
}

/*集資條*/
@media screen and (min-width:768px){
 .circular_bar {position: absolute;top: 63px;left: -95px;display: block;width: 230px;height: 227px;margin: 0 auto;}
 .circle_process {position: relative;width: 230px;height: 227px;}
 .circle_process .wrapper {width: 112px;height: 225px;position: absolute;top:0;overflow: hidden;}
 .circle_process .border{border-radius: 100%;}
 .circle_process .border .circle{border:30px solid #f4f4f4;border-radius: 100%;}
 .circle_process .right { right: 0;}
 .circle_process .left {left: 5px;}
 .circle_process .circle {width: 163px;height: 163px;border: 30px solid transparent;border-radius: 50%;position: absolute;top: 0;transform: rotate(-135deg);}
 .circle_process .rightcircle {border-top: 30px solid var(---middle-color);border-right: 30px solid var(---middle-color);right: 0;}
 .circle_process .leftcircle {border-bottom: 30px solid var(---middle-color);border-left: 30px solid var(---middle-color);left: 0;}
 }
 @media screen and (max-width:767px){
   .circular_bar {position: absolute;top: 3vw;left: -0.8vw;display: block;width: 24vw;height: 23.5vw;margin: 0 auto;}
   .circle_process {position: relative;width: 24vw;height: 23.5vw;}
   .circle_process .wrapper {width: 12vw;height: 24vw;position: absolute;top: 0;overflow: hidden;}
   .circle_process .border{border-radius: 100%;}
   .circle_process .border .circle{border: 3vw solid #f4f4f4;border-radius: 100%;}
   .circle_process .right { right: 0;}
   .circle_process .left { left: 0;}
   .circle_process .circle {width: 18vw;height: 18vw;border: 3vw solid transparent;border-radius: 50%;position: absolute;top: 0;transform: rotate(-135deg);}
   .circle_process .rightcircle {border-top: 3vw solid var(---middle-color);border-right: 3vw solid var(---middle-color);right: 0;}
   .circle_process .leftcircle {border-bottom: 3vw solid var(---middle-color);border-left: 3vw solid var(---middle-color);left: 0;}
 }
 
 @-webkit-keyframes circle_right{
   0% { -webkit-transform: rotate(-135deg);}
   50%,100% { -webkit-transform: rotate(45deg);}
 }
 @-webkit-keyframes circle_left{
   0%,50% { -webkit-transform: rotate(-135deg);}
   100% { -webkit-transform: rotate(45deg);}
 }
 /*活動倒數*/
 .TimerNick {position: absolute;top: 419px;left: 538px;width: 13%;display: inline-block;z-index: 1;text-align: left;}
 .TimerNick .FontStyle {display: inline-block;margin: 0;padding: 0;border: 0;font: bold 36px/24px "Century Gothic";color:var(---gray-txt-color);letter-spacing: -1px;text-align: left;background: transparent;}
 .TimerNick span {padding-left: 6px;font: bold 29px/24px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: 0.1em;color:var(---gray-txt-color);}
   @media screen and (max-width:767px){
     .TimerNick  {width: 13%;top: 39vw;left: 62vw;}
     .TimerNick .FontStyle {padding: 0;border: 0;font: 4vw/4vw Arial;font-weight: 700;}
     .TimerNick span {padding-left: 0;margin-left: 0.8vw;font: bold 3.5vw/4.8vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica;letter-spacing: -0.05em;}
   }



/*--- 介紹內容---*/
@media screen and (min-width:768px){
  .Area_content{margin: 50px auto 0 auto;height: auto;}	
  .Area_content .ly{width: 73%;overflow: hidden;}	
  .Area_content .ly ul {}	
  .Area_content .ly ul li h4{color:var(---light-gray-txt-color );font-size:calc(var(---font-size)*1.5);max-height: 9em;line-height: 1.8em;text-align: left;overflow-wrap: break-word;letter-spacing: 0.04em;}	

  }
  @media screen and (max-width:767px){
  .Area_content {margin: 4vw auto 0 auto;}	
  .Area_content .ly{width: 90%;overflow: hidden;}	
  .Area_content .ly ul {}	
  .Area_content .ly ul li h4{color:var(---light-gray-txt-color );font-size:calc(var(---font-size)*1);max-height: 9em;line-height: 1.8em;text-align: left;overflow-wrap: break-word;letter-spacing: 0.04em;}	
  }



/*--- 專案更新---*/
@media screen and (min-width:768px){
  .Area_new{margin: 40px auto 0 auto;height: auto;}	
  .Area_new .ly{width: 90%;overflow: hidden;}	
  /*底框*/
  .Area_new .ly {width: 73%;border-radius: var(---border-radius);border-color: var(---white-txt-color);border: 3px solid var(---middle-color);}	
  .Area_new .ly ul {width: 92%;padding: 40px 0 40px 0;}	
   /*文案*/
  .Area_new .ly ul li h3{color:var(---black-txt-color );font-size: calc(var(---font-size)*2);max-height: 2em;line-height: 1em;text-align: left;}	
  .Area_new .ly ul li h3 span{overflow-wrap: break-word;}	
  .Area_new .ly ul li h3 b{position: relative;top: -3px;left: 10px;color:var(---light-gray-txt-color );font-size: calc(var(---font-size)*1.2);max-height: 1em;line-height: 1em;text-align: left;}	
  .Area_new .ly ul li h4{color:var(---light-gray-txt-color );font-size: calc(var(---font-size)*1.5);max-height: 9em;line-height: 1.8em;text-align: left;overflow-wrap: break-word;letter-spacing: 0.04em;}	
  /*邊線*/
  .Area_new .time_border{width: 100%;margin: 20px auto;border-top: 2px solid var(---border-color);}
  .Area_new.border02{position: relative;top: 48vw;}

  }
  @media screen and (max-width:767px){
  .Area_new {margin: 4vw auto 0 auto;}	
  .Area_new .ly{width: 90%;overflow: hidden;}	
  /*底框*/
  .Area_new .ly {border-radius: var(---border-radius);border-color: var(---white-txt-color);border: 1.5px solid var(---middle-color);}	
  .Area_new .ly ul {width: 92%;padding: 5vw 0 3vw 0;}	
   /*文案*/
  .Area_new .ly ul li h3{color:var(---black-txt-color );font-size:calc(var(---font-size)*1.2);max-height: 2em;line-height: 1em;text-align: left;}	
  .Area_new .ly ul li h3 span{overflow-wrap: break-word;}	
  .Area_new .ly ul li h3 b{position: relative;top: -0.9vw;left: 2vw;color:var(---light-gray-txt-color );font-size:calc(var(---font-size)*0.8);max-height: 1em;line-height: 1em;text-align: left;}	
  .Area_new .ly ul li h4{color:var(---light-gray-txt-color );font-size:calc(var(---font-size)*1);max-height: 9em;line-height: 1.8em;text-align: left;overflow-wrap: break-word;letter-spacing: 0.04em;}	
  /*邊線*/
  .Area_new .time_border{width: 100%;margin: 2vw auto;border-top: 2px solid var(---border-color);}
  .Area_new.border02{position: relative;top: 48vw;}


}



/*---影片(橫式)---*/
@media screen and (min-width:768px){
  .Area_video02{margin: 50px auto 0 auto; height: auto;}	
  .Area_video02 .video {position: relative;top: 0;width: 888px;margin: 0 auto 50px auto;height: 385px;background:rgba(0,0,0,1);}
  .Area_video02 .video iframe.mo { width:100%; height:100%;}
  }
  @media screen and (max-width:767px){
  .Area_video02 {}	
  .Area_video02 .video {margin: 5vw auto 0 auto;position: relative;width: 91%;height:auto;background:rgba(0,0,0,1);}
  .Area_video02 .video iframe.mo {width:100%;height: 43vw;}
  }
  






/*--- 專推---*/
@media screen and (min-width:768px){
  .Area_product{margin: 40px auto 0 auto;height: auto;}	
  .Area_product .bn ul { grid-gap: 0 !important; }
  .Area_product .bn ul li{pointer-events: none;}	
  /*按鈕*/
  .Area_product .btn{position: relative;}
  .Area_product .btn a{padding: 15px 0;display: flex;justify-content: center;align-items: center;background-color: var(---main-color);width: 35%;margin: 20px auto 0 auto;border-radius: 50px;color: var(---white-txt-color);font-size: calc(var(---font-size)*1.5);font-weight: 600;letter-spacing: 0.05em;}
  .Area_product .triangle{position: relative;top: 0;left: 20px;width: 0;height: 0;border-bottom: 10px solid var(---white-txt-color);border-right: 10px solid  transparent;transform: rotate(-45deg);}

  }
  @media screen and (max-width:767px){
  .Area_product {margin: 13vw auto 0 auto;}	
  .Area_product .bn ul { grid-gap: 0 !important; }
  .Area_product .bn ul li{pointer-events: none;}	
  /*按鈕*/
  .Area_product .btn{position: relative;}
  .Area_product .btn a{display: flex;justify-content: center;align-items: center;color: var(---white-txt-color);font-size:calc(var(---font-size)*1);font-weight: 600;letter-spacing: 0.05em;padding: 2vw 0;background-color: var(---main-color);width: 50%;margin: 4vw auto 0 auto;border-radius: 10vw;}
  .Area_product .triangle{position: relative;top: 0;left: 2vw;width: 0;height: 0;border-bottom: 2vw solid var(---white-txt-color);border-right: 2vw solid  transparent;transform: rotate(-45deg);}
}




/*---購物---*/
@media screen and (min-width:768px){
  .Area_buy{margin: 60px auto 0 auto;height: auto;}	
  .Area_buy .PD_layout[data-pd-col-phone="1"] li:nth-child(1){border-top: 3px solid var(---middle-color);}
  .Area_buy .ly{width: 90%;}
  .Area_buy .ly ul{grid-gap: 70px;}
  .Area_buy .ly ul li {border: 3px solid var(---middle-color);border-radius:var(---border-radius);padding: 0 0 40px 0;}	
  .Area_buy .ly ul li .PD_img{pointer-events: none;padding: 0;}	
  /*邊線*/
  .Area_buy .time_border{width: 92%;margin: 20px auto;border-top: 3px solid var(---border-color);}
  /*按鈕*/
  .Area_buy .btn{position: relative;padding: 8px 0;display: flex;justify-content: center;align-items: center;background-color: var(---main-color);width: 35%;margin: 1vw auto 0 auto;border-radius:50px;}
  .Area_buy .btn p{color: var(---white-txt-color);font-size: calc(var(---font-size)*1.8);font-weight: 600;letter-spacing: 0.05em;}
  .Area_buy .triangle{position: relative;top: -4px;left: 12px;width: 0;height: 0;border-bottom: 15px solid var(---white-txt-color);border-right: 15px solid  transparent;transform: rotate(-45deg);}

  }
  @media screen and (max-width:767px){
  .Area_buy {margin: 13vw auto 0 auto;}	
  .Area_buy .PD_layout[data-pd-col-phone="1"] li:nth-child(1){border-top: 1.5px solid var(---middle-color);}
  .Area_buy .ly{width: 90%;}
  .Area_buy .ly ul{grid-gap: 6vw;}
  .Area_buy .ly ul li {border: 1.5px solid var(---middle-color);border-radius:var(---border-radius);padding: 0 0 3vw 0;}	
  .Area_buy .ly ul li .PD_img{pointer-events: none;padding: 0;}	
  /*邊線*/
  .Area_buy .time_border{width: 92%;margin: 2vw auto;border-top: 2px solid var(---border-color);}
  /*按鈕*/
  .Area_buy .btn{position: relative;padding: 1vw 0;display: flex;justify-content: center;align-items: center;background-color: var(---main-color);width: 50%;margin: 1vw auto 0 auto;border-radius: 10vw;}
  .Area_buy .btn p{color: var(---white-txt-color);font-size:calc(var(---font-size)*1);font-weight: 600;letter-spacing: 0.05em;}
  .Area_buy .triangle{position: relative;top: 0;left: 2vw;width: 0;height: 0;border-bottom: 2vw solid var(---white-txt-color);border-right: 2vw solid  transparent;transform: rotate(-45deg);}
}



/*---導連結---*/
@media screen and (min-width:768px){
  .Area_icon{margin: 0px auto 0 auto; height: auto;}	
  .Area_icon .btn{width: 50%;}	
  .Area_icon .btn ul{grid-gap: 80px;}	
  }
  @media screen and (max-width:767px){
  .Area_icon {margin: 8vw auto 0 auto;}	
  .Area_icon .btn{width: 60%;}	
  .Area_icon .btn ul{grid-gap:10vw;}	
}