﻿
/*@import url(http://fonts.googleapis.com/earlyaccess/notosanstc.css);*/

/* stylelint-disable selector-list-comma-newline-after */

.row{margin-top:5px;margin-bottom: 20px;}

.blog-header {
  line-height: 1;
  border-bottom: 1px solid #e5e5e5;
}

.blog-header-logo {
  font-weight: 300;
  font-size: 2.25rem;
}

.blog-header-logo:hover {
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "微軟正黑體","標楷體","Playfair Display", Georgia, "Times New Roman", serif;
}

.display-4 {
  font-size: 2.5rem;
}
@media (min-width: 768px) {
  .display-4 {
    font-size: 3rem;
  }
}

.nav-scroller {
  position: relative;
  z-index: 2;
  height: 2.75rem;
  overflow-y: hidden;
}

.nav-scroller .nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  padding-bottom: 1rem;
  margin-top: -1px;
  overflow-x: auto;
  text-align: center;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.tab-content{background-color: white;width: 100%;border-width:0px 1px 1px 1px;border-color: #E0E0E0;border-style: solid;padding: 15px}

.dropdown-menu .navItemMessage{font-size:0.8rem;border-top:1px solid #E0E0E0;padding-top:10px;}

li.DinamecLeftTopli{width:150px;}
.DinamecLeftTopli .dropdown-item{width:150px;white-space: normal !important; margin:5px 0px 5px 0px;}
li.DinamecLeftTopSubli{width:150px}

.img-in-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

.nav-scroller .nav-link {
  padding-top: .75rem;
  padding-bottom: .75rem;
  font-size: .875rem;
}

.card-img-right {
  height: 100%;
  border-radius: 0 3px 3px 0;
}

.flex-auto {
  -ms-flex: 0 0 auto;
  -webkit-box-flex: 0;
  flex: 0 0 auto;
}

.h-250 { height: 250px; }
@media (min-width: 768px) {
  .h-md-250 { height: 250px; }
}

.border-top { border-top: 1px solid #e5e5e5; }
.border-bottom { border-bottom: 1px solid #e5e5e5; }

.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }

/*
 * Blog name and description
 */
.blog-title {
  margin-bottom: 0;
  font-size: 2rem;
  font-weight: 400;
}
.blog-description {
  font-size: 1.1rem;
  color: #999;
}

@media (min-width: 40em) {
  .blog-title {
    font-size: 3.5rem;
  }
}

/* Pagination */
.blog-pagination {
  margin-bottom: 4rem;
}
.blog-pagination > .btn {
  border-radius: 2rem;
}

/*
 * Blog posts
 */
.blog-post {
  margin-bottom: 4rem;
}
.blog-post-title {
  margin-bottom: .25rem;
  font-size: 2.5rem;
}
.blog-post-meta {
  margin-bottom: 1.25rem;
  color: #999;
}

.imageLink {text-align:center;}
    .imageLink a {
        font-size: 1.25em;
    }

.Images {

     height: 100vh;
     width: 300px;
     float: left;
}
.imagesContent {

     width: 100vw;
     height: 100vh;
}
    .imagesContent .Display {
        width: 150px;
        height: 150px;
    }
.imageup {
    width: 100vw;
    height: 100px;
}
.imagedown {
    width: 100vw;
    height: 200vh;
}
.imageCenter {
    width: 250vw;
    height: 250vh;
}

.ui-menu { width: 210px;font-size:1em;}
body {
    margin: 0px;
    background-color: #E8E8E8;
    font-family: Trebuchet MS, Helvetica, Arial, Verdana, sans-serif;
    font-size: 1em;
}
a{text-decoration:none}
#FrameMain{width:1000px;left:50%;right:50%;position:absolute;margin-left:-500px;background-color:#FFFFFF;border-right:1px solid #999999;border-bottom:1px solid #999999}
#FrameTop{height:121px;background-image:url(../Images/Style1/FrameTop.jpg);margin-bottom:10px;font-family: "微軟正黑體",sans-serif;}
#FrameLeft{width:240px;float:left;margin-bottom:10px;margin-left:10px;}
#FrameMid{width:465px;float:left;margin-bottom:30px;}
#selectBar1{padding:91px 0px 0px 36px;}
#selectBar2{float:right;line-height:23px;}

#GoSearchD{width:150px;float:left;margin:3px 5px 0px 5px;background-image:url(../Images/GoSearch.jpg);background-repeat:no-repeat}
#GoSearch{width:150px;background-color:#FAFAFA;background-image:url(../Images/GoSearch.jpg);background-repeat:no-repeat}






/*主要區域*/
#news{margin:30px 0px 30px 0px}
#newsP{margin:30px 0px 10px 0px}
#newsMore{float:right}
#newsMore2{float:right}
#newsContent{border-top:3px solid #FFAA02;margin:3px 0px 0px 0px}
.newsContentBlock{font-size:1em;border-bottom:1px dotted #666666;list-style-type:square;}
#newsContentBlockHQ{font-size:1em;margin:3px 0px 3px 0px;}
#newsContent a{color:#333333}
#newsContent a:hover{color:#FF6600}
#newsContent2{border-top:3px solid #FFAA02;margin:3px 0px 0px 0px}
#newsContent2 a{color:#333333}
#newsContent2 a:hover{color:#FF6600}
#news li{list-style:outside;}
#news2 li{list-style:outside;}
#newsP li{list-style:outside;}
#newsContent li{background-image:none;font-size:1em;margin:0px 0px 0px 19px;padding:5px 0px 5px 0px;}
#newsContent ul{list-style-type:none;padding:0;margin:0}
#newsContent2 li{background-image:none;font-size:1em;margin:0px 0px 0px 19px;padding:5px 0px 5px 0px;}
#newsContent2 ul{list-style-type:none;padding:0;margin:0}


/*右邊區域*/
#FrameRight{width:285px;float:right;margin-bottom:10px;}
#FrameRight a{color:#333333}
#FrameRight a:hover{color:#FF6600}
#FrameRight li{background-image:none;font-size:1em;margin:0px 0px 0px 19px;padding:3px 0px 3px 0px;list-style-type:square;}
#FrameRight ul{list-style-type:none;padding:0;margin:0px 0px 0px 17px}
#LoginSystem{margin:10px 0 0 20px}
#LoginSystem2{margin:10px 0 0 20px}
#PrivateQuery{margin:10px 0 0 20px}
#PrivateQuery a{font-weight:bolder;}





/*底部*/
#FrameBottom{height:75px;background-color:#f4f5c8;clear:both;padding:10px;font-size:1em;color:#87673C}
#FrameBottom div{float:left;margin:10px 15px 0px 20px;}



/*選單*/
#FrameLeft #menu{
border:0px;
background-color:#999999;
padding:8px 10px 8px 8px;
-webkit-border-radius: 15px;
-webkit-border-top-left-radius: 7px;
-moz-border-radius: 15px;
-moz-border-radius-topleft: 7px;
border-radius: 15px;
border-top-left-radius: 7px;
position: relative;
z-index:2;
}
#FrameLeft li{

color:#FFFFCC;
border:1px solid #FFFFFF;
margin:5px 0px 5px 0px;
background: #e2e2e2; /* Old browsers */
background: -moz-linear-gradient(top,  #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* IE10+ */
background: linear-gradient(to bottom,  #e2e2e2 0%,#dbdbdb 50%,#d1d1d1 51%,#fefefe 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); /* IE6-9 */
}

#FrameLeft li a:hover { 
background: #f9d781; /* Old browsers */
background: -moz-linear-gradient(top,  #f9d781 0%, #f79d16 50%, #f28500 52%, #f9d67c 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9d781), color-stop(50%,#f79d16), color-stop(52%,#f28500), color-stop(100%,#f9d67c)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f9d781 0%,#f79d16 50%,#f28500 52%,#f9d67c 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f9d781 0%,#f79d16 50%,#f28500 52%,#f9d67c 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f9d781 0%,#f79d16 50%,#f28500 52%,#f9d67c 100%); /* IE10+ */
background: linear-gradient(to bottom,  #f9d781 0%,#f79d16 50%,#f28500 52%,#f9d67c 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcd69', endColorstr='#FFAA00',GradientType=0 ); /* IE6-9 */
} 


/*Visitors*/
#Visitors{font-size:1em;color:#999999}
#Visitors div{margin:8px 0px 0px 15px}

/*TOP*/
.selectBar1NUserOn{float:left;width:91px;height:30px;background-image:url(../Images/Style1/Btn01A.jpg);}
.selectBar1NUserOff{float:left;width:91px;height:30px;background-image:url(../Images/Style1/Btn01B.jpg);}
.selectBar2NUserOn{float:left;width:91px;height:30px;background-image:url(../Images/Style1/Btn02A.jpg);}
.selectBar2NUserOff{float:left;width:91px;height:30px;background-image:url(../Images/Style1/Btn02B.jpg);}

/*SiteMap*/
#sitemap a{font-size:1em;}
#MainSiteMap li{list-style-type:none;}
#AccessKeyContent{margin:30px 0 50px 15%}

/*PrivacyPolicy*/
#PrivacyTitle{text-align:center;font-size:1.5em;}
#PrivacyPolicy{margin:0 40px 50px 40px;line-height:30px;}

/*SecurityPolicy*/
#SecurityTitle{text-align:center;font-size:1.5em;}
#SecurityPolicy{margin:0 40px 50px 40px;line-height:30px;}

/*PolicyLink*/
#PolicyLink{font-size:0.8em;}

/*kcg01*/
#PublishOrg{margin:20px 0 0 10%;}

/*kcg01_1*/
#publishData{overflow:auto;}

/*kcg05*/
#kcg05TB th {
    font-size: 0.8125em;
}

/*TopicPage*/
#MidArea{margin:0 0 5% 10%}
.titleLabel{color:#FF8800;}
.contentHead{color:#5599FF;}

/*GoTOP*/
#gotop {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 20px;
    padding: 10px 15px;
    font-size: 1.25em;
    background: #777;
    color: white;
    cursor: pointer;
}
/*Access Key*/
#accesskeyL
{
    margin-top:-18px;
}
#accesskeyC
{
    margin-top:-18px;
}
#accesskeyR
{
    margin-top:-18px;
    float:right;
}
#accesskeyU
{
    margin-top:-100px;
    float:left;
}
.accesskeyU a
{
    color:#33CCFF;
}
.accesskeyU a:hover
{
    color:#666666;
}
.accesskey a
{
    margin-top:-18px;
    color:white;
}
.accesskey a:hover
{
    color:blue;
}

.DivFloatLeft {
    float: left;
    padding-top: 5px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
}

.pic {
    width: 40%;
    height: 100%;
    margin:4px;
}

.txt {
    width: 60%;
    height: 100%;
    overflow: hidden;
    margin: 4px;
}

.DivPicAndTxt {
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: .25rem;
    margin-left:0px;
    margin-right:0px;
}
.slick-dots li button {
    border: 1px solid #999;
    border-radius: 50%;
    width:70%;
    height:70%;
}

.slick-dots li.slick-active button {
    background: #999;
}