@charset "utf-8";
/* CSS Document */
#wrapper.toggled {
  position: fixed;
  top: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  background-color: #f3f3f3;
  overflow-y: scroll;
}
.menu .community li a {
  opacity: 0.6;
}
.menu .community li a:hover {
  opacity: 1;
}
.menu .list-group a:hover .ch {
  color: #7c2498;
}
.menu .list-group a:hover::after {
  width: 30%;
  background-color: #ffc107;
}

#sidebar-wrapper .sidebar-heading {
  padding: 0.875rem 1.25rem;
  font-size: 1.2rem;
}
#wrapper.toggled #sidebar-wrapper {
}
/*banner*/
.banner .slick-slide img {
  width: 100%;
}
.banner .slick-prev, .banner .slick-next {
  bottom: 0;
  top: inherit;
  background-color: #000;
  width: 60px;
  height: 60px;
  z-index: 9;
  -webkit-transform: inherit;
  -ms-transform: inherit;
  transform: inherit;
  opacity: 0.5;
}
.banner .slick-prev:hover, .banner .slick-next:hover {
  opacity: 1;
  background: #000;
}
.banner .slick-prev {
  left: 0;
}
.banner .slick-prev:before, .banner .slick-next:before {
  display: block;
  width: 15px;
  height: 15px;
  border-top: solid 3px #697b91;
  border-right: solid 3px #697b91;
  content: "";
  margin: auto;
}
.banner .slick-prev:before {
  -webkit-transform: rotate(225deg);
  transform: rotate(225deg);
}
.banner .slick-next:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.banner .slick-next {
  left: 65px;
}
.main .title {
  margin: auto;
  display: inline-block;
  position: relative;
  font-size: inherit;
}
.main .title .en {
  position: absolute;
  top: -20px;
  font-size: 80%;
  color: #7b5ea3;
  font-family: system-ui;
}
.main .title .en::before {
  content: "";
  width: 2em;
  height: 1px;
  display: inline-block;
  background-color: #7b5ea3;
  margin: 0 4px 4px 0;
}
.main .title .ch {
  font-size: 190%;
  font-weight: bold;
  color: #000;
}
.main .more a {
    color: #fff;
    padding: 15px 20px 15px 60px;
    display: inline-block;
    position: relative;
    letter-spacing: 2px;
    text-decoration: none;
    background-color: #000;
    background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/index/arrow_more.png);
    background-repeat: no-repeat;
    background-position: 15px 45%;
    box-shadow: 5px 5px 5px #a0a0a0;
    -webkit-box-shadow: 5px 5px 5px #a0a0a0;
    -moz-box-shadow: 5px 5px 5px #a0a0a0;
}
.main .more a:hover {background-color: #191547;letter-spacing: 10px;}
.news_board .box {
  background-color: #fff;
  box-shadow: -8px 2px 17px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: -8px 2px 17px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: -8px 2px 17px rgba(0, 0, 0, 0.3);
}
.news_board .sub a {
  color: #636363;
  letter-spacing: 1px;
  font-size: 110%;
}
.news_board p {
  display: inline-block;
  font-size: 80%;
}
.news_board .date {
  color: #4e3394;
}
.news_board .unit {
  color: #367e70;
}
.news_board .title {
  font-size: 105%;
  letter-spacing: 1px;
}
/*智慧城市策略*/
.area01 {
  text-align: center;
  position: relative;
}

.area01 .accesskey {
    position: absolute;
    left: 15px;
}

.area01 .stitle {
  color: #7b6000;
  font-weight: bold;
  font-size: 235%;
  margin: 0 0 20px 0;
}
.area01 .txt {
  margin: 0 auto 30px auto;
  font-size: 115%;
  line-height: 180%;
}
.area01 .iconbox{
    padding: 0 35px;
}
.area01 .iconbox .box{
    padding: 10px;
}
.area01 .iconbox a{
    display: block;
    text-align: center;
    text-decoration: none;
}

.area01 .iconbox a:hover p {
    color: #695409;
    letter-spacing: 10px;
}

.area01 .iconbox a:hover .icon::after {background-color: #fff;width: 181px;height: 181px;z-index: 0;left: 2px;top: 2px;}

.area01 .iconbox a .icon::after {
    background-color: #e1e1e1;
    width: 0;
    height: 0;
    left: 50%;
    content: "";
    position: absolute;
    top: 50%;
    transition: all 200ms ease-out;
    border-radius: 100%;
}

.area01 .iconbox .icon {
    text-align: center;
    background-color: #e1e1e1;
    width: 185px;
    height: 185px;
    margin: auto;
    border-radius: 185px;
    overflow: hidden;
    position: relative;
    transition: all 200ms ease-out;
    display: -webkit-flex;
    display: flex;
}

.area01 .iconbox a:hover .icon {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    background-color: #d4bd70;
}

.area01 .iconbox p {color: #000000;font-size: 125%;margin: auto;padding: 15px 0;letter-spacing: 1px;transition: all 200ms ease-out;}

.area01 .iconbox .icon img {
    margin: auto;
    z-index: 5;
    width: 90px;
    height: 90px;
}
.area01 .iconbox .slick-prev,.area01 .iconbox .slick-next{
    width: 35px;
    height: 35px;
}
.area01 .iconbox .slick-prev{
    left: 0;
}
.area01 .iconbox .slick-next{
    right: 0;
}
.area01 .iconbox .slick-prev:before,.area01 .iconbox .slick-next:before{
    content: "";
    display: block;
    width: 35px;
    height: 35px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.area01 .iconbox .slick-next:before{
    border-top: solid 3px #6d6d6d;
    border-right: solid 3px #6d6d6d;
}
.area01 .iconbox .slick-prev:before{
    border-left: solid 3px #6d6d6d;
    border-bottom: solid 3px #6d6d6d;
}
.area01 .bg01 {
  background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/template/bg01.png);
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: 90% 0;
  z-index: -1;
  left: 0;
  top: 0;
}
/*area02*/

.area02{
    text-align: center;
    position: relative;
    overflow: hidden;
}
.area02 .tabs_box {
  padding: 10px 0;
}
.area02 .tabs {
  position: relative;
  padding: 0;
}
.area02 .tabs .container {
  z-index: 9;
}
.area02 .tabs .tabs_box {
  position: relative;
  z-index: 999;
}
.area02 .tabs .tabs_pic01 {
  position: absolute;
}
.area02 .tabs_box ul {
  padding: 0;
  margin: 0;
  text-align: left;
}
.area02 .tabs_box .nav-tabs li {
  text-align: center;
  white-space: nowrap;
  list-style-type: none;
  margin-bottom: 0;
  position: relative;
}
.area02 .tabs_box .nav-tabs li:nth-child(1)::after {
  content: "";
  top: 10px;
  bottom: 10px;
  width: 1px;
  display: block;
  background-color: #c3c3c3;
  right: 0;
  position: absolute;
}
.area02 .tabs_box .nav-tabs li a {
  color: #575757;
  padding: 10px 35px;
  font-size: 150%;
  border-radius: 50px;
  border: none;
  letter-spacing: 3px;
}
.area02 .tabs_box .nav-tabs .nav-item.show .nav-link,.area02 .tabs_box .nav-tabs .nav-link.active {
  position: relative;
  color: #1b1751;
  background-color: transparent;
}
.area02 .tabs_box .nav-tabs .nav-item.show .nav-link::after, .area02 .tabs_box .nav-tabs .nav-link.active::after {
  content: "";
  width: 100%;
  height: 3px;
  position: absolute;
  bottom: 0;
  background: rgb(41, 153, 228);
  background: -moz-linear-gradient(90deg, rgba(41, 153, 228, 1) 0%, rgba(117, 38, 132, 1) 100%);
  background: -webkit-linear-gradient(90deg, rgba(41, 153, 228, 1) 0%, rgba(117, 38, 132, 1) 100%);
  background: linear-gradient(90deg, rgba(41, 153, 228, 1) 0%, rgba(117, 38, 132, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2999e4", endColorstr="#752684", GradientType=1);
  left: 0;
}
.area02 .tabs_box .tab-content {
  padding: 25px 0;
  position: relative;
  background-color: rgba(255, 255, 255, 0.9);
}
.area02 .tabs_box .tab-pane {
  padding: 0;
}
/*列表內容*/
.area02 .tabs_box .news {
  padding: 0;
  display: inline-block;
  width: 100%;
  position: relative;
  margin-bottom: 30px;
}
.area02 .tabs_box .news ul li {
  list-style-type: none;
  position: relative;
}
.area02 .tabs_box .news.list_B ul li {
  border-bottom: 1px #e1e1e1 solid;
  padding: 0 10px 0 10px;
}
.area02 .tabs_box .news.list_A ul li {
  padding: 15px 10px;
}

.area02 .tabs_box .news ul li .pic {
  background-color: #fff;
  text-align: center;
  display: flex;
  justify-content: center;
  position: relative;
  align-items: center;
}
.area02 .tabs_box .news ul li p {
  margin: 0;
}
.area02 .tabs_box .news ul li .txt {
  font-size: 105%;
  color: #555;
  letter-spacing: 1px;
  padding: 10px 0;
}
.area02 .tabs_box .news.list_A ul li .info {
  text-align: right;
}
.area02 .tabs_box .news ul li .subject {
  font-size: 125%;
  font-weight: 600;
  color: #000;
  line-height: 130%;
}
.area02 .tabs_box .news ul li .date, .area02 .tabs_box .news ul li .unit {
  display: inline-block;
  font-size: 90%;
  white-space: nowrap;
}
.area02 .tabs_box .news ul li .date {
  color: #4e3394;
}
.area02 .tabs_box .news ul li .unit {
  color: #367e70;
  margin: 0 5px;
}
.area02 .tabs_box .news ul li .unit::before {
  content: "/";
  margin-right: 5px;
}
.area02 .tabs_box .news ul li .unit::after {
  content: "/";
  margin-left: 5px;
}
.area02 .tabs_box .news ul li a {
  padding: 8px;
  color: inherit;
  text-decoration: none;
  display: inline-block;
  width: 100%;
}
.area02 .tabs_box .news.list_A ul li a:hover {
  box-shadow: 5px 5px 5px #dadada;
  -webkit-box-shadow: 5px 5px 5px #dadada;
  -moz-box-shadow: 5px 5px 5px #dadada;
  padding: 5px 8px 8px 5px;
  background-color: #fff;
}
.area02 .tabs_box .news.list_B ul li a {
  padding: 15px 8px;
  position: relative;
}
.area02 .tabs_box .news.list_B ul li a::after {
  content: "";
  position: absolute;
  bottom: -1px;
  height: 1px;
  left: 50%;
  width: 0;
  background-color: #d2187a;
  transition: all 400ms ease-out;
}
.area02 .tabs_box .news.list_B ul li a:hover::after {
  width: 100%;
  left: 0;
}

.area02 .tabs_box .news.list_B ul li a:hover .subject {
    color: #12017a;
}
.area02 .bg01 {
  background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/index/area02_bg01.png);
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: left 0;
  z-index: -1;
  left: 0;
  top: 0;
}
.area02 .bg02 {
  background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/index/area02_bg02.png);
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: right bottom;
  z-index: -1;
  left: 0;
  top: 0;
}
/*.area03*/
.area03.ach{
	background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/index/ach_bg.jpg);
	position: relative;
	background-position: center 30%;
	background-repeat: no-repeat;
	z-index: 9;
}
.area03 .box .more{
    /* text-align: right; */
    /* padding-top: 20px; */
}

.area03.ach .box .more a {
    background-color: #896d19;
    box-shadow: 5px 5px 5px #000000;
    -webkit-box-shadow: 5px 5px 5px #000000;
    -moz-box-shadow: 5px 5px 5px #000000;
}
.area03 .box:nth-child(1){
    /* margin-top: -5%; */
}

.area03.ach .box {
    width: 100%;
    text-align: center;
}

.area03 .box .list {
    padding: 50px 6%;
    text-align: center;
    width: 100%;
}

.area03 .box .timeline {padding: 55px 49px;}

.area03 .box .timeline_box {
    text-align: left;
    position: relative;
    padding: 0 0 20px 0;
}

.area03 .box .timeline_box .slick-next {
    -moz-transform: scaleX(-1);
    -webkit-transform:scaleX(-1);
    -o-transform:scaleX(-1);
    transform:scaleX(-1);
    top: 44%;
}

.area03 .box .timeline_box .slick-prev, .area03 .box .timeline_box .slick-next {
    background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/index/timeline_left.png);
    width: 48px;
    height: 48px;
    opacity: 0.5;
}

.area03 .box .timeline_box .slick-prev:hover, .area03 .box .timeline_box .slick-next:hover {
    opacity: 1;
}



.area03 .box .timeline_box .slick-prev::before, .area03 .box .timeline_box .slick-next::before {
    display: none;
}

.area03 .box .timeline_box .item {
    padding: 0 40px;
    position: relative;
}

.area03 .box .timeline_box .item::before {
    position: absolute;
    height: 1px;
    display: block;
    background-color: rgba(255,255,255,0.5);
    width: 100%;
    content: "";
    top: -8px;
}

.area03 .box .timeline_box .slick-list {
    padding: 70px 0 30px 0;
}

.area03 .box .timeline_box::before {content: "";position: absolute;display: block;height: 1px;width: 100%;/* background-color: rgba(255,255,255,0.5); */top: 86px;}

.area03 .box .timeline_box .item .year {
    color: #cfc390;
    font-style: italic;
    font-size: 180%;
    display: inline-block;
    position: absolute;
    top: -56px;
}

.area03 .box .timeline_box .item_list ul {
    padding: 0;
    margin: 10px 0;
    list-style: none;
}

.area03 .box .timeline_box .item_list ul li {
    padding: 5px 0 5px 15px;
    font-size: 110%;
    position: relative;
}

.area03 .box .timeline_box .item_list ul li::before {position: absolute;content: '';width: 0;height: 0;border: solid 6px transparent;border-left: solid 8px #ff0000;top: 18px;left: 0;margin-top: -5px;}

.area03 .box .timeline_box .item_list ul li a {
    color: #fff;
}

.area03 .box .timeline_box .item .year::after {content: "";height: 4px;background-color: #b38f21;left: -10px;right: -10px;bottom: -6px;position: absolute;}

.area03.ach .box .title .ch {
    color: #fff;
}

.area03.ach .box .title .en {
    color: #5ac4ff;
}

.area03.ach .box .title .en::before {
    background-color: #5ac4ff;
}

.area03 .box .list .txt {
    font-size: 105%;
    color: #727272;
    letter-spacing: 1px;
}

.area03 .box .list ul {
    margin: 0;
    padding: 20px 0;
    list-style-type: none;
}

.area03 .box .list ul li a {
    color: #000;
    font-size: 125%;
    border-bottom: 1px #dedede solid;
    padding: 13px 5px 13px 100px;
    display: block;
    position: relative;
    text-decoration: none;
}

.area03 .box .list ul li a:hover {
    box-shadow: 5px 5px 5px #dadada;
    -webkit-box-shadow: 5px 5px 5px #dadada;
    -moz-box-shadow: 5px 5px 5px #dadada;
    color: #3b0656;
    margin-top: -1px;
    margin-left: 1px;
    background-color: #fff;
}

.area03 .box .list ul li .year {
    position: absolute;
    left: 0;
    color: #897354;
    font-size: 150%;
    font-family: sans-serif;
    top: 6px;
    font-style: italic;
}

.area03 .box .list ul li .year::after {content: "";width: 0;height: 0;border-top: solid 5px transparent;border-right: solid 5px transparent;border-bottom: solid 5px transparent;border-left: solid 7px #ad7425;position: absolute;left: 84px;top: 18px;}
.area03 .bn_pic img{
    max-width: 100%;
}
.bg_bottom {background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/template/bottom_bg.gif);width: 100%;background-repeat: no-repeat;background-position: left bottom;height: 600px;z-index: -1;}
/*小廣告*/
.sbanner_link{
    padding: 50px 0 40px 0;
}
.sbanner_link .sbanner .slick-prev::before {
    background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/template/ad_left.png);
}
.sbanner_link .sbanner .slick-next::before {
   background-image: url(https://webarchive.lib.ntu.edu.tw:443/archive/wayback/20221228081526/https://smartcity.ntpc.gov.tw/images/template/ad_right.png);
}
.sbanner_link .sbanner .slick-arrow::before {
    content: "";
    width: 43px;
    height: 43px;
    display: block;
    background-repeat: no-repeat;
}

.sbanner_link .sbanner .slick-arrow {
    width: 43px;
    height: 43px;
    z-index: 9999;
}
.sbanner_link .sbanner .slick-slide img {
    margin: auto;
}

.sbanner_link .sbanner .slick-slide a:focus {
    outline: 3px #ff2a2a dotted !important;
    outline-offset: -3px;
}

.sbanner_link .sbanner .slick-slide a {
    display: block;
}
@media (min-width: 1200px) {
.sbanner_link .sbanner .slick-prev {
    left: -15px;
}
.sbanner_link .sbanner .slick-next {
    right: -15px;
}
.area03 .box .timeline_box .slick-prev {
    left: -35px;
}

.area03 .box .timeline_box .slick-next {
    right: -35px;
}
	.sbanner_link .sbanner{
    padding: 0 25px;
}
}
@media (max-width: 1200px) {
.area03 .box .timeline_box .slick-prev {
    /* left: 0; */
}

.area03 .box .timeline_box .slick-next {
    /* right: 0; */
}
}
@media screen and (max-width:1440px) and (min-width:992px) {
  #page-content-wrapper {
    /* margin: 128px 0 0 0; */
  }
  .left.menu {
    display: none;
  }
}
@media (min-width: 1440px) {
  #page-content-wrapper .menu {
    display: none;
  }
  #page-content-wrapper {
    padding-left: 355px;
    min-width: 0;
    width: 100%;
    text-align: right;
  }
}
@media (max-width: 1030px) {
.sbanner_link .sbanner  {
    padding: 0 40px;
}
 .sbanner_link .slick-next {
    right: 0;
  }
  .sbanner_link .slick-prev {
    left: 0;
  }
}
@media (min-width: 992px) {  
  .menu .community li {
  padding: 0 10px;
}
  
  #page-content-wrapper.smaller .menu {
    display: flex;
    top: -70px;
  }
  #page-content-wrapper.smaller .toplink {
    position: fixed;
    right: 0;
    z-index: 9999;
    display: none;
  }
  #page-content-wrapper.smaller {
    padding: 0;
  }
  #page-content-wrapper .menu .community {
    margin: 0;
  }
  #page-content-wrapper .menu .community li {
    padding: 0 5px;
  }
  #page-content-wrapper .navbar {
    display: none;
  }
  .area01 {
    padding: 90px 60px 0 60px;
    margin-top: 40px;
  }
  .area01 .txt {
    width: 70%;
  }
