@charset "utf-8";
/* CSS Document */


/*背景*/
@media screen and (min-width:768px){
  .bg_01 { z-index:-46; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position: center top; pointer-events:none;}
  }
  @media screen and (max-width:767px){
  .m_bg { z-index: 0; position: absolute; top: 10.5vw; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center top; pointer-events:none; background-size: 100%;}
  }





/*版頭*/
.Area_top {position: relative;height: 900px;}
.Area_top .main ul {padding: 0; grid-gap: 0;}
.Area_top .main ul li { pointer-events: none;}
.Area_top .main01 {position:absolute;left: 280px;top: 100px;z-index: 2;animation: mask_lefttoright 8.5s 0.2s ease-in-out forwards;opacity:0;}
.Area_top .main02 {position:absolute;left: 170px;top: 300px;z-index: 1;}
.Area_top .top_deco01 {position:absolute;top: 231px;left: 290px;z-index: 9;animation: fadeInDown 1.5s 0.2s ease-in-out forwards;}
.Area_top .top_deco02 {position:absolute;top: 660px;left: 160px;z-index: 9;animation: fadeInDown 1.5s 0.2s ease-in-out forwards;}
/*日期*/	
.Area_top .TIMER_DAY {position:absolute;top: 705px;left: 144px;width: 192px;z-index: 180;display:block;\: 97px;font-family:"din-condensed", sans-serif;font-weight: 900;font-style: normal;color: #f7edca;letter-spacing: 2px;text-align:center;}
.Area_top .TIMER_DAY small {font-size: 1.5rem;margin-left: -3px;margin-right: 0px;}
.Area_top .TIMER_DAY #sendMonth {width: 28px;text-align: center;font-size: 3.5rem;}
.Area_top .TIMER_DAY #sendToday {font-size: 3.5rem;}

@media screen and (max-width:767px){
  .Area_top {height: 95vw;}
  .Area_top .main01 {left: 17vw;top: 11.5vw;width: 68%;animation: mask_lefttoright 8.5s 0.2s ease-in-out forwards;opacity:0;}
  .Area_top .main02 {left: 3.5vw;top: 29vw;width: 93%;}
  .Area_top .top_deco01 {position: absolute;top: 24vw;left: 16vw;width: 67%;z-index: 0;}
  .Area_top .top_deco02 {position: absolute;top: 70vw;left: 3.5vw;width: 16.5%;z-index: 0;}

  /*日期*/	
.Area_top .TIMER_DAY {position:absolute;top: 74.5vw;left: 0.8vw;width: 21%;z-index:62;display:block;color: #e7ddbc;letter-spacing: 1px;font-family:"din-condensed", sans-serif;font-weight: 900;font-style: normal;text-align:center;}
.Area_top .TIMER_DAY small {font-size: 11px;}
.Area_top .TIMER_DAY #sendMonth {/* width: 26px; */display: inline-block;font-size: 1.5rem;}
.Area_top .TIMER_DAY #sendToday {width: 35px;font-size: 1.5rem;}
}



/*副標*/
.sub .PD_layout ul {display: flex;padding: 0;}
@media screen and (min-width: 768px){
.sub {position: absolute;top: 780px;left: 110px;width: 82%;height: 155px;z-index: 30;overflow: hidden;}	
.sub .PD_layout .PD img {width: 80%;}	
}
@media screen and (max-width:767px){
.sub {position: absolute;top: 82.6vw;left: 7vw;width: 85%;z-index: 30;overflow: hidden;}
.sub .PD_layout .PD img {width: 100%;padding: 0;}
}



@media screen and (min-width: 768px){
  .PD_layout-CSSBG_01.PD_layout[data-pd-h3="5"] .PD h3 span {display: inline-block;padding: 0 .5em;max-width: 85%;border-radius: 4px;color: #000;background-color: rgb(218 218 218 / 0%);}
  .PD_layout-CSSBG_01 .PD .PD_img {padding-top: 40px;padding-bottom: 30px;}
  .PD_layout-CSSBG_01.PD_layout .PD p {height: 6em;line-height: 3em;color: #d62672;}
}
@media screen and (max-width:767px){
  .PD_layout-CSSBG_01.PD_layout[data-pd-h3="5"] .PD h3 span { display: inline-block;padding: 0 .5em; max-width: 85%;border-radius: 4px;color: #000;background-color: rgb(218 218 218 / 0%);}
  }


.layout_PD01 {width: 96%;}
@media screen and (max-width:767px){
  .layout_PD01 {width: 100%;}
}