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


/*版頭*/
/* .Area_momologo .superlogo { z-index: 10; position: absolute; top: 0px; left: 88px;}
.Area_momologo .superlogo a { display: block; width: 210px; height:75px; background: url(momo_logo_super.png?t=1788505481745) no-repeat; background-size: 100%;} */

@media screen and (max-width:767px){
	.Area_momologo .superlogo { z-index: 10; top: 2vw; left: 2vw;}
	.Area_momologo .superlogo a {background-size:100%;width: 30vw;height: 12vw;}
}



/* 白字黑底 */
:where(.Area_Timecountdown-white) { color: #fff;}
:where(.Area_Timecountdown-white .FontStyle-number) { color: #fff; background-color: rgba(0, 0, 0, 0);}


@media screen and (max-width: 767px) {
  .Area_Timecountdown {font-size: 3vw;transform: rotate(-5deg);top: -40vw;left: 4vw;position: absolute;gap: 0.1em;}
  .Area_Timecountdown .FontStyle {gap: 0.1em;}
  .Area_Timecountdown .FontStyle-number {padding: 0.1em 0.1em;}
}
@media screen and (min-width: 768px) {
  .Area_Timecountdown {font-size: 1.3em;transform: rotate(-5deg);top: -380px;left: 90px;position: absolute}

  
}

.date-led{
  animation:
    dateBoard 2.5s infinite,
    dateSignal 5s infinite,
    ledFlash 5s infinite;
}

@keyframes dateSignal{

  0%,92%,100%{
      transform:none;
      opacity:1;
  }

  93%{
      transform:translateX(-2px);
      opacity:.9;
  }

  94%{
      transform:translateX(2px);
  }

  95%{
      transform:translateX(-1px);
  }

  96%{
      transform:none;
      opacity:1;
  }

}

@keyframes ledFlash{

  0%,25%,100%{
      opacity:1;
  }

  10%{
      opacity:.6;
  }

  15%{
      opacity:1;
  }

  20%{
      opacity:.8;
  }

}

.title-glitch{
  animation:
      titleEnter .5s ease-out,
      titleFloat 3s ease-in-out .5s infinite,
      titleBlink 6s infinite,
      titleSignal 6s infinite;
      
  animation-delay:
      0s,
      .5s,
      1.5s,
      1.5s;
}
@keyframes titleBlink{

  0%,20%,100%{
      filter:brightness(1);
  }

  5%{
      filter:brightness(1.4);
  }

  8%{
      filter:brightness(.8);
  }

  10%{
      filter:brightness(1.5);
  }

  12%{
      filter:brightness(1);
  }

}
@keyframes titleSignal{

  0%,90%,100%{
      transform:translateX(0);
  }

  91%{
      transform:translateX(-2px);
  }

  92%{
      transform:translateX(2px);
  }

  93%{
      transform:translateX(-1px);
  }

  94%{
      transform:translateX(1px);
  }

  95%{
      transform:translateX(0);
  }

}

.light-burst{
  position:absolute;
  left:50%;
  top:55%;

  width:600px;
  height:600px;

  transform:translate(-50%,-50%);

  pointer-events:none;
}

.light-burst::before{

  content:'';

  position:absolute;
  inset:0;

  border-radius:50%;

  background:
  radial-gradient(
      circle,
      rgba(255,255,255,.8) 0%,
      rgba(255,0,0,.4) 20%,
      rgba(255,0,0,0) 70%
  );

  animation:
    burstLight 3s ease-out infinite;
}





/*閃光1*/                                
.brightness1-play { -webkit-animation:brightness1-play 4s infinite ; animation:brightness1-play 2.5s infinite ;}
        @keyframes brightness1-play {
          0% { filter:brightness(100%);  }
          92% { filter:brightness(100%);  }
          94% { filter:brightness(200%);  }
          96% { filter:brightness(100%);  }
          98% { filter:brightness(200%);  }
          100% { filter:brightness(100%);  }
        }

.minbright2-play { -webkit-animation:minbright2-play 3s linear infinite alternate; animation:minbright2-play 3s linear infinite alternate ;}
	@-webkit-keyframes minbright2-play {
	  0% { 
		filter:brightness(80%) hue-rotate(0deg);
	  }
	  100% { 
		filter:brightness(150%) hue-rotate(360deg);
	  }
	}
	@keyframes minbright2-play {
	  0% {
		filter:brightness(80%) hue-rotate(0deg);
		}
	  100% {
		filter:brightness(150%) hue-rotate(360deg);
		}
	}
	
.minbright-play-title { -webkit-animation:minbright-play-title 1s linear infinite alternate; animation:minbright-play-title 1s linear infinite alternate ;}
	@-webkit-keyframes minbright-play-title {
	  0% { 
		filter:brightness(90%);
	  }
	  100% { 
		filter:brightness(190%);
	  }
	}
	@keyframes minbright-play-title {
	  0% { 
		filter:brightness(90%);
	  }
	  100% { 
		filter:brightness(190%);
	  }
	}



  .kvReveal{
    opacity: 0;
    clip-path: circle(0% at 50% 50%);

    animation: revealCenter 1.2s ease-out forwards;
}

@keyframes revealCenter{
    0%{
        opacity: 0;
        clip-path: circle(0% at 50% 50%);
    }

    100%{
        opacity: 1;
        clip-path: circle(150% at 50% 50%);
    }
}




/* --------------------------------------
* (01)區標/帶背景區標公版
* -------------------------------------- */
.PD_layout.PD_layout-D3_01 ul {background-color:unset;padding: 0;}
.PD_layout.PD_layout-D3_01 ul li{ border: unset; }
.PD_layout.PD_layout-D3_01 .PD img{ width: 100%;}
.PD_layout.PD_layout-D3_01 .PD .PD_img{ position: relative; }

.PD_layout.PD_layout-D3_01 .PD h3{
  display: block;
  position: absolute;
  top: 55%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  font-style: italic;
  letter-spacing: -2px;
  color: #000000;
  font-weight: 700;
  font-family: "Noto Sans TC";
  font-size: 50px;
  line-height: 50px;
}
.PD_layout.PD_layout-D3_01 .PD h3 span {width: 105%;}



@media screen and (max-width: 767px){
  .PD_layout.PD_layout-D3_01 ul {background-color:unset;padding: 0 2vw;}
  .PD_layout.PD_layout-D3_01 .PD h3{
    display: block;
    position: absolute;
    top: 58%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    font-style: italic;
    letter-spacing: -2px;
    color: #000000;
    font-weight: 700;
    font-family: "Noto Sans TC";font-size: 26px;line-height: 26px;
  }
  .PD_layout.PD_layout-D3_01 .PD h3 span {width: 105%;}

}