a{ text-decoration: none}
section{ width: 100%; display: block; position: relative}
.center{ text-align: center}
.wrapbig{ width: 1400px; margin: 0 auto; background: #fff;}
.wrap{ width: 1200px; margin: 0 auto; position: relative}
.abs{ position: absolute}
.fll{ float: left;}
.flr{ float: right;}
.col-left{ float: left;}
.col-right{ float: right;}
.clear{ clear: both}
p{ line-height: 1.3em; font-size: 22px;}
.bold{ font-weight: bold;}
.block{ display: block}
.in-blk{ display: inline-block}
.no-show{ display: none}
.mgb-30{ margin-bottom: 30px;}
:root {
  --animate-delay: 0.5s;
}



body{ font-size: 18px; line-height: 36px; font-family: 'Noto Sans TC', sans-serif;}

nav{float: right; margin-top: 13px; margin-right: 30px; }
nav span{ display: block; font-size: 14px; color:#00a0ea;  margin-top: 5px; }
nav >div{display: inline-block;padding: 0 20px;}
nav >div a{font-size: 18px; border: 0; text-align: center;  color: #fff; transition: all 0.5s;position: relative}
nav a:hover{ transition: all 0.5s; color: #e86129}


.head{ width: 100%; padding: 0 5%; top: 0; padding-top: 10px; opacity: 1; transition: all 0.2s; display: block;z-index: 99; box-sizing: border-box; position: fixed;}
.head.fadein{ position: fixed; top: 0px; background: #3165b0}
.head.fadein nav{ margin-top: 0;}
.logo{ display: inline-block; margin-left: 30px; margin-top: 0px;}
.logo img{ max-width: 530px; width: 100%}
.container{ width: 1200px; margin: 0 auto; position: relative}
.title{ margin-bottom: 50px; text-align: center}
.title .h2{ font-size: 42px; color: #3267ab; line-height: 1.3em; font-weight: bold; position: relative; font-style:italic }
.title .h2.lightblue{  color: #57c3e0;}

.title-s2 .h2{ font-size: 42px; text-align: center;color: #ed7d4f; line-height: 1.3em; font-weight: bold; position: relative; font-style:italic; margin-bottom: 30px; }
.title-s2 .h2:after{ content: ''; width: 200px; height: 1px; background: #ed7d4f; margin: 0 auto; margin-top: 15px; display: block}
.title-s3 .h2{ font-size: 42px; text-align: center;color: #3365ae; line-height: 1.3em; font-weight: bold; position: relative; font-style:italic; margin-bottom: 30px; }
.title-s3 .h2:after{ content: ''; width: 200px; height: 1px; background: #3365ae; margin: 0 auto; margin-top: 15px; display: block}


/*****************Pages************************/

.kv-wrap{ background: url(../images/bg_kv.gif) center top no-repeat; background-size:cover;}
.kv1{animation: backg 2s forwards ease-in-out infinite alternate}
@keyframes backg {
      0% {
        background-size:45%;
      }
      100% {
        background-size: 47%;
      }
     
   } 

.flyout{ position: absolute; right: 10%; top: 10%}
.kv-wrap .container{ width: 830px; min-height: 650px; padding-bottom: 20px;padding-top:120px; position: relative}
.slogan{ text-align: center;position: relative; z-index: 2}
.slogan img{ margin-bottom: 30px}


.s2{ min-height: 700px; padding-bottom: 30px; background: url(../images/bg_s1.jpg) center top; background-size:cover;  padding-top: 90px;}
.s2 .container{ width: 1000px;}
.s2 .orangecir{ text-align: center}
.s2 .orangecir span{ display: block;font-size: 22px;}

/* 修改後：電腦版藍色區塊標籤改為一行一個 */
.s2 .bluecir span {
  display: block;    /* 關鍵：強制換行 */
  width: 100%;       /* 佔滿寬度 */
  text-align: center;
  font-size: 22px;
}

.s2 .rows{ display: flex; flex-direction: column; justify-content:center;align-items: flex-start}
.s2 .aitxt{ padding-left: 50px; }
.s2 .aitxt p{line-height: 1.7em; text-align: center}
.s2 .imglt{ width: 500px;}
.s2 .infoimg{ display: flex; padding: 30px;}
.s2 .infoimg >div{padding: 30px;}



.spksec{min-height: 1040px; padding-bottom: 80px; background: url(../images/bg_s2.jpg) center top; background-size:cover;  padding-top: 90px;}
.spks{ display: flex; flex-direction: row;flex-wrap: wrap;justify-content:space-around}
.spks .item{ width: 260px; text-align: center; margin-bottom: 50px; cursor: pointer; transition: all 0.5s}
.spks .item:hover{ opacity: 0.7; transition: all 0.5s}
.spks .item img{ margin-bottom: 10px; display: inline-block}
.spks .item .tit{ color: #1553aa; font-size: 22px; font-weight: bold; margin-bottom: 5px;}
.spks .item p{ color: #000; font-size: 20px;}
.spks .item a{ margin-top: 10px; display: inline-block}
.spkwrap{ width: 1200px; background: #fff; border-radius: 30px; margin-top: 120px; padding:50px 50px; padding-top: 80px; position: relative; box-sizing: border-box}
.tabs{ width: 100%; position: absolute; top: -90px; text-align: center; left: 0; display: flex; justify-content: center; display: none}
.tabs a{ display: inline-block; width: 400px; height: 145px;}
.tabs a img{ display: none;}
.spkwrap .tabs{ display: flex;}
.showarea-1{ background: url(../images/en_agenda_menu_01.png) no-repeat; background-size: contain}
.showarea-1.active,.showarea-1:hover{ background: url(../images/en_agenda_menu_01-h.png) no-repeat; background-size: contain}
.showarea-2{ background: url(../images/en_agenda_menu_02.png) no-repeat; background-size: contain}
.showarea-2.acitve,.showarea-2:hover{ background: url(../images/en_agenda_menu_02-h.png) no-repeat; background-size: contain}

.spkwrap .intro{ font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 40px;}


.agendatitle { text-align: center; margin-bottom: 30px; display: flex; justify-content: center}
.agendatitle img{ max-width: 100%; width: 800px; }
.area-1,.area-2{ opacity: 0; height: 0px; overflow: hidden; padding: 0}
.area-1.active,.area-2.active{ opacity: 1; height: auto; }



.tb-wrap table{ text-align: left; width: 100%}
.tb-wrap table th{ background: #59c1dc; color: #fff; padding:10px 5px; text-align: center; font-size: 22px;}
.tb-wrap table th.bg2{ background: #b19041; color: #fff; }
.tb-wrap td:nth-child(1){ width: 15%}
.tb-wrap td:nth-child(2){ width: 42%}
.tb-wrap td:nth-child(3){ width: 42%}
.tb-wrap table td{ font-size: 19px; padding: 15px; line-height: 1.6em; vertical-align: middle;}
.tb-wrap table td b{ color: #3165b0; font-weight: bold;}
.tb-wrap table td .center{  text-align: center}
.tb-wrap table td .blk{ display: inline-block; margin-bottom: 10px;}
.tb-wrap table tr{border-bottom: 1px solid #ddd}
.tb-wrap table tr td:first-child{ text-align: center; font-weight: 600;}
.tb-wrap table .bgb{ background: #def3f8}
.tb-wrap table td em{ background: #3165b0; padding:2px 5px; color: #fff;}
.note{ width: 700px; margin: 0 auto; margin-top: 30px;}
.note span{ display: block; font-size: 14px; line-height: 1.5em}


#Location{ margin-top: 50px;}
#Location.title{ margin-bottom: 20px;}
.tkwrap{ width: 100%; margin-bottom: 80px; margin-top: 20px; padding: 20px 50px; box-sizing: border-box}
.tkwrap .h3{ color: #6A30FF; font-size: 22px; font-weight: bold;}
.tkwrap li{ font-size: 18px; }
.tkwrap li::before{content: "●"; color: #6A30FF; font-size: 14px; margin-right: 10px;}
.tkwrap li small{ width: 100%; padding-left: 10px; font-size: 14px; display: inline-block; position: relative; top:-5px;}
.mapwrap{ width: 100%; margin: 0 auto; margin-bottom: 50px; border-radius: 30px; box-sizing: border-box; display: flex; flex-direction: row}
.mapwrap .lft{ width: 470px;}
.mapwrap .rig{ width: 50%; color: #fff; padding-left: 50px;}
.tkwrap .sec{ font-size: 16px; padding: 10px 0;  line-height: 28px;}
.tkwrap .sec .pd{ padding: 0 50px;}
.tkwrap .sec b{ font-weight: bold; color: #00FFFF; width: 100%; display: inline-block}
.tkwrap .ti { position: relative; font-size: 24px; color: #707070}
.tkwrap .ti i{ position: absolute; left: -40px; top: 0px;}
.tkwrap .sec em{ color: #2953E3; margin-right: 10px;}
.tkwrap .box3{ display: flex;justify-content:space-between}
.tkwrap .box3 img{ max-width: 100%;}

.maptitle{ max-width: 100%}

.ftlogo{ text-align: center; margin-top: 80px;}









.popbox { width: 700px; max-width: 800px !important; font-size: 16px;}
.popbox .top{display: flex; padding-bottom: 20px;}
.popbox .hd{ width: 250px; }
.popbox .inf { display: flex; justify-content: center ;flex-direction: column; align-items: flex-start; margin-left: 30px; font-size: 34px;}
.popbox .inf{ color: #000}
.popbox .tit{ font-size: 16px; color: #0056BF}
.popbox .inf .h4{ font-weight: bold; font-size: 34px; margin-bottom: 20px; color: #000 }
.popbox .inf p{font-size: 20px; line-height:36px;}
.popbox .cont{font-size: 16px; line-height: 26px; margin-top: 0px; padding: 20px 0px;}
.popbox .cont p{ font-size:20px; line-height: 32px;}
.popbox .blue{ color: #0056BF; margin-bottom: 10px; margin-top: 10px;}


.slick-prev,.slick-prev:hover{ left: 0px; background: url(../images/arrow-l.svg) no-repeat; z-index: 9}
.slick-next,.slick-next:hover{ right: 0px; background: url(../images/arrow-r.svg) no-repeat; z-index: 9}
.slick-prev:before, .slick-next:before{ font-size: 20px; display: none;}
.slick-next:before{ color:#000 }
.slick-prev:before{ color:#000 }

footer{ }

.fixbtn{ position: fixed; right:4%; bottom: 20%; width: 150px; height: 150px; padding: 35px; box-sizing: border-box; text-align: center; }
.fixbtn .bckg{ width: 150px; height: 150px; padding: 35px; box-sizing: border-box; background: url(../images/btn_fix_bg.png) no-repeat;  background-size: 100%; display: inline-block}

.fixbtn.fadein{ opacity: 1; transition: all 0.5s}
.fixbtn span{  color: #000; font-size: 22px; font-weight: bold; position: absolute; top: 68px; left: 69px;z-index: 1}
.fixbtn:hover{ opacity: 0.8}
.slid{ padding: 30px; background: #fff7eb}

.pc{ display: block}
.mb{ display: none;}
.box{ display: none;}

.fancybox-content{ padding: 25px!important}

.mbbtnfix{ display: none;}

/* 要移動的物件樣式 */
  .moving-object {
    
    /* 核心動畫設定 */
    opacity: 0; /* 初始狀態設為隱藏 */
    animation: moveFadeLoop 4s infinite ease-in-out;
  }

  /* 定義動畫關鍵影格 */
  @keyframes moveFadeLoop {
    /* 階段 1: 初始狀態 (隱藏 + 起始位置) */
    0% {
      opacity: 0;
        right: 25%; top: 25%
    }

    /* 階段 2: 移動結束並淡入 (假設花 1 秒 = 25%) */
    60% {
      opacity: 1;
        right: 10%; top: 10%;
    }

    /* 階段 3: 停留 (保持狀態) (停留 2 秒 = 從 25% 到 75%) */
    80% {
      opacity: 1;
      right: 10%; top: 10%;
    }

    /* 階段 4: 淡出 (最後 1 秒 = 到 100%) */
    100% {
      opacity: 0;
      right: 10%; top: 10%;
    }
  }


.fade-loop {
  opacity: 0;
  animation: fadeInOut 3s ease-in-out infinite;
}

@keyframes fadeInOut {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.two-txt{ width: 100%; display: flex; margin-top: 20px;}
.two-txt >div{ width: 50%;}
.two-txt >div span{ line-height: 1.3em}
.two-txt >div:first-child span{ width: 100%; text-align: center; display: block}
.two-txt >div:last-child{ display: flex;flex-wrap:wrap; flex-direction: row}

/* 修改後：手機版也改為一行一個 */
.two-txt >div:last-child {
  display: block;    /* 取消 flex 佈局 */
}

.two-txt >div:last-child span {
  width: 100%;       /* 佔滿寬度，強制一個一行 */
  text-align: center;
  display: block;    /* 確保換行 */
  font-size: 19px;   /* 可依需求微調字級 */
}

@media only screen and (max-width: 1600px) {
    .head {
        display: flex;             /* 使用 flex 佈局 */
        justify-content: space-between;
        align-items: center;
        flex-wrap: nowrap;         /* 強制不換行 */
    }

    .logo {
        flex-shrink: 1;            /* 允許 Logo 縮小 */
        margin-left: 10px;
    }

    .logo img {
        width: 320px;              /* 在 1600px 以下進一步縮小 Logo */
        max-width: 100%;
    }

    nav {
        display: flex;
        flex-shrink: 0;            /* 選單文字儘量不縮小，保持易讀 */
        margin-right: 10px;
    }

    nav > div {
        padding: 0 8px;            /* 緊縮項目間距，爭取空間 */
    }

    nav > div a {
        font-size: 16px;           /* 稍微縮小字體防止擠壓 */
    }
}

@media only screen and (max-width: 1200px) {
    .container{ width: 100%; padding: 0 20px; box-sizing: border-box }
    .kv-wrap .container{ width: 100%; padding-top: 160px; min-height: 800px }
    .agenda{ min-height: inherit}
    .tickets a img{ max-width: 100%}
    .tkwrap{ width: 100%; margin: 0 auto; margin-top: 30px; margin-bottom: 80px;}
    .spkwrap{ width: 100%;}
}
@media only screen and (max-width: 1200px) {

/* 確保手機版圖片容器與圖片本身不會溢出螢幕 */
.infoimg-mb {
    width: 100%;           /* 容器寬度設為 100% */
    padding: 0 15px;       /* 增加一點左右邊距，避免貼邊 */
    box-sizing: border-box;
    overflow: hidden;      /* 隱藏溢出內容 */
}

.infoimg-mb img {
    max-width: 100%;       /* 限制圖片最大寬度為父容器的 100% */
    height: auto;          /* 保持原圖比例縮放，不變形 */
    display: block;
    margin: 0 auto;        /* 居中顯示 */
}

    .mb{ display: block;}
    .mb img{ width: 100%; display: flex;}
    .pc{ display: none !important}
    .wrap{ width: 100% !important}
    .box{ display: block}
    .head {padding-top: 0;z-index: 99; background:#3165b0; height: 50px; position: inherit}
    .head.fadein{ padding-bottom: 0;}
    .logo img{ width: 280px;margin-top: 15px;}
    .logo{ margin-top: 0px; width: inherit; max-width: 70%;margin-left: 0; margin-bottom: 0;}
    
    nav{ display: none; width: 100%;z-index: 999; position: fixed; background: #3165b0; left: 0; margin-top: 0;}
    nav >div,.en nav >div{ width: 100%; border-bottom: 1px solid #ddd;padding: 15px 0; border-right: 0; color: #3165b0; text-align: center}
    nav >div a{border-right: 0; color: #fff}
    nav a:hover span{ border: 0; padding: 0}
    nav a.active:after{ display: none;}
    
    .fixbtn{ display: none;}
    
    
    .mbkv{ display: flex; flex-direction: column; background: #651b7c}
    .mbkv .info{ background: #651b7c; padding: 30px 30px; padding-bottom: 50px; color: #fff;}
    
    .infoimg-mb{ margin-top: 30px;}
        
    .popbox .lft{ float: right; width: 100%}
    .popbox .rig{ float: left; width: 100%}
    .popbox .hd{ width: 50%; display: inline-block}
    .popbox .hd img{ width: 100%}
    .popbox .inf{ width: 48%; display: inline-block; vertical-align: top; padding-top: 16%;}
    
    p{line-height: 1.3em; font-size: 19px;}
    .title .h2{ font-size: 30px;}
    .s2{ min-height:inherit}
    .s2 .rows{ flex-direction: column}
    .s2 .container{ width: 100%;}
    .s2 .infoimg,.s2 .infoimg img{ width: 100%;}
    .s2 .aitxt{ padding-left: 0;}
    .s2 .imglt{ width: 100%; text-align: center}
    .s2 .slider{ margin: 0 auto; margin-top: 30px;}
    .tickets a img{ padding: 0 10px; box-sizing: border-box}
    .mapwrap{ flex-direction: column}
    .mapwrap .lft,.mapwrap .lft{ width: 100%;}
    .mapwrap .lft iframe{ width: 100%; height: 300px; margin-bottom: 30px;}
    .mapwrap .rig{ padding-left: 0; width: 100%;}
    
    .agendamb{ background: rgba(225,225,225,0.6); padding: 10px 0}
    
    .spkwrap{ padding-left: 20px; padding-right: 20px; padding-top: 20px; margin-top: 0; border-radius: 0; background: #000}
    .area-1.active,.area-2.active{ border-radius: 20px; background: #fff; padding: 30px; }
    .spkwrap .tabs{ display: none;}
    .tabs{ width: 100%; display:flex; position: inherit; top: inherit}
    .tabs a{ height: auto; width: auto; display: flex}
    .tabs a img{ display: inline-block}
    .tabs img{ width: 100%;}
    .showarea-1,.showarea-2{ background: none !important}
    .spkwrap.orange{ background: #ed7c4f}
    .spkwrap.blue{ background: #3265af}
    .tkwrap{ margin-bottom: 20px;}
    
}
/*tablet*/
@media only screen and (max-width: 800px) {
    .logo{ margin-left: 15px;}
    .popbox{ width: 100%;}
    .popbox .inf{ padding-top: 2%;}
    .ticket{ background-size: auto}
    .spksec{ background-size: auto; min-height: auto; padding-top: 50px; padding-bottom: 50px;}
    .spksec .container{ padding: 0}
    .ftlogo{ padding-bottom: 50px; margin-bottom: 10px; margin-top: 30px;}
    .ftlogo img{ max-width: 90%; padding: 0 10px; box-sizing: border-box}
    
    .title-s2 .h2,.title-s1 .h2{ font-size: 30px;}
    .title{ margin-bottom: 30px;}
    .tb-wrap table td{ width: 100% !important; display: inline-block; box-sizing: border-box; text-align: left; padding:5px 10px;}
    .tb-wrap table tr td:first-child{ text-align: left}
    .tb-wrap table th{ display: none;}
    .note{ width: 100%;}
    
    .spkwrap .intro{ font-size: 22px;}
    .title-s2 .h2, .title-s1 .h2{ font-size: 24px;}
    .title-s3 .h2{ font-size: 24px;}
    .tb-wrap table .bgb{ background: #fff}
    .tb-wrap table tr:nth-child(even){ background: #def3f8}
    
   
}


@media only screen and (max-width: 500px) {
   
   
    .popbox .cont{ padding: 20px 0; }
    .popbox .inf .h4{ font-size: 30px;}
    .popbox .cont p{ font-size: 16px;}
    .spks .item .name{ font-size: 32px;}
    
    .tickets{ flex-direction: column}
    .tickets >div{ text-align: center}
    .s2{ padding-bottom: 50px; padding-top: 70px;}
    .s2 .slider{ width: 320px;}
    .s2 .imglt img{ max-width: 100%}
    
    .title .h2:after{ width: 250px;}
    .popbox .inf p{ font-size: 18px;}
    .popbox .top{ flex-direction: column}
    .popbox .inf{ width: 100%; padding-left: 0; margin-left: 0;}
    
    .spks .item .tit{ font-size: 24px;}
    .spks .item p{ font-size: 18px;}
    .tkwrap{ padding: 20px;}
    .spks .item img{ width: 55%;}
    
  .mbbtnfix{ display: block; position: fixed; bottom: -11px}
}


/*updown*/

@keyframes updown {
	0% {
		-webkit-transform: translateY(-2%);
		-moz-transform: translateY(-2%);
		-ms-transform: translateY(-2%);
		-o-transform: translateY(-2%);
		transform: translateY(-2%);
	}
	100% {
		-webkit-transform: translateY(0%);
		-moz-transform: translateY(0%);
		-ms-transform: translateY(0%);
		-o-transform: translateY(0%);
		transform: translateY(0%);
	}
}

.updown{
	-webkit-animation: updown 700ms forwards ease-in-out infinite alternate;
	-moz-animation: updown 700ms forwards ease-in-out infinite alternate;
	-ms-animation: updown 700ms forwards ease-in-out infinite alternate;
	-o-animation: updown 700ms forwards ease-in-out infinite alternate;
	animation: updown 700ms forwards ease-in-out infinite alternate;
}




.box {
  position: absolute;
  top: 0px;
  right:0px;
/*  transform: translate(-50%, -50%);*/
  width:50px;
  height: 50px;
  background: none;
/*  box-shadow: 1px 2px 10px 0px rgba(0,0,0,0.3);*/
}

.btn {
  position: absolute;
  top: 25px;
  right: -13px;
  transform: translate(-50%, -50%);
  width: 43px;
  cursor: pointer;
}
.btn.active{ top: 32px; right: -12px;}
.box .active span:nth-child(2){ margin-top: 20px;}
.box span {
  display: block;
  width: 100%;
/*  box-shadow: 0 2px 10px 0 rgba(0,0,0,0.3);*/
/*  border-radius: 3px;*/
  height: 2px;
  background: #fff;
  transition: all .3s;
  position: relative;
}

.box span + span {
  margin-top: 6px;
}

.box .active span:nth-child(1) {
  animation: ease .7s top forwards;
}

.box .not-active span:nth-child(1) {
  animation: ease .7s top-2 forwards;
}

.box .active span:nth-child(2) {
  animation: ease .7s scaled forwards;
}

.box .not-active span:nth-child(2) {
  animation: ease .7s scaled-2 forwards;
}

.box .active span:nth-child(3) {
  animation: ease .7s bottom forwards;
}

.box .not-active span:nth-child(3) {
  animation: ease .7s bottom-2 forwards;
}

@keyframes top {
  0% {
    top: 0;
    transform: rotate(0);
  }
  50% {
    top: 22px;
    transform: rotate(0);
  }
  100% {
    top: 10px;
    transform: rotate(45deg);
  }
}

@keyframes top-2 {
  0% {
    top: 22px;
    transform: rotate(45deg);
  }
  50% {
    top: 22px;
    transform: rotate(0deg);
  }
  100% {
    top: 0;
    transform: rotate(0deg);
  }
}

@keyframes bottom {
  0% {
    bottom: 0;
    transform: rotate(0);
  }
  50% {
    bottom: 22px;
    transform: rotate(0);
  }
  100% {
    bottom: 22px;
    transform: rotate(135deg);
  }
}

@keyframes bottom-2 {
  0% {
    bottom: 22px;
    transform: rotate(135deg);
  }
  50% {
    bottom: 22px;
    transform: rotate(0);
  }
  100% {
    bottom: 0;
    transform: rotate(0);
  }
}

@keyframes scaled {
  50% {
    transform: scale(0);
  }
  100% {
    transform: scale(0);
  }
}

@keyframes scaled-2 {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes barjump {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    top: -10px;
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
    top: 150px;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    top: 250px;
  }
}



.mous{ position: absolute; display: inline-block; bottom: 50px; left: 280px;}
.mous em{ display: block; position: absolute; background: none; top: -30px; left: -22px; color: #01ffff;}
.mous span{ display: block;}
.mous span:after {
  content: "";
  position: absolute;
    z-index: 9999;
}

.mous > span:before {
  background-color: #fff;
  width: 1px;
  height: 30px;
  top: 50%;
  right: 0;
    z-index: 999;
  transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
}

.mous > span:after {
  background-color: #01ffff;
  width: 1px;
  height: 80px;
  top: 50%;
  right: -8px;
    z-index: 999;
  transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  animation-name: mouse;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
@keyframes mouse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    top: -10px;
    opacity: 0;
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
    top: 40px;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    top: 70px;
    opacity: .3;
  }
}



.marquee{ animation: marquee 200s linear infinite forwards;}
@media only screen and (max-width: 500px) {
     .marquee{ animation: marquee 400s linear infinite forwards;}
}

@-webkit-keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
.marquee2{ animation: marquee2 200s linear infinite forwards;}

@media only screen and (max-width: 500px) {
     .marquee2{ animation: marquee2 400s linear infinite forwards;}
}

@-webkit-keyframes marquee2 {
  0% {
    transform: translateX(-90%);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes marquee2 {
  0% {
    transform: translateX(-90%);
  }
  100% {
    transform: translateX(0);
  }
}

.biggerbtn{
    animation: biggerbtn 500ms forwards ease-in-out infinite alternate;
}

@keyframes biggerbtn {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  
  }
}


.rotate-div {  animation: rotate 5s linear infinite;transform-origin: center;}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


/* 移除 Slick Slide 及其內部連結點擊後的藍色框 */
.slick-slide,
.slick-slide:focus,
.slick-slide a,
.slick-slide a:focus,
.slick-slide img:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* 同時移除 Slick 左右箭頭點擊後的框線 */
.slick-prev:focus,
.slick-next:focus {
    outline: none !important;
}

/* 1. 上午場議程：當在 orange 區塊且屬於 area-1 時，套用橘色 */
.spkwrap.orange .area-1 .tb-wrap table td em {
    background: #ed7d4f !important;
}
.spkwrap.orange .area-1 .tb-wrap table td b {
    color: #ed7d4f !important;
}

/* 2. 下午場議程：明確指定 area-2 恢復為藍色，並加上 !important 確保不被覆蓋 */
.spkwrap .area-2 .tb-wrap table td em {
    background: #3165b0 !important;
}
.spkwrap .area-2 .tb-wrap table td b {
    color: #3165b0 !important;
}