@charset "UTF-8";
/* --- import --- top block (logo navi menu search fonts) --- */
@import url("style_menu.css");
/* --- import --- footer block (fastmenu copyright) --- */
@import url("style_footer.css");
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

body, html {
  margin: 0px;
  padding: 0px; }

.shwo_width {
  width: 100px;
  height: 30px;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: 1000; }

.wrapper {
  font-family: "微軟正黑體";
  width: 100%; }
  .wrapper h3 {
    font-weight: 400; }
  .wrapper .bg_img {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 600px;
    height: 280px;
    z-index: 0;
    background-image: url(../images/k12_bg.svg);
    background-repeat: no-repeat;
    background-size: contain; }
  .wrapper .bg_geometry_l {
    position: absolute;
    top: 600px;
    width: 280px;
    height: 880px;
    z-index: 0;
    background-image: url(../images/geometry_l_bg.svg);
    background-repeat: no-repeat;
    background-size: contain; }
  .wrapper .bg_geometry_r {
    position: absolute;
    top: 200px;
    right: 0px;
    width: 480px;
    height: 880px;
    z-index: 0;
    background-image: url(../images/geometry_r_bg.svg);
    background-repeat: no-repeat;
    background-size: contain; }

.mediaquery_block {
  width: 100%;
  padding: 0px 10px; }

/* ------------------------------------------ */
/* ------------------------------------------ 2024 新版 側邊快速選單 */
.fast_menus_block {
  position: fixed;
  right: -280px;
  top: 160px;
  z-index: 999;
  width: 350px;
  height: 600px;
  -webkit-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s; }
  .fast_menus_block .fmb_btn_block {
    width: 70px;
    height: 280px;
    background-color: #8FC323;
    border-radius: 20px 0px 0px 20px;
    font-size: 20px;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    letter-spacing: 10px; }
    .fast_menus_block .fmb_btn_block a {
      color: #fff;
      text-decoration: none; }
    .fast_menus_block .fmb_btn_block a:hover .fmb_btn {
      margin-right: 5px; }
    .fast_menus_block .fmb_btn_block .fmb_btn {
      background-color: #8FC323;
      border-radius: 20px 0px 0px 20px;
      padding: 40px 20px;
      padding-top: 60px;
      background-image: url(../images/fastbtn_arrow_icon.svg);
      background-repeat: no-repeat;
      background-size: 20px;
      background-position: bottom 46px center;
      -webkit-transition-duration: 0.2s;
      -o-transition-duration: 0.2s;
      transition-duration: 0.2s; }
    .fast_menus_block .fmb_btn_block .fmb_btn_bg {
      background-image: url(../images/fastbtn_arrow_c_icon.svg); }
  .fast_menus_block .fmb_menus_block {
    position: absolute;
    top: 0px;
    left: 70px;
    width: 280px;
    height: 600px;
    border: solid 3px #8FC323;
    background-color: #8FC323;
    border-radius: 0px 0px 0px 20px;
    overflow: scroll; }
    .fast_menus_block .fmb_menus_block ul {
      padding: 0;
      margin: 0;
      list-style: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      margin: 20px 30px; }
      .fast_menus_block .fmb_menus_block ul a {
        color: #E48B33;
        text-decoration: none; }
      .fast_menus_block .fmb_menus_block ul a:hover li {
        background-position: right 20px center;
        padding-left: 15px; }
      .fast_menus_block .fmb_menus_block ul li {
        display: inline-block;
        width: 230px;
        font-size: 14px;
        padding: 10px 20px;
        padding-right: 40px;
        margin: 5px 0px;
        background-color: #fff;
        border-radius: 50px;
        background-image: url(../images/fastbtn_icon.svg);
        background-repeat: no-repeat;
        background-size: 20px;
        background-position: right 10px center;
        -webkit-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s; }