.area02 .tabs .tabs_box {
    padding: 0 30% 0 0;
  }
  .area02 .tabs .tabs_pic01 {
    right: 30%;
    top: 15px;
  }
  .area03{
    /* padding: 0 0 70px 0; */
}
  .news_board {
    position: absolute;
    right: 0;
    z-index: 9;
    top: -100px;
  }
  #page-content-wrapper .menu .logo {
    top: 0;
  }
  button#menu-toggle {
  }
  .news_board .box {
    padding: 15px 75px 15px 30px;
  }
  .area02 {
    padding: 60px 0 180px 0;
    z-index: 9;
}
}
@media (max-width: 992px) {
  .menu .community li {
  padding: 0 20px;
}
  .toggled #page-content-wrapper {
    padding: 0;
  }
  .news_board .box {
    padding: 15px 30px 15px 30px;
  }
  .area01 {
    padding: 50px 25px 0 25px;
  }
	.area02 .tabs .tabs_pic01 {
    right: -92px;
    top: 43px;
    z-index: 0;
  }
  .area02 .bg01{
    background-size: 21%;
    background-position: -57px bottom;
}

.area02 .bg02 {
    left: inherit;
    right: -52%;
    top: -125px;
}
.area02{
    padding: 60px 30px;
}

.area03.ach {
    margin-top: 0 !important;
}
.area03 .box{
    margin-top: 0 !important;
}
}

@media (max-width:600px) {
.bg_bottom{
    margin-top: -110% !important;
}
}
@media (min-width: 576px) {
  .tabs_box .news.list_A ul li .pic {
    width: 170px;
    float: left;
    margin: 0 20px 0 0;
    height: 160px;
    overflow: hidden;
  }
  .tabs_box .news ul li .pic img {
    max-height: 100%;
  }
}
@media (max-width: 576px) {
  .tabs_box .news ul li .pic img {
    width: 100%;
  }
  .area02 {
    padding: 60px 30px;
  }
  .tabs_box .news.list_A ul li .pic {
    margin-bottom: 10px;
  }
}
@media (max-width:550px) {
  .area02 .bg01,.area02 .bg02{
    display: none;
}
}
@media (max-width: 400px) {
  .tabs_box .nav-tabs li {
    width: 100%;
  }
}






/*
     FILE ARCHIVED ON 8:15:26 十二月 28, 2022 AND RETRIEVED FROM THE
     AN OPENWAYBACK INSTANCE ON 7:35:35 五月 22, 2026.
     JAVASCRIPT APPENDED BY OPENWAYBACK, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/