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

ul.effect-agp-location-tab { clear: both; width: 100%; padding: 0; margin: 30px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
ul.effect-agp-location-tab li { padding: 0; margin: 0 5px 10px 5px;}
ul.effect-agp-location-tab li a { padding: 5px 10px; color: #414141; font-size: 0.9rem; line-height: 1.2em; text-decoration: none; border-radius: 16px; border: 1px #ccc solid; background-color: #fff; display: block;}
ul.effect-agp-location-tab li a:hover { color: #fff; background-color: #595757;}
ul.effect-agp-location-tab li a.sel { color: #fff; background-color: #595757;}

.effect-agp-year-con div { display: none;}

.page-effect-agp-title { width: 100%; padding: 30px 0; color: #90291f; font-size: 1.6rem; font-weight: 600; line-height: 1.2em; text-align: center;}


@media screen and (min-width: 1200px) {

  /******** hp tw_map ********/

  .tw-map-dire { width: 100%; height: auto; text-align: center;}
  .tw-map-dire img { width: 40vw; height: auto;}

  #tw-map { clear: both; width: 40vw; margin: 0 auto; position: relative;}
  #tw-map img.tw-map { width: 100%; height: auto;}
  #tw-map .tw-kee { width: 3.5vw; position: absolute; top: 2.4vw; right: 2vw; z-index: 2;}
  #tw-map .tw-kee a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tpe { width: 5vw; position: absolute; top: 3.5vw; right: 5vw; z-index: 2;}
  #tw-map .tw-tpe a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-nwt { width: 5vw; position: absolute; top: 6vw; right: 5.5vw; z-index: 2;}
  #tw-map .tw-nwt a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-tyc { width: 3.5vw; position: absolute; top: 4.3vw; right: 11.5vw; z-index: 2;}
  #tw-map .tw-tyc a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hsz { width: 5vw; position: absolute; top: 8.5vw; right: 12.5vw; z-index: 2;}
  #tw-map .tw-hsz a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ilc { width: 3.5vw; position: absolute; top: 10.3vw; right: 3.5vw; z-index: 2;}
  #tw-map .tw-ilc a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mia { width: 3.5vw; position: absolute; top: 12vw; right: 16vw; z-index: 2;}
  #tw-map .tw-mia a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-txg { width: 3.5vw; position: absolute; top: 16vw; right: 19vw; z-index: 2;}
  #tw-map .tw-txg a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-cha { width: 3.5vw; position: absolute; top: 20vw; right: 23vw; z-index: 2;}
  #tw-map .tw-cha a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-nan { width: 3.5vw; position: absolute; top: 21vw; right: 14.5vw; z-index: 2;}
  #tw-map .tw-nan a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hua { width: 3.5vw; position: absolute; top: 20vw; right: 6.3vw; z-index: 2;}
  #tw-map .tw-hua a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-yun { width: 5vw; position: absolute; top: 23.5vw; right: 24vw; z-index: 2;}
  #tw-map .tw-yun a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-cyi { width: 5vw; position: absolute; top: 26.5vw; right: 20.5vw; z-index: 2;}
  #tw-map .tw-cyi a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tnn { width: 3.5vw; position: absolute; top: 31.5vw; right: 24.5vw; z-index: 2;}
  #tw-map .tw-tnn a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-khh { width: 3.5vw; position: absolute; top: 32.5vw; right: 17.5vw; z-index: 2;}
  #tw-map .tw-khh a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ttt { width: 3.5vw; position: absolute; top: 33vw; right: 11.5vw; z-index: 2;}
  #tw-map .tw-ttt a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-pif { width: 3.5vw; position: absolute; top: 39vw; right: 19vw; z-index: 2;}
  #tw-map .tw-pif a { width: 100%; color: #fff; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mzw { width: 3vw; position: absolute; top: 7vw; left: 6vw; z-index: 2;}
  #tw-map .tw-mzw a { width: 100%; color: #595757; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kin { width: 3vw; position: absolute; top: 11.5vw; left: 3vw; z-index: 2;}
  #tw-map .tw-kin a { width: 100%; color: #595757; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-pen { width: 3vw; position: absolute; top: 18vw; left: 3vw; z-index: 2;}
  #tw-map .tw-pen a { width: 100%; color: #595757; font-size: 1vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kee a:hover, #tw-map .tw-tpe a:hover, #tw-map .tw-nwt a:hover, #tw-map .tw-tyc a:hover, #tw-map .tw-hsz a:hover, #tw-map .tw-mia a:hover, #tw-map .tw-txg a:hover, #tw-map .tw-cha a:hover, #tw-map .tw-nan a:hover, #tw-map .tw-hua a:hover, #tw-map .tw-yun a:hover, #tw-map .tw-cyi a:hover, #tw-map .tw-tnn a:hover, #tw-map .tw-khh a:hover, #tw-map .tw-ttt a:hover, #tw-map .tw-pif a:hover { color: #fff000;}
  #tw-map .tw-mzw a:hover, #tw-map .tw-kin a:hover, #tw-map .tw-pen a:hover { color: #9b368e;}
  #tw-map div img.icon { width: 0.8vw; height: auto; margin: 0 0.2vw;}


  /******** AGP ********/

  .effect-agp-year-title { width: 100%; margin: 0 0 30px 0; display: flex; justify-content: flex-start; align-items: center;}
  .effect-agp-year-title .title-1 { width: 300px;}
  .effect-agp-year-title .title-2 { width: 260px; padding: 10px 0 10px 25px; box-sizing: border-box; border-radius: 36px; background-color: #C7B88D;}
  
  .effect-year-2016 { width: 380px; height: 90px; position: absolute; top: 10px; right: 275px; z-index: 2;}
  .effect-year-2017 { width: 380px; height: 90px; position: absolute; top: 116px; right: 105px; z-index: 2;}
  .effect-year-2018 { width: 380px; height: 90px; position: absolute; top: 221px; right: 50px; z-index: 2;}
  .effect-year-2019 { width: 380px; height: 90px; position: absolute; top: 325px; right: 30px; z-index: 2;}
  .effect-year-2020 { width: 380px; height: 90px; position: absolute; top: 432px; right: 40px; z-index: 2;}
  .effect-year-2021 { width: 380px; height: 90px; position: absolute; top: 537px; right: 120px; z-index: 2;}
  .effect-year-2022 { width: 380px; height: 90px; position: absolute; top: 645px; right: 262px; z-index: 2;}
  .effect-year-2016 a, 
  .effect-year-2017 a, 
  .effect-year-2018 a, 
  .effect-year-2019 a, 
  .effect-year-2020 a, 
  .effect-year-2021 a, 
  .effect-year-2022 a { width: 100%; height: 100%; display: block;}

  table.effect-agp-year-table { font-size: 0.9rem;}


  /* AGP每年數據-202405 */
  .agp-total-data-box { width: 50vw; margin: 0 auto;}
  .agp-total-data-box .agp-top-total { width: 25vw; margin: 0 auto; position: relative;}
  .agp-total-data-box .agp-top-total img.agp-title-bg { width: 100%; height: auto; position: relative; z-index: 1;}
  .agp-total-data-box .agp-top-total .text-con { width: 100%; padding: 5vw 0 0 0; font-size: 1.8vw; font-weight: 700; text-align: center; position: absolute; top: 0; left: 0; z-index: 2;}
  .agp-total-data-box .agp-top-total .text-con span.data-num { color: #90291F; font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total { width: 50vw; padding: 2vw 0 0 0; margin: 0 auto; background-image: url(../images/agp_total_line_bg.png); background-repeat: repeat-y; background-size: 25vw auto; background-position: center top;}
  .agp-total-data-box .agp-list-total .data-rt-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-rt-box img { width: 25vw; height: auto; margin: 0 0 0 24vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-rt-box .year { width: 4vw; color: #666; font-size: 1.4vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 1.7vw; left: 27.5vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data { width: 15vw; color: #fff; font-size: 1.2vw; font-weight: 300; position: absolute; top: 1vw; left: 32vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data span.numbers { font-size: 2.5vw; font-weight: 900; letter-spacing: -0.05em;}
  .agp-total-data-box .agp-list-total .data-lf-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-lf-box img { width: 25vw; height: auto; margin: 0 0 0 1.1vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-lf-box .year { width: 4vw; color: #666; font-size: 1.4vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 1.7vw; left: 17.8vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data { width: 15vw; color: #fff; font-size: 1.2vw; font-weight: 300; text-align: right; position: absolute; top: 1vw; left: 2.5vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data span.numbers { font-size: 2.5vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total .data-rt-box a.a-link { width: 25vw; height: 5.8vw; margin: 0 0 0 24vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}
  .agp-total-data-box .agp-list-total .data-lf-box a.a-link { width: 25vw; height: 5.8vw; margin: 0 0 0 1.1vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}

  .agp-total-data-box .agp-bottom-total { width: 27vw; margin: 0 auto;}
  .agp-total-data-box .agp-bottom-total img.agp-bottom-dot { width: 100%; height: auto;}

  .agp-total-notice { clear: both; width: 50vw; margin: 4vw auto 0 auto; text-align: center; font-weight: 300;}

}
@media screen and (min-width: 992px) and (max-width: 1199px) {

  /******** hp tw_map ********/

  .tw-map-dire { width: 100%; height: auto; text-align: center;}
  .tw-map-dire img { width: 60vw; height: auto;}

  #tw-map { clear: both; width: 60vw; margin: 0 auto; position: relative;}
  #tw-map img.tw-map { width: 100%; height: auto;}
  #tw-map .tw-kee { width: 5vw; position: absolute; top: 3.7vw; right: 3vw; z-index: 2;}
  #tw-map .tw-kee a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tpe { width: 7vw; position: absolute; top: 5.5vw; right: 8vw; z-index: 2;}
  #tw-map .tw-tpe a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-nwt { width: 7vw; position: absolute; top: 9.2vw; right: 9vw; z-index: 2;}
  #tw-map .tw-nwt a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-tyc { width: 5vw; position: absolute; top: 6.5vw; right: 17.5vw; z-index: 2;}
  #tw-map .tw-tyc a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hsz { width: 7vw; position: absolute; top: 12.5vw; right: 19.4vw; z-index: 2;}
  #tw-map .tw-hsz a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ilc { width: 5vw; position: absolute; top: 15.5vw; right: 6vw; z-index: 2;}
  #tw-map .tw-ilc a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mia { width: 5vw; position: absolute; top: 18.2vw; right: 25vw; z-index: 2;}
  #tw-map .tw-mia a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-txg { width: 5vw; position: absolute; top: 24.2vw; right: 28vw; z-index: 2;}
  #tw-map .tw-txg a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-cha { width: 5vw; position: absolute; top: 30vw; right: 34.5vw; z-index: 2;}
  #tw-map .tw-cha a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-nan { width: 5vw; position: absolute; top: 31.5vw; right: 22vw; z-index: 2;}
  #tw-map .tw-nan a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hua { width: 5vw; position: absolute; top: 30vw; right: 10vw; z-index: 2;}
  #tw-map .tw-hua a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-yun { width: 7vw; position: absolute; top: 35.5vw; right: 36vw; z-index: 2;}
  #tw-map .tw-yun a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-cyi { width: 7vw; position: absolute; top: 40vw; right: 30vw; z-index: 2;}
  #tw-map .tw-cyi a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tnn { width: 5vw; position: absolute; top: 47vw; right: 37vw; z-index: 2;}
  #tw-map .tw-tnn a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-khh { width: 5vw; position: absolute; top: 48.5vw; right: 26vw; z-index: 2;}
  #tw-map .tw-khh a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ttt { width: 5vw; position: absolute; top: 49.5vw; right: 17.5vw; z-index: 2;}
  #tw-map .tw-ttt a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-pif { width: 5vw; position: absolute; top: 59vw; right: 28.7vw; z-index: 2;}
  #tw-map .tw-pif a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mzw { width: 4vw; position: absolute; top: 10.5vw; left: 9vw; z-index: 2;}
  #tw-map .tw-mzw a { width: 100%; color: #595757; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kin { width: 4vw; position: absolute; top: 17.7vw; left: 4.5vw; z-index: 2;}
  #tw-map .tw-kin a { width: 100%; color: #595757; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-pen { width: 4vw; position: absolute; top: 27vw; left: 5vw; z-index: 2;}
  #tw-map .tw-pen a { width: 100%; color: #595757; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kee a:hover, #tw-map .tw-tpe a:hover, #tw-map .tw-nwt a:hover, #tw-map .tw-tyc a:hover, #tw-map .tw-hsz a:hover, #tw-map .tw-mia a:hover, #tw-map .tw-txg a:hover, #tw-map .tw-cha a:hover, #tw-map .tw-nan a:hover, #tw-map .tw-hua a:hover, #tw-map .tw-yun a:hover, #tw-map .tw-cyi a:hover, #tw-map .tw-tnn a:hover, #tw-map .tw-khh a:hover, #tw-map .tw-ttt a:hover, #tw-map .tw-pif a:hover { color: #fff000;}
  #tw-map .tw-mzw a:hover, #tw-map .tw-kin a:hover, #tw-map .tw-pen a:hover { color: #9b368e;}
  #tw-map div img.icon { width: 1.2vw; height: auto; margin: 0 0.2vw;}


  /******** AGP ********/

  .effect-agp-year-title { width: 100%; margin: 0 0 30px 0; display: flex; justify-content: flex-start; align-items: flex-start;}
  .effect-agp-year-title .title-1 { width: 220px;}
  .effect-agp-year-title .title-2 { width: 260px; padding: 10px 0 10px 25px; box-sizing: border-box; border-radius: 36px; background-color: #C7B88D;}
  
  .effect-year-2016 { width: 30vw; height: 7.5vw; position: absolute; top: 0.4vw; right: 21.3vw; z-index: 2;}
  .effect-year-2017 { width: 30vw; height: 7.5vw; position: absolute; top: 8.7vw; right: 8.5vw; z-index: 2;}
  .effect-year-2018 { width: 30vw; height: 7.5vw; position: absolute; top: 17vw; right: 4vw; z-index: 2;}
  .effect-year-2019 { width: 30vw; height: 7.5vw; position: absolute; top: 25.1vw; right: 2.3vw; z-index: 2;}
  .effect-year-2020 { width: 30vw; height: 7.5vw; position: absolute; top: 33vw; right: 3vw; z-index: 2;}
  .effect-year-2021 { width: 30vw; height: 7.5vw; position: absolute; top: 41vw; right:9.7vw; z-index: 2;}
  .effect-year-2022 { width: 30vw; height: 7.5vw; position: absolute; top: 49.5vw; right: 20.5vw; z-index: 2;}
  .effect-year-2016 a, 
  .effect-year-2017 a, 
  .effect-year-2018 a, 
  .effect-year-2019 a, 
  .effect-year-2020 a, 
  .effect-year-2021 a, 
  .effect-year-2022 a { width: 100%; height: 100%; display: block;}

  table.effect-agp-year-table { font-size: 0.9rem;}


  /* AGP每年數據-202405 */
  .agp-total-data-box { width: 100%; margin: 0 auto;}
  .agp-total-data-box .agp-top-total { width: 34vw; margin: 0 auto; position: relative;}
  .agp-total-data-box .agp-top-total img.agp-title-bg { width: 100%; height: auto; position: relative; z-index: 1;}
  .agp-total-data-box .agp-top-total .text-con { width: 100%; padding: 6.5vw 0 0 0; font-size: 2.4vw; font-weight: 700; text-align: center; position: absolute; top: 0; left: 0; z-index: 2;}
  .agp-total-data-box .agp-top-total .text-con span.data-num { color: #90291F; font-size: 5vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total { width: 70vw; padding: 2vw 0 0 0; margin: 0 auto; background-image: url(../images/agp_total_line_bg.png); background-repeat: repeat-y; background-size: 34vw auto; background-position: center top;}
  .agp-total-data-box .agp-list-total .data-rt-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-rt-box img { width: 36vw; height: auto; margin: 0 0 0 33.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-rt-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 38.5vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; position: absolute; top: 1.6vw; left: 45vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}
  .agp-total-data-box .agp-list-total .data-lf-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-lf-box img { width: 36vw; height: auto; margin: 0 0 0 0.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-lf-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 24.6vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; text-align: right; position: absolute; top: 1.6vw; left: 2.2vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total .data-rt-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 33.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}
  .agp-total-data-box .agp-list-total .data-lf-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 0.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}

  .agp-total-data-box .agp-bottom-total { width: 34vw; margin: 0 auto;}
  .agp-total-data-box .agp-bottom-total img.agp-bottom-dot { width: 100%; height: auto;}

  .agp-total-notice { clear: both; width: 100%; margin: 4vw auto 0 auto; text-align: center; font-weight: 300;}

}
@media screen and (min-width: 768px) and (max-width: 991px) {

  /******** hp tw_map ********/

  .tw-map-dire { width: 100%; height: auto; text-align: center;}
  .tw-map-dire img { width: 60vw; height: auto;}

  #tw-map { clear: both; width: 60vw; margin: 0 auto; position: relative;}
  #tw-map img.tw-map { width: 100%; height: auto;}
  #tw-map .tw-kee { width: 6vw; position: absolute; top: 3.7vw; right: 2.5vw; z-index: 2;}
  #tw-map .tw-kee a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tpe { width: 7vw; position: absolute; top: 5.5vw; right: 8vw; z-index: 2;}
  #tw-map .tw-tpe a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-nwt { width: 7vw; position: absolute; top: 9.2vw; right: 9vw; z-index: 2;}
  #tw-map .tw-nwt a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-tyc { width: 6vw; position: absolute; top: 6.5vw; right: 17vw; z-index: 2;}
  #tw-map .tw-tyc a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hsz { width: 7vw; position: absolute; top: 12.5vw; right: 19.4vw; z-index: 2;}
  #tw-map .tw-hsz a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ilc { width: 6vw; position: absolute; top: 15.5vw; right: 5.5vw; z-index: 2;}
  #tw-map .tw-ilc a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mia { width: 6vw; position: absolute; top: 18.2vw; right: 25vw; z-index: 2;}
  #tw-map .tw-mia a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-txg { width: 6vw; position: absolute; top: 24.2vw; right: 27.5vw; z-index: 2;}
  #tw-map .tw-txg a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-cha { width: 6vw; position: absolute; top: 30vw; right: 34vw; z-index: 2;}
  #tw-map .tw-cha a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-nan { width: 6vw; position: absolute; top: 31.5vw; right: 21.5vw; z-index: 2;}
  #tw-map .tw-nan a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hua { width: 6vw; position: absolute; top: 30vw; right: 9.5vw; z-index: 2;}
  #tw-map .tw-hua a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-yun { width: 7vw; position: absolute; top: 35.5vw; right: 36vw; z-index: 2;}
  #tw-map .tw-yun a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-cyi { width: 7vw; position: absolute; top: 40vw; right: 30vw; z-index: 2;}
  #tw-map .tw-cyi a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tnn { width: 6vw; position: absolute; top: 47vw; right: 36.5vw; z-index: 2;}
  #tw-map .tw-tnn a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-khh { width: 6vw; position: absolute; top: 48.5vw; right: 25.5vw; z-index: 2;}
  #tw-map .tw-khh a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ttt { width: 6vw; position: absolute; top: 49.5vw; right: 17vw; z-index: 2;}
  #tw-map .tw-ttt a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-pif { width: 6vw; position: absolute; top: 59vw; right: 28.2vw; z-index: 2;}
  #tw-map .tw-pif a { width: 100%; color: #fff; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mzw { width: 4vw; position: absolute; top: 10.5vw; left: 9vw; z-index: 2;}
  #tw-map .tw-mzw a { width: 100%; color: #595757; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kin { width: 4vw; position: absolute; top: 17.7vw; left: 4.5vw; z-index: 2;}
  #tw-map .tw-kin a { width: 100%; color: #595757; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-pen { width: 4vw; position: absolute; top: 27vw; left: 5vw; z-index: 2;}
  #tw-map .tw-pen a { width: 100%; color: #595757; font-size: 1.4vw; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kee a:hover, #tw-map .tw-tpe a:hover, #tw-map .tw-nwt a:hover, #tw-map .tw-tyc a:hover, #tw-map .tw-hsz a:hover, #tw-map .tw-mia a:hover, #tw-map .tw-txg a:hover, #tw-map .tw-cha a:hover, #tw-map .tw-nan a:hover, #tw-map .tw-hua a:hover, #tw-map .tw-yun a:hover, #tw-map .tw-cyi a:hover, #tw-map .tw-tnn a:hover, #tw-map .tw-khh a:hover, #tw-map .tw-ttt a:hover, #tw-map .tw-pif a:hover { color: #fff000;}
  #tw-map .tw-mzw a:hover, #tw-map .tw-kin a:hover, #tw-map .tw-pen a:hover { color: #9b368e;}
  #tw-map div img.icon { width: 1.2vw; height: auto; margin: 0 0.2vw;}


  /******** AGP ********/

  .effect-agp-year-title { width: 100%; margin: 0 0 30px 0; display: flex; justify-content: flex-start; align-items: flex-start;}
  .effect-agp-year-title .title-1 { width: 220px;}
  .effect-agp-year-title .title-2 { width: 260px; padding: 10px 0 10px 25px; box-sizing: border-box; border-radius: 36px; background-color: #C7B88D;}
  
  .effect-year-2016 { width: 35vw; height: 9vw; position: absolute; top: 0.4vw; right: 24.7vw; z-index: 2;}
  .effect-year-2017 { width: 35vw; height: 9vw; position: absolute; top: 9.9vw; right: 9.5vw; z-index: 2;}
  .effect-year-2018 { width: 35vw; height: 9vw; position: absolute; top: 19.5vw; right: 4.6vw; z-index: 2;}
  .effect-year-2019 { width: 35vw; height: 9vw; position: absolute; top: 28.7vw; right: 2.5vw; z-index: 2;}
  .effect-year-2020 { width: 35vw; height: 9vw; position: absolute; top: 38.2vw; right: 3.4vw; z-index: 2;}
  .effect-year-2021 { width: 35vw; height: 9vw; position: absolute; top: 48vw; right: 11vw; z-index: 2;}
  .effect-year-2022 { width: 35vw; height: 9vw; position: absolute; top: 58vw; right: 23vw; z-index: 2;}
  .effect-year-2016 a, 
  .effect-year-2017 a, 
  .effect-year-2018 a, 
  .effect-year-2019 a, 
  .effect-year-2020 a, 
  .effect-year-2021 a, 
  .effect-year-2022 a { width: 100%; height: 100%; display: block;}

  table.effect-agp-year-table { font-size: 0.9rem;}


  /* AGP每年數據-202405 */
  .agp-total-data-box { width: 100%; margin: 0 auto;}
  .agp-total-data-box .agp-top-total { width: 34vw; margin: 0 auto; position: relative;}
  .agp-total-data-box .agp-top-total img.agp-title-bg { width: 100%; height: auto; position: relative; z-index: 1;}
  .agp-total-data-box .agp-top-total .text-con { width: 100%; padding: 6.5vw 0 0 0; font-size: 2.4vw; font-weight: 700; text-align: center; position: absolute; top: 0; left: 0; z-index: 2;}
  .agp-total-data-box .agp-top-total .text-con span.data-num { color: #90291F; font-size: 5vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total { width: 70vw; padding: 2vw 0 0 0; margin: 0 auto; background-image: url(../images/agp_total_line_bg.png); background-repeat: repeat-y; background-size: 34vw auto; background-position: center top;}
  .agp-total-data-box .agp-list-total .data-rt-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-rt-box img { width: 36vw; height: auto; margin: 0 0 0 33.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-rt-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 38.5vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; position: absolute; top: 1.6vw; left: 45vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}
  .agp-total-data-box .agp-list-total .data-lf-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-lf-box img { width: 36vw; height: auto; margin: 0 0 0 0.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-lf-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 24.6vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; text-align: right; position: absolute; top: 1.6vw; left: 2.2vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total .data-rt-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 33.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}
  .agp-total-data-box .agp-list-total .data-lf-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 0.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}

  .agp-total-data-box .agp-bottom-total { width: 34vw; margin: 0 auto;}
  .agp-total-data-box .agp-bottom-total img.agp-bottom-dot { width: 100%; height: auto;}

  .agp-total-notice { clear: both; width: 100%; margin: 4vw auto 0 auto; text-align: center; font-weight: 300;}

}
@media screen and (min-width: 576px) and (max-width: 767px) {

  /******** hp tw_map ********/

  .tw-map-dire { width: 100%; height: auto; text-align: center;}
  .tw-map-dire img { width: 70vw; height: auto;}

  #tw-map { clear: both; width: 70vw; margin: 0 auto; position: relative;}
  #tw-map img.tw-map { width: 100%; height: auto;}
  #tw-map .tw-kee { width: 40px; position: absolute; top: 4vw; right: 2.8vw; z-index: 2;}
  #tw-map .tw-kee a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tpe { width: 50px; position: absolute; top: 6.5vw; right: 9vw; z-index: 2;}
  #tw-map .tw-tpe a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-nwt { width: 50px; position: absolute; top: 11vw; right: 10vw; z-index: 2;}
  #tw-map .tw-nwt a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-tyc { width: 40px; position: absolute; top: 8vw; right: 20.5vw; z-index: 2;}
  #tw-map .tw-tyc a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hsz { width: 50px; position: absolute; top: 14.5vw; right: 22vw; z-index: 2;}
  #tw-map .tw-hsz a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ilc { width: 40px; position: absolute; top: 18vw; right: 6.5vw; z-index: 2;}
  #tw-map .tw-ilc a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mia { width: 40px; position: absolute; top: 21vw; right: 28vw; z-index: 2;}
  #tw-map .tw-mia a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-txg { width: 40px; position: absolute; top: 28vw; right: 32vw; z-index: 2;}
  #tw-map .tw-txg a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-cha { width: 40px; position: absolute; top: 34.5vw; right: 39.5vw; z-index: 2;}
  #tw-map .tw-cha a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-nan { width: 40px; position: absolute; top: 36.5vw; right: 25vw; z-index: 2;}
  #tw-map .tw-nan a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hua { width: 40px; position: absolute; top: 35vw; right: 11vw; z-index: 2;}
  #tw-map .tw-hua a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-yun { width: 50px; position: absolute; top: 41.5vw; right: 42vw; z-index: 2;}
  #tw-map .tw-yun a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-cyi { width: 50px; position: absolute; top: 46.5vw; right: 36vw; z-index: 2;}
  #tw-map .tw-cyi a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tnn { width: 40px; position: absolute; top: 55vw; right: 42vw; z-index: 2;}
  #tw-map .tw-tnn a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-khh { width: 40px; position: absolute; top: 56vw; right: 30vw; z-index: 2;}
  #tw-map .tw-khh a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ttt { width: 40px; position: absolute; top: 58vw; right: 20.5vw; z-index: 2;}
  #tw-map .tw-ttt a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-pif { width: 40px; position: absolute; top: 68vw; right: 33vw; z-index: 2;}
  #tw-map .tw-pif a { width: 100%; color: #fff; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mzw { width: 30px; position: absolute; top: 12vw; left: 10.5vw; z-index: 2;}
  #tw-map .tw-mzw a { width: 100%; color: #595757; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kin { width:30px; position: absolute; top: 20vw; left: 5.5vw; z-index: 2;}
  #tw-map .tw-kin a { width: 100%; color: #595757; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-pen { width: 30px; position: absolute; top: 31vw; left: 6vw; z-index: 2;}
  #tw-map .tw-pen a { width: 100%; color: #595757; font-size: 0.6em; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kee a:hover, #tw-map .tw-tpe a:hover, #tw-map .tw-nwt a:hover, #tw-map .tw-tyc a:hover, #tw-map .tw-hsz a:hover, #tw-map .tw-mia a:hover, #tw-map .tw-txg a:hover, #tw-map .tw-cha a:hover, #tw-map .tw-nan a:hover, #tw-map .tw-hua a:hover, #tw-map .tw-yun a:hover, #tw-map .tw-cyi a:hover, #tw-map .tw-tnn a:hover, #tw-map .tw-khh a:hover, #tw-map .tw-ttt a:hover, #tw-map .tw-pif a:hover { color: #fff000;}
  #tw-map .tw-mzw a:hover, #tw-map .tw-kin a:hover, #tw-map .tw-pen a:hover { color: #9b368e;}
  #tw-map div img.icon { width: 9px; height: auto; margin: 0 2px;}


  /******** AGP ********/

  .effect-agp-year-title { width: 100%; margin: 0 0 30px 0;}
  .effect-agp-year-title .title-1 { width: 100%;}
  .effect-agp-year-title .title-2 { width: 260px; padding: 10px 0 10px 25px; box-sizing: border-box; border-radius: 36px; background-color: #C7B88D;}
  
  .effect-year-2016 { width: 35vw; height: 8vw; position: absolute; top: 0.7vw; right: 24.7vw; z-index: 2;}
  .effect-year-2017 { width: 35vw; height: 8vw; position: absolute; top: 9.9vw; right: 9.5vw; z-index: 2;}
  .effect-year-2018 { width: 35vw; height: 8vw; position: absolute; top: 19vw; right: 4.6vw; z-index: 2;}
  .effect-year-2019 { width: 35vw; height: 8vw; position: absolute; top: 27.5vw; right: 2.5vw; z-index: 2;}
  .effect-year-2020 { width: 35vw; height: 8vw; position: absolute; top: 36.8vw; right: 3.4vw; z-index: 2;}
  .effect-year-2021 { width: 35vw; height: 8vw; position: absolute; top: 45.6vw; right: 11vw; z-index: 2;}
  .effect-year-2022 { width: 35vw; height: 8vw; position: absolute; top: 55vw; right: 23vw; z-index: 2;}
  .effect-year-2016 a, 
  .effect-year-2017 a, 
  .effect-year-2018 a, 
  .effect-year-2019 a, 
  .effect-year-2020 a, 
  .effect-year-2021 a, 
  .effect-year-2022 a { width: 100%; height: 100%; display: block;}

  table.effect-agp-year-table { font-size: 0.8rem;}


  /* AGP每年數據-202405 */
  .agp-total-data-box { width: 100%; margin: 0 auto;}
  .agp-total-data-box .agp-top-total { width: 34vw; margin: 0 auto; position: relative;}
  .agp-total-data-box .agp-top-total img.agp-title-bg { width: 100%; height: auto; position: relative; z-index: 1;}
  .agp-total-data-box .agp-top-total .text-con { width: 100%; padding: 6.5vw 0 0 0; font-size: 2.4vw; font-weight: 700; text-align: center; position: absolute; top: 0; left: 0; z-index: 2;}
  .agp-total-data-box .agp-top-total .text-con span.data-num { color: #90291F; font-size: 5vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total { width: 70vw; padding: 2vw 0 0 0; margin: 0 auto; background-image: url(../images/agp_total_line_bg.png); background-repeat: repeat-y; background-size: 34vw auto; background-position: center top;}
  .agp-total-data-box .agp-list-total .data-rt-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-rt-box img { width: 36vw; height: auto; margin: 0 0 0 33.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-rt-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 38.5vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; position: absolute; top: 1.6vw; left: 45vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}
  .agp-total-data-box .agp-list-total .data-lf-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-lf-box img { width: 36vw; height: auto; margin: 0 0 0 0.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-lf-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 24.6vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; text-align: right; position: absolute; top: 1.6vw; left: 2.2vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total .data-rt-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 33.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}
  .agp-total-data-box .agp-list-total .data-lf-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 0.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}

  .agp-total-data-box .agp-bottom-total { width: 34vw; margin: 0 auto;}
  .agp-total-data-box .agp-bottom-total img.agp-bottom-dot { width: 100%; height: auto;}

  .agp-total-notice { clear: both; width: 100%; margin: 4vw auto 0 auto; text-align: center; font-weight: 300;}

}
@media screen and (max-width: 575px) {

  /******** hp tw_map ********/

  .tw-map-dire { width: 100%; height: auto; text-align: center;}
  .tw-map-dire img { width: 80vw; height: auto;}

  #tw-map { clear: both; width: 80vw; margin: 0 auto; position: relative;}
  #tw-map img.tw-map { width: 100%; height: auto;}
  #tw-map .tw-kee { width: 8vw; position: absolute; top: 4.8vw; right: 2.5vw; z-index: 2;}
  #tw-map .tw-kee a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tpe { width: 10vw; position: absolute; top: 7vw; right: 11vw; z-index: 2;}
  #tw-map .tw-tpe a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-nwt { width: 10vw; position: absolute; top: 12vw; right: 10vw; z-index: 2;}
  #tw-map .tw-nwt a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-tyc { width: 8vw; position: absolute; top: 8vw; right: 23vw; z-index: 2;}
  #tw-map .tw-tyc a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hsz { width: 10vw; position: absolute; top: 16vw; right: 25.5vw; z-index: 2;}
  #tw-map .tw-hsz a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ilc { width: 8vw; position: absolute; top: 20.5vw; right: 7vw; z-index: 2;}
  #tw-map .tw-ilc a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mia { width: 8vw; position: absolute; top: 24vw; right: 30.5vw; z-index: 2;}
  #tw-map .tw-mia a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-txg { width: 8vw; position: absolute; top: 32vw; right: 37vw; z-index: 2;}
  #tw-map .tw-txg a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-cha { width: 8vw; position: absolute; top: 39.5vw; right: 45vw; z-index: 2;}
  #tw-map .tw-cha a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-nan { width: 8vw; position: absolute; top: 41vw; right: 28vw; z-index: 2;}
  #tw-map .tw-nan a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-hua { width: 8vw; position: absolute; top: 40vw; right: 12vw; z-index: 2;}
  #tw-map .tw-hua a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-yun { width: 10vw; position: absolute; top: 47vw; right: 47vw; z-index: 2;}
  #tw-map .tw-yun a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-cyi { width: 10vw; position: absolute; top: 53.5vw; right: 39.5vw; z-index: 2;}
  #tw-map .tw-cyi a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-tnn { width: 8vw; position: absolute; top: 63vw; right: 48vw; z-index: 2;}
  #tw-map .tw-tnn a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-khh { width: 8vw; position: absolute; top: 65vw; right: 34.5vw; z-index: 2;}
  #tw-map .tw-khh a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-ttt { width: 8vw; position: absolute; top: 67vw; right: 23vw; z-index: 2;}
  #tw-map .tw-ttt a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-pif { width: 8vw; position: absolute; top: 78vw; right: 37.5vw; z-index: 2;}
  #tw-map .tw-pif a { width: 100%; color: #fff; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; flex-wrap: wrap;}
  #tw-map .tw-mzw { width: 6vw; position: absolute; top: 14vw; left: 12vw; z-index: 2;}
  #tw-map .tw-mzw a { width: 100%; color: #595757; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kin { width: 6vw; position: absolute; top: 23vw; left: 6vw; z-index: 2;}
  #tw-map .tw-kin a { width: 100%; color: #595757; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-pen { width: 6vw; position: absolute; top: 35.5vw; left: 6vw; z-index: 2;}
  #tw-map .tw-pen a { width: 100%; color: #595757; font-size: 2.2vw; letter-spacing: normal; text-decoration: none; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #tw-map .tw-kee a:hover, #tw-map .tw-tpe a:hover, #tw-map .tw-nwt a:hover, #tw-map .tw-tyc a:hover, #tw-map .tw-hsz a:hover, #tw-map .tw-mia a:hover, #tw-map .tw-txg a:hover, #tw-map .tw-cha a:hover, #tw-map .tw-nan a:hover, #tw-map .tw-hua a:hover, #tw-map .tw-yun a:hover, #tw-map .tw-cyi a:hover, #tw-map .tw-tnn a:hover, #tw-map .tw-khh a:hover, #tw-map .tw-ttt a:hover, #tw-map .tw-pif a:hover { color: #fff000;}
  #tw-map .tw-mzw a:hover, #tw-map .tw-kin a:hover, #tw-map .tw-pen a:hover { color: #9b368e;}
  #tw-map div img.icon { width: 1.8vw; height: auto; margin: 0 0.2vw;}


  /******** AGP ********/

  .effect-agp-year-title { width: 100%; margin: 0 0 30px 0;}
  .effect-agp-year-title .title-1 { width: 100%;}
  .effect-agp-year-title .title-2 { width: 260px; padding: 10px 0 10px 25px; box-sizing: border-box; border-radius: 36px; background-color: #C7B88D;}
  
  .effect-year-2016 { width: 40vw; height: 9vw; position: absolute; top: 0.5vw; right: 24vw; z-index: 2;}
  .effect-year-2017 { width: 40vw; height: 9vw; position: absolute; top: 9.8vw; right: 10vw; z-index: 2;}
  .effect-year-2018 { width: 40vw; height: 9vw; position: absolute; top: 19vw; right: 5vw; z-index: 2;}
  .effect-year-2019 { width: 40vw; height: 9vw; position: absolute; top: 28vw; right: 4vw; z-index: 2;}
  .effect-year-2020 { width: 40vw; height: 9vw; position: absolute; top: 37.6vw; right: 4.8vw; z-index: 2;}
  .effect-year-2021 { width: 40vw; height: 9vw; position: absolute; top: 47.2vw; right: 11.4vw; z-index: 2;}
  .effect-year-2022 { width: 40vw; height: 9vw; position: absolute; top: 57vw; right: 23vw; z-index: 2;}
  .effect-year-2016 a, 
  .effect-year-2017 a, 
  .effect-year-2018 a, 
  .effect-year-2019 a, 
  .effect-year-2020 a, 
  .effect-year-2021 a, 
  .effect-year-2022 a { width: 100%; height: 100%; display: block;}

  table.effect-agp-year-table { font-size: 0.7rem;}


  /* AGP每年數據-202405 */
  .agp-total-data-box { width: 100%; margin: 0 auto;}
  .agp-total-data-box .agp-top-total { width: 34vw; margin: 0 auto; position: relative;}
  .agp-total-data-box .agp-top-total img.agp-title-bg { width: 100%; height: auto; position: relative; z-index: 1;}
  .agp-total-data-box .agp-top-total .text-con { width: 100%; padding: 6.5vw 0 0 0; font-size: 2.4vw; font-weight: 700; text-align: center; position: absolute; top: 0; left: 0; z-index: 2;}
  .agp-total-data-box .agp-top-total .text-con span.data-num { color: #90291F; font-size: 5vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total { width: 70vw; padding: 2vw 0 0 0; margin: 0 auto; background-image: url(../images/agp_total_line_bg.png); background-repeat: repeat-y; background-size: 34vw auto; background-position: center top;}
  .agp-total-data-box .agp-list-total .data-rt-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-rt-box img { width: 36vw; height: auto; margin: 0 0 0 33.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-rt-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 38.5vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; position: absolute; top: 1.6vw; left: 45vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-rt-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}
  .agp-total-data-box .agp-list-total .data-lf-box { width: 100%; margin: -2vw 0 0 0; position: relative;}
  .agp-total-data-box .agp-list-total .data-lf-box img { width: 36vw; height: auto; margin: 0 0 0 0.7vw; position: relative; z-index: 1;}
  .agp-total-data-box .agp-list-total .data-lf-box .year { width: 6vw; color: #666; font-size: 2vw; font-weight: 900; text-align: center; letter-spacing: -0.05em; position: absolute; top: 2.5vw; left: 24.6vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data { width: 22vw; color: #fff; font-size: 1.8vw; font-weight: 300; text-align: right; position: absolute; top: 1.6vw; left: 2.2vw; z-index: 2;}
  .agp-total-data-box .agp-list-total .data-lf-box .data span.numbers { font-size: 3.4vw; font-weight: 900; letter-spacing: -0.05em;}

  .agp-total-data-box .agp-list-total .data-rt-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 33.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}
  .agp-total-data-box .agp-list-total .data-lf-box a.a-link { width: 36vw; height: 8vw; margin: 0 0 0 0.7vw; display: block; position: absolute; top: 0; left: 0; z-index: 3;}

  .agp-total-data-box .agp-bottom-total { width: 34vw; margin: 0 auto;}
  .agp-total-data-box .agp-bottom-total img.agp-bottom-dot { width: 100%; height: auto;}

  .agp-total-notice { clear: both; width: 100%; margin: 4vw auto 0 auto; text-align: center; font-weight: 300;}
  
}