.fast_mail_block {
  position: fixed;
  right: -280px;
  top: 460px;
  z-index: 999;
  width: 350px;
  -webkit-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s; }
  .fast_mail_block .fmb_btn_block {
    width: 70px;
    height: 280px;
    background-color: #E48B33;
    border-radius: 20px 0px 0px 20px;
    font-size: 20px;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    letter-spacing: 10px; }
    .fast_mail_block .fmb_btn_block a {
      color: #fff;
      text-decoration: none; }
    .fast_mail_block .fmb_btn_block a:hover .fmb_btn {
      margin-right: 5px; }
    .fast_mail_block .fmb_btn_block .fmb_btn {
      background-color: #E48B33;
      border-radius: 20px 0px 0px 20px;
      padding: 40px 20px;
      padding-top: 60px;
      background-image: url(../images/leftmenu_mail_icon.svg);
      background-repeat: no-repeat;
      background-size: 18px;
      background-position: bottom 46px center;
      -webkit-transition-duration: 0.2s;
      -o-transition-duration: 0.2s;
      transition-duration: 0.2s; }

/* ------------------------------------------ 2024 新版 即時新聞 */
.news_block {
  position: relative;
  max-width: 1200px;
  height: 460px;
  margin: 0 auto;
  margin-top: 70px; }
  .news_block .news_img_block {
    display: inline-block; }
    .news_block .news_img_block .news_imgs {
      position: absolute;
      display: none;
      top: 0px;
      left: 0px;
      width: calc(100% - 450px);
      height: 460px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      border-radius: 10px; }
    .news_block .news_img_block .imgs_hovered {
      display: block; }
  .news_block .news_list_block {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 400px;
    height: 460px; }
    .news_block .news_list_block ul {
      padding: 0;
      margin: 0;
      list-style: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none; }
      .news_block .news_list_block ul a {
        color: #454545;
        text-decoration: none; }
      .news_block .news_list_block ul a:hover li {
        border-left: solid 5px #8FC323; }
      .news_block .news_list_block ul a:hover .news_item_date {
        color: #8FC323; }
      .news_block .news_list_block ul .item_hovered {
        border-left: solid 5px #8FC323; }
        .news_block .news_list_block ul .item_hovered .news_item_date {
          color: #8FC323; }
      .news_block .news_list_block ul li {
        display: block;
        padding-left: 20px;
        margin-bottom: 10px;
        border-left: solid 2px #CCCCCC;
        height: 70px;
        -webkit-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s; }
        .news_block .news_list_block ul li .news_item_date {
          color: #E48B33; }
        .news_block .news_list_block ul li .news_item_txt {
          width: 100%;
          height: 46px;
          overflow: hidden; }
    .news_block .news_list_block .news_more_btn_block a {
      color: #454545;
      text-decoration: none; }
    .news_block .news_list_block .news_more_btn_block a:hover .news_more_btn {
      padding: 14px 40px 14px 70px;
      background-position: 20px center; }
    .news_block .news_list_block .news_more_btn_block .news_more_btn {
      display: inline-block;
      margin-top: 10px;
      padding: 14px 30px 14px 60px;
      border-radius: 30px;
      color: #fff;
      background-image: url(../images/news_more_arrow.svg);
      background-repeat: no-repeat;
      background-size: 28px;
      background-position: 16px center;
      background-color: #8FC323;
      -webkit-transition-duration: 0.2s;
      -o-transition-duration: 0.2s;
      transition-duration: 0.2s; }

/* ------------------------------------------ 2024 新版 最新消息  */
.newsinfo_block {
  position: relative;
  max-width: 1200px;
  height: 560px;
  margin: 0 auto;
  background: -webkit-gradient(linear, left top, left bottom, from(#EEEEEE), to(#EEEEEE));
  background: -webkit-linear-gradient(#EEEEEE 0%, #EEEEEE 100%);
  background: -o-linear-gradient(#EEEEEE 0%, #EEEEEE 100%);
  background: linear-gradient(#EEEEEE 0%, #EEEEEE 100%);
  border-radius: 40px;
  margin-top: 70px; }
  .newsinfo_block .list_white_block {
    position: absolute;
    top: 45px;
    right: 45px;
    width: 80%;
    height: 450px;
    width: calc(100% - 210px);
    border-radius: 30px;
    background-color: #fff; }
    .newsinfo_block .list_white_block .newsinfo_list_content ul {
      padding: 0;
      margin: 0;
      list-style: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      padding: 40px; }
      .newsinfo_block .list_white_block .newsinfo_list_content ul li {
        padding: 14px 0px;
        border-bottom: solid 1px #9DD4D0; }
        .newsinfo_block .list_white_block .newsinfo_list_content ul li .ni_item_date {
          display: inline-block;
          vertical-align: top;
          color: #E48B33; }
        .newsinfo_block .list_white_block .newsinfo_list_content ul li .ni_item_txt {
          display: block;
          -o-text-overflow: ellipsis;
          text-overflow: ellipsis;
          white-space: nowrap;
          overflow: hidden;
          -webkit-transition-duration: 0.2s;
          -o-transition-duration: 0.2s;
          transition-duration: 0.2s; }
        .newsinfo_block .list_white_block .newsinfo_list_content ul li a {
          display: block;
          width: 100%;
          color: #888888;
          text-decoration: none; }
        .newsinfo_block .list_white_block .newsinfo_list_content ul li a:hover .ni_item_txt {
          color: #3D7F27;
          padding-left: 10px; }
      .newsinfo_block .list_white_block .newsinfo_list_content ul li:nth-child(5) {
        border-bottom: none; }
    .newsinfo_block .list_white_block .list_turn_on {
      display: block; }
    .newsinfo_block .list_white_block .list_turn_off {
      display: none; }
  .newsinfo_block .list_circle_block {
    position: absolute;
    top: 45px;
    left: 46px;
    width: 120px;
    height: 450px; }
    .newsinfo_block .list_circle_block ul {
      padding: 0;
      margin: 0;
      list-style: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none; }
      .newsinfo_block .list_circle_block ul li {
        position: relative;
        width: 120px;
        height: 100px;
        margin-top: 40px; }
        .newsinfo_block .list_circle_block ul li .circle_btn_txt {
          position: absolute;
          width: 60px;
          margin-top: 24px;
          margin-left: 26px;
          font-size: 24px;
          line-height: 28px; }
      .newsinfo_block .list_circle_block ul .circle_white_bg {
        width: 120px;
        height: 100px;
        background-image: url(../images/circle_bg.svg);
        background-repeat: no-repeat;
        background-size: contain; }
        .newsinfo_block .list_circle_block ul .circle_white_bg .circle_btn_txt {
          color: #3D7F27; }
      .newsinfo_block .list_circle_block ul .circle_green_bg {
        width: 100px;
        height: 100px;
        background-color: #8FC323;
        border-radius: 50%;
        -webkit-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s; }
        .newsinfo_block .list_circle_block ul .circle_green_bg .circle_btn_txt {
          color: #fff; }
      .newsinfo_block .list_circle_block ul a {
        color: #454545;
        text-decoration: none; }
      .newsinfo_block .list_circle_block ul a:hover .circle_green_bg {
        width: 106px;
        height: 100px; }

.more_btn_block {
  position: absolute;
  bottom: 0px;
  right: 45px;
  display: inline-block; }
  .more_btn_block a {
    color: #3D7F27;
    text-decoration: none; }
  .more_btn_block a:hover .more_btn {
    padding-right: 60px;
    background-position: right 10px center; }
  .more_btn_block .more_btn {
    padding: 20px 0px;
    padding-right: 40px;
    background-image: url(../images/more_icon.svg);
    background-repeat: no-repeat;
    background-size: 28px;
    background-position: right center;
    -webkit-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    transition-duration: 0.2s; }

/* ------------------------------------------ 2024 新版 便民服務  */
.convenient_service_block {
  position: relative;
  width: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(#B8F867), to(#BEE655));
  background: -webkit-linear-gradient(#B8F867, #BEE655);
  background: -o-linear-gradient(#B8F867, #BEE655);
  background: linear-gradient(#B8F867, #BEE655);
  margin-top: 70px; }
  .convenient_service_block .geometry_bg_block {
    position: absolute;
    top: 20px;
    width: 100%;
    height: 180px;
    background-image: url(../images/geometry_bg.svg);
    background-repeat: repeat-x;
    background-size: contain;
    -webkit-filter: brightness(20%) saturate(50%) contrast(85%);
    filter: brightness(20%) saturate(50%) contrast(85%);
    opacity: 0.2; }
  .convenient_service_block ul {
    padding: 0;
    margin: 0;
    list-style: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    max-width: 1600px;
    margin: 0 auto;
    padding: 30px;
    padding-top: 50px; }
    .convenient_service_block ul a {
      color: #000;
      text-decoration: none; }
    .convenient_service_block ul a:hover li {
      background-position: top 10px center; }
    .convenient_service_block ul li {
      width: 160px;
      height: 170px;
      display: inline-block;
      background-color: #fff;
      border-radius: 30px;
      font-size: 16px;
      text-align: center;
      padding-top: 120px;
      margin: 10px;
      -webkit-box-shadow: 0px 20px 30px -15px rgba(0, 0, 0, 0.5);
      box-shadow: 0px 20px 30px -15px rgba(0, 0, 0, 0.5);
      background-repeat: no-repeat;
      background-position: top 20px center;
      background-size: 85px;
      -webkit-transition-duration: 0.2s;
      -o-transition-duration: 0.2s;
      transition-duration: 0.2s; }

/* ------------------------------------------ 2024 新版 主題網站  */
.subject_website_block {
  padding-top: 50px;
  width: 100%;
  height: 500px;
  background-color: #F3FEE4;
  background-image: url(../images/city_bg.svg);
  background-repeat: repeat-x;
  background-size: 1400px;
  background-position: bottom; }
  .subject_website_block .sw_block {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0px 10px; }
    .subject_website_block .sw_block .more_btn_block {
      position: absolute;
      top: -50px;
      right: 0px; }
      .subject_website_block .sw_block .more_btn_block .more_btn {
        padding: 10px 0px;
        padding-right: 40px; }
    .subject_website_block .sw_block a:hover .more_btn {
      padding-right: 60px;
      background-position: right 10px center; }
    .subject_website_block .sw_block ul {
      padding: 0;
      margin: 0;
      list-style: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      margin-top: 50px; }
      .subject_website_block .sw_block ul a {
        color: #454545;
        text-decoration: none;
        height: 150px; }
      .subject_website_block .sw_block ul a:hover .sw_img {
        top: 5px; }
      .subject_website_block .sw_block ul li {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: 100%;
        height: 150px; }
        .subject_website_block .sw_block ul li .sw_txt {
          position: absolute;
          bottom: 0px;
          width: 100%;
          height: 22px;
          -o-text-overflow: ellipsis;
          text-overflow: ellipsis;
          white-space: nowrap;
          overflow: hidden; }
        .subject_website_block .sw_block ul li .sw_img {
            width: 100%;
            height: 110px;
            position: absolute;
            top: 0px;
            border-radius: 20px;
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
            -webkit-box-shadow: 0px 10px 20px -15px rgba(0, 0, 0, 0.5);
            box-shadow: 0px 10px 20px -15px rgba(0, 0, 0, 0.5);
            -webkit-transition-duration: 0.2s;
            -o-transition-duration: 0.2s;
            transition-duration: 0.2s;
            background-image: url(../images/main_web_default.svg);
        }
  .subject_website_block .morelink_block {
    position: relative;
    max-width: 1200px;
    height: 70px;
    margin: 0 auto;
    margin-top: 100px; }
    .subject_website_block .morelink_block .ml_arrow_left {
      left: 0px; }
    .subject_website_block .morelink_block .ml_arrow_right {
      right: 0px; }
    .subject_website_block .morelink_block .ml_arrow_btn_block {
      position: absolute;
      width: 50px;
      height: 70px; }
      .subject_website_block .morelink_block .ml_arrow_btn_block a {
        color: #454545;
        text-decoration: none; }
      .subject_website_block .morelink_block .ml_arrow_btn_block a:hover .ml_arrow_btn {
        background-position: center; }
      .subject_website_block .morelink_block .ml_arrow_btn_block .ml_arrow_btn {
        width: 50px;
        height: 70px;
        background-repeat: no-repeat;
        background-position: right;
        background-size: 40px;
        -webkit-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s; }
      .subject_website_block .morelink_block .ml_arrow_btn_block .ml_arrow_btn_r {
        background-position: left; }
    .subject_website_block .morelink_block .ml_btn_block {
      width: calc(96% - 100px);
      height: 70px;
      margin: 0 auto; }
      .subject_website_block .morelink_block .ml_btn_block ul {
        padding: 0;
        margin: 0;
        list-style: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between; }
        .subject_website_block .morelink_block .ml_btn_block ul a {
          color: #454545;
          text-decoration: none;
          width: 19%;
          height: 70px; }
        .subject_website_block .morelink_block .ml_btn_block ul a:hover li {
          border-radius: 20px; }
        .subject_website_block .morelink_block .ml_btn_block ul li {
          width: 100%;
          height: 70px;
          background-repeat: no-repeat;
          background-position: center;
          background-size: cover;
          border-radius: 10px;
          -webkit-box-shadow: 0px 10px 20px -15px rgba(0, 0, 0, 0.5);
          box-shadow: 0px 10px 20px -15px rgba(0, 0, 0, 0.5);
          -webkit-transition-duration: 0.2s;
          -o-transition-duration: 0.2s;
          transition-duration: 0.2s; }

/* ------------------------------------------ */
/* ------------------------------------------------ @media screen */
@media screen and (max-width: 1100px) {
  .wrapper .bg_img {
    width: 500px;
    height: 280px; }
  /* ------------------------------------------ 2024 新版 側邊快速選單 */
  .fast_menus_block .fmb_btn_block {
    opacity: 0.9; }
  .fast_mail_block .fmb_btn_block {
    opacity: 0.8; } }

/* ------------------------------------------------ @media screen */
@media screen and (max-width: 850px) {
  /* ------------------------------------------ 2024 新版 側邊快速選單 */
  .fast_menus_block {
    top: 120px; }
    .fast_menus_block .fmb_btn_block {
      width: 70px;
      height: 200px;
      font-size: 18px;
      letter-spacing: 8px; }
      .fast_menus_block .fmb_btn_block .fmb_btn {
        padding: 20px;
        padding-top: 40px;
        background-position: bottom 26px center; }
  .fast_mail_block {
    top: 340px; }
    .fast_mail_block .fmb_btn_block {
      width: 70px;
      height: 200px;
      font-size: 18px;
      letter-spacing: 8px; }
      .fast_mail_block .fmb_btn_block .fmb_btn {
        padding: 20px;
        padding-top: 40px;
        background-position: bottom 26px center; }
  /* ------------------------------------------ 2024 新版 即時新聞 */
  .news_block .news_list_block {
    right: 30px;
    padding-right: 40px; }
  /* ------------------------------------------ 2024 新版 最新消息  */
  .newsinfo_block .list_white_block {
    right: 65px;
    width: calc(100% - 200px); }
  .newsinfo_block .list_circle_block {
    left: 16px; }
  .more_btn_block {
    right: 65px; }
  /* ------------------------------------------ 2024 新版 主題網站  */
  .subject_website_block {
    padding-right: 65px; }
    .subject_website_block .sw_block .more_btn_block {
      right: 10px; } }

/* ------------------------------------------------ @media screen */
@media screen and (max-width: 767px) {
  .wrapper .bg_img {
    width: 400px;
    height: 220px; }
  /* ------------------------------------------ 2024 新版 即時新聞 */
  .news_block {
    height: 690px; }
    .news_block .news_img_block .news_imgs {
      top: 0px;
      left: 0px;
      width: 100%;
      height: 320px; }
    .news_block .news_list_block {
      top: 338px;
      right: none;
      left: 0px;
      padding-right: 0px;
      width: 100%; }
      .news_block .news_list_block ul li {
        padding-left: 10px;
        margin-bottom: 8px;
        width: 100%;
        height: 50px;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden; }
  /* ------------------------------------------ 2024 新版 最新消息  */
  .newsinfo_block {
    height: 660px;
    margin-top: 50px; }
    .newsinfo_block .list_white_block {
      position: absolute;
      top: 140px;
      right: 45px;
      width: 80%;
      height: 450px;
      width: 85%;
      border-radius: 30px;
      background-color: #fff; }
      .newsinfo_block .list_white_block .newsinfo_list_content ul {
        padding: 50px 20px; }
    .newsinfo_block .list_circle_block {
      top: 20px;
      left: 10%;
      width: 120px;
      height: 450px;
      width: 80%;
      height: 120px; }
      .newsinfo_block .list_circle_block ul {
        padding: 0;
        margin: 0;
        list-style: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none; }
        .newsinfo_block .list_circle_block ul li {
          width: 100px;
          height: 120px;
          margin-top: 0px;
          display: inline-block;
          vertical-align: top; }
          .newsinfo_block .list_circle_block ul li .circle_btn_txt {
            width: 60px;
            margin-top: 24px;
            margin-left: 26px;
            font-size: 24px;
            line-height: 28px; }
        .newsinfo_block .list_circle_block ul .circle_white_bg {
          width: 100px;
          height: 120px;
          background-image: url(../images/circle_v_bg.svg); }
        .newsinfo_block .list_circle_block ul a:hover .circle_green_bg {
          width: 100px;
          height: 106px; }
  .more_btn_block {
    right: 65px; }
  /* ------------------------------------------ 2024 新版 側邊快速選單 */
  .fast_menus_block {
    width: 350px;
    height: 450px; }
    .fast_menus_block .fmb_menus_block {
      width: 280px;
      height: 450px; } }

/* ------------------------------------------------ @media screen */
@media screen and (max-width: 550px) {
  .wrapper .bg_img {
    width: 300px;
    height: 150px; } }

/* ------------------------------------------------ @media screen */
@media screen and (max-width: 425px) {
  .wrapper .bg_img {
    width: 250px;
    height: 100px; }
  /* ------------------------------------------ 2024 新版 即時新聞 */
  .news_block {
    height: 600px; }
    .news_block .news_img_block .news_imgs {
      height: 240px; }
    .news_block .news_list_block {
      top: 248px; }
  /* ------------------------------------------ 2024 新版 最新消息  */
  .newsinfo_block {
    height: 660px;
    margin-top: 50px; }
    .newsinfo_block .list_white_block {
      position: absolute;
      top: 140px;
      right: 45px;
      width: 80%;
      height: 450px;
      width: 85%;
      border-radius: 30px;
      background-color: #fff; }
      .newsinfo_block .list_white_block .newsinfo_list_content ul {
        padding: 50px 20px; }
    .newsinfo_block .list_circle_block {
      top: 30px;
      left: 10%;
      width: 80%;
      height: 110px; }
      .newsinfo_block .list_circle_block ul {
        padding: 0;
        margin: 0;
        list-style: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none; }
        .newsinfo_block .list_circle_block ul li {
          width: 90px;
          height: 120px;
          margin-top: 0px;
          display: inline-block;
          vertical-align: top; }
          .newsinfo_block .list_circle_block ul li .circle_btn_txt {
            width: 50px;
            margin-top: 20px;
            margin-left: 24px;
            font-size: 22px;
            line-height: 26px; }
        .newsinfo_block .list_circle_block ul .circle_white_bg {
          width: 90px;
          height: 110px;
          background-image: url(../images/circle_v_bg.svg); }
        .newsinfo_block .list_circle_block ul .circle_green_bg {
          width: 90px;
          height: 90px;
          background-color: #8FC323; }
        .newsinfo_block .list_circle_block ul a:hover .circle_green_bg {
          width: 90px;
          height: 96px; }
  .more_btn_block {
    right: 65px; }
  /* ------------------------------------------ 2024 新版 便民服務  */
  .convenient_service_block .geometry_bg_block {
    position: absolute;
    top: 20px;
    width: 100%;
    height: 500px;
    background-repeat: repeat-y; }
  .convenient_service_block ul {
    padding: 20px; }
    .convenient_service_block ul a:hover li {
      background-position: top 10px center; }
    .convenient_service_block ul li {
      width: 140px;
      height: 140px;
      font-size: 14px;
      text-align: center;
      padding-top: 100px;
      margin: 5px;
      background-position: top 20px center;
      background-size: 65px; } }

/* ------------------------------------------------ @media screen */
@media screen and (max-width: 320px) {
  /* ------------------------------------------ 2024 新版 側邊快速選單 */
  .fast_menus_block {
    right: -300px;
    width: 350px;
    height: 450px; }
    .fast_menus_block .fmb_btn_block {
      width: 50px;
      height: 200px;
      font-size: 18px;
      letter-spacing: 8px; }
      .fast_menus_block .fmb_btn_block .fmb_btn {
        padding: 10px;
        padding-top: 40px;
        background-position: bottom 26px center; }
    .fast_menus_block .fmb_menus_block {
      position: absolute;
      top: 0px;
      left: 50px;
      width: 280px;
      height: 450px; }
  .fast_mail_block {
    top: 340px;
    right: -315px; }
    .fast_mail_block .fmb_btn_block {
      width: 50px;
      height: 200px;
      font-size: 18px;
      letter-spacing: 8px; }
      .fast_mail_block .fmb_btn_block .fmb_btn {
        padding-top: 40px;
        background-position: bottom 26px center; }
  /* ------------------------------------------ 2024 新版 側邊快速選單 */
  .fast_menus_block {
    width: 350px;
    height: 450px; }
    .fast_menus_block .fmb_menus_block {
      width: 280px;
      height: 450px; }
  /* ------------------------------------------ 2024 新版 即時新聞 */
  .news_block {
    height: 550px; }
    .news_block .news_img_block .news_imgs {
      height: 180px; }
    .news_block .news_list_block {
      top: 198px;
      font-size: 14px; }
  /* ------------------------------------------ 2024 新版 最新消息  */
  .newsinfo_block {
    height: 600px;
    margin-top: 40px; }
    .newsinfo_block .list_white_block {
      top: 115px;
      right: 30px;
      width: 80%;
      height: 400px;
      width: 85%;
      border-radius: 20px;
      font-size: 14px; }
      .newsinfo_block .list_white_block .newsinfo_list_content ul {
        padding: 20px; }
    .newsinfo_block .list_circle_block {
      top: 30px;
      left: 10%;
      width: 80%;
      height: 86px; }
      .newsinfo_block .list_circle_block ul {
        padding: 0;
        margin: 0;
        list-style: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none; }
        .newsinfo_block .list_circle_block ul li {
          width: 90px;
          height: 120px; }
          .newsinfo_block .list_circle_block ul li .circle_btn_txt {
            width: 40px;
            margin-top: 14px;
            margin-left: 17px;
            font-size: 18px;
            line-height: 22px; }
        .newsinfo_block .list_circle_block ul .circle_white_bg {
          width: 70px;
          height: 90px;
          background-image: url(../images/circle_v_bg.svg); }
        .newsinfo_block .list_circle_block ul .circle_green_bg {
          width: 70px;
          height: 70px;
          background-color: #8FC323; }
        .newsinfo_block .list_circle_block ul a:hover .circle_green_bg {
          width: 70px;
          height: 76px; }
  .more_btn_block {
    right: 45px; }
  /* ------------------------------------------ 2024 新版 便民服務  */
  .convenient_service_block .geometry_bg_block {
    position: absolute;
    top: 20px;
    width: 100%;
    height: 500px;
    background-repeat: repeat-y; }
  .convenient_service_block ul {
    padding: 20px 10px; }
    .convenient_service_block ul a:hover li {
      background-position: top 10px center; }
    .convenient_service_block ul li {
      width: 120px;
      height: 120px;
      font-size: 12px;
      text-align: center;
      padding-top: 90px;
      margin: 3px;
      background-position: top 15px center;
      background-size: 50x; } }
