@charset "UTF-8";
a:hover{color:#000;text-decoration:underline;}
a:focus{color:#000;text-decoration:none;outline:1px solid orange;}
* a:focus,input:focus,textarea:focus,.bigbanner div a:hover img,.bigbanner div a:focus img{ 
  outline: 1px solid orange; 
}
body > a.goCenter{
  position: absolute;
  left: 1em;
  top: 0;
  color: #fff;
  padding: .2em .5em;
  z-index: 9999;
  font-size: 0.938em;
}
body > a.goCenter:focus{
  color: #fff;
  background: #113d98;
}
/*noscript*/
.no-js{display: block;}
.no-js a.goCenter{ color: blue; }
.no-js noscript{background:#ffb;border:solid 1px #db0;padding:5px;line-height:1.5;display:inline-block; }
.no-js noscript .key {display:inline-block;border:solid 1px #db0;background:#fff;padding:3px 6px;line-height:1;margin:0 2px;}
.no-js .fontSize+noscript{position:absolute;right:10px;top:45px; font-size: 15px;}
.no-js .function noscript { display:inline-block;width:20em;}
.no-js .share noscript{width:4em;text-align:left;overflow:visible;}
.no-js .news noscript, .goTop+noscript, .adloop+noscript{border:none;background:none;position:absolute;}

.no-js .bigbanner div{ height: 300px; }
.no-js .bigbanner div,.Block1  .btn-more,.no-js .adbanner div,.no-js .Search form{ display: none; }
.no-js .bigbanner div:first-child,.no-js .adbanner div:nth-child(1),.no-js .adbanner div:nth-child(2),
.no-js .adbanner div:nth-child(3),.no-js .adbanner div:nth-child(4),.no-js .adbanner div:nth-child(5),
.no-js .Block1 .btn-more,.no-js .Block5 .btn-more{  display: inline-block; }
.no-js .tabSet{ height: auto; }
.no-js .Search{margin-bottom: 1em;}
.no-js .tabs>h2,.no-js .tabs .tabContent{ float: none; display: block; position: static;}
.no-js .FontSize{ font-size: 16px; }
.no-js .FontSize ul,.no-js .breadcrumb{ margin: 0; }

@media (max-width: 767px) {
  .pull-xs-left { float: left !important; }
  .pull-xs-right { float: right !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .pull-sm-left { float: left !important; }
  .pull-sm-right { float: right !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .pull-md-left { float: left !important; }
  .pull-md-right { float: right !important; }
}
@media (min-width: 1200px) {
  .pull-lg-left { float: left !important; }
  .pull-lg-right { float: right !important; }
}
#list > h4 { font-weight: bold; color: #337ab7; }
#list p { color: #888; }
.list .list1 ul li { padding: 4px 0; }
.list .list2 ul li .meta { float: left; margin-right: 10px; }
.list .list2 ul li .meta .meta-time { margin-right: 10px; }
.list .list2 ul li .meta .meta-dep { border-radius: 3px; background: #666; padding: 2px; }
.list .list2 ul li .meta .meta-dep a { color: #fff; }
.list .list2 ul li p { margin-top: 4px; }
.list .list9 .nav-tabs { margin-bottom: 10px; }
.list .list10 .nav-pills { margin-bottom: 10px; }
/*maincintent 列表*/
/* site tree close/open control */
#FatFooter { margin: 0 auto: ; position: relative }
#FatFooter a.accesskey { color: #E2E2E2 !important;}
@media (max-width:991px) {
}
#FatFooter .FatFooterBtn { font-size: 1em; cursor: pointer; display: inline-block; border: none; border-radius: 0; padding: 5px; text-align: center; background-image: url(../images/fatfooter_icon01.png); background-repeat: no-repeat; background-position: 0 0; width: 32px; height: 20px; margin: 0px auto; background-color: transparent; position: absolute; left: 50%; color: transparent; }
#FatFooter .FatFooterBtn:hover, #FatFooter .FatFooterBtn:focus { text-decoration: none; cursor: pointer; border: none; }
#FatFooter .FatFooterBtn.close { font-weight: normal; border: none; text-shadow: none; opacity: 1; display: inline-block; line-height: 1.42857143; float: none; transform: rotate(180deg); }
#FatFooter nav { text-align: center; clear: both; color: #fff; margin: 20px 0 0; padding: 30px 0 10px 15px; overflow: hidden; }
#FatFooter nav ul { list-style: none; margin: 0 auto;  padding: 5px 0; overflow: hidden; font-size: 1.063em }
#FatFooter nav>ul>li {
  *float: left; margin: 6px 15px 70px 0;padding:0 10px; width: 23%; vertical-align: top; display: inline-block; text-align: left; }
  #FatFooter nav>ul>li>a { color: #113d98; padding: 0px; display: block; font-weight: bold; font-size: 1.125em }
  #FatFooter nav>ul>li>a:hover { color: #C00; text-decoration: none; }
  #FatFooter nav ul li ul { margin: 5px 0 0 0em; padding: 0; overflow: hidden; }
  #FatFooter nav ul li ul li { margin: 0 0 8px 0; padding: 0; border: none; background: none; list-style-type: none; }
  #FatFooter nav ul li ul li a { display: block; color: #000; text-decoration: none; font-size: 0.875em; font-weight: normal; line-height: 1.2em; padding: 2px 0 2px 10px; background-image: url(../images/fatfooter_icon02.png); background-repeat: no-repeat; background-position: 0 8px }
  #FatFooter nav ul li ul li a:hover { color: #C00 }
  #FatFooter nav ul li ul li ul { margin: 10px 0; padding: 0 0px }
  #FatFooter nav ul li ul li ul li a { padding: 2px 0 2px 30px; font-size: 0.875em; }
  .footer .container .row noscript nav ul ul { display: block; }
  #FatFooter .more { float: none; clear: both; }
  #FatFooter .more a { padding: 0; text-align: left; background-color: transparent; color: #113d98; font-weight: bold; font-size: 0.938em }
  @media (max-width: 991px) {
    #FatFooter nav>ul>li { width: 23%; margin: 6px 10px 0 0 }
  }
  @media (max-width: 767px) {
    .fatfooter nav { padding: 0 15px; }
    .fatfooter nav ul li { width: 100%; float: none; display: block; margin: 8px 0 8px 0; }
  }
  /*copyright*/
  .copyright .pull-right { font-size: 0.938em; line-height: 1.8em; margin: 10px 0 0; }
  .copyright ul { list-style: none; margin: 0 0 0 -5px; padding: 0; float: none; clear: both; }
  .copyright ul li { margin: 0 0em 0 0; display: inline-block; padding: 0 5px; border-right: 1px solid #ddd; }
  .copyright ul li:last-child { border-right: none; }
  /*SocialLink*/
  .SocialLink { display: inline; list-style: none; padding: 0; margin: 5px 0 0 0; }
  .SocialLink li { display: inline-block; margin: 0 0 5px 0; }
  .SocialLink li a { display: inline-block; color: #fff; background: #444; width: 35px; height: 35px; line-height: 35px; text-align: center; border-radius: 2px; }
  .SocialLink li a:hover { background: #c52d2f; color: #fff; }
  .sitemap dl { float: left; margin-right: 10px; min-width: 160px; min-height: 200px; }
  .sitemap dl dd { font-size: 14px; font-weight: bold; background: #ccc; padding: 5px; }
  .sitemap dl dt ul { margin: 14px; padding: 0; }
  .sitemap dl dt ul li { font-weight: normal; }
  body { font-family: "微軟正黑體", Arial, Helvetica, sans-serif; }
  h4 { color: #666; padding-bottom: 3px; border-bottom: 1px dotted #ccc; margin-top: 20px; }
  .page-header { margin: 20px 0px 20px; }
  .bs-docs-container { margin-top: 60px; }
  .BtnLeftSlide { width: 30px !important; white-space: inherit; display: inline; font-size: 0.85em; margin: 0px 0px 0px 0px; border-radius: 0px 5px 5px 0px; }
  .navbar-toggle { position: relative; float: right; padding: 9px 10px; margin-top: 8px; margin-right: 10px; margin-left: 5px; margin-bottom: 8px; background-color: transparent; background-image: none; border: 1px solid transparent; border-radius: 4px; }
  .bs-docs-sidebar .nav > li > a { display: block; padding: 4px 15px; font-size: 12px; font-weight: 500; color: #999999; }
  .meta { margin-right: 10px; }
  .meta .meta-time { margin-right: 10px; }
  .meta .meta-dep { margin-right: 10px; }
  .slick-slider { margin: 0px auto !important; }
  /*Tab*/
  /*選單數目*/
  /*全部選單總寬度*/
  /*選單高度*/
  .Tab { position: relative; }
  .Tab .tabs a { position: absolute; top: 0; height: 30px; text-align: center; padding: 4px; border-radius: 4px 4px 0px 0px; border-bottom: 1px solid #ccc; text-decoration: none; }
  .Tab .tabs a:focus { outline: none; }
  .Tab .tabs.active a { background-color: white; border-width: 1px; border-style: solid; border-color: #ccc #ccc transparent; -moz-border-top-colors: none; -moz-border-right-colors: none; -moz-border-bottom-colors: none; -moz-border-left-colors: none; }
  .Tab .tab_container { margin-top: 40px; background: whitesmoke; display: inline-block; /*解決margin失效問題*/ width: 100%; padding: 2%; }
  .tabs.tabs1 a { left: 0%; width: 20%; }
  .tabs.tabs2 a { left: 20%; width: 20%; }
  .tabs.tabs3 a { left: 40%; width: 20%; }
  .tabs.tabs4 a { left: 60%; width: 20%; }
  .tabs.tabs5 a { left: 80%; width: 20%; }

  /**************-------------------------------------------------------------------------------------------開始調整*/
  * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; list-style-type: none }
  html { font-size: 100%; }
  body { margin: 0 auto; font-family: "微軟正黑體", Arial, Helvetica, sans-serif; font-size: 1em; background-image: url(../images/body_bg.gif); background-repeat: repeat-x; background-position: 0 0; }
  a { color: #333 }
  a:hover { color: #198dce ;text-decoration:none;}
  a:visited, a:active { text-decoration: none }
  .accesskey { position: absolute; left: 0;  color: #fff !important;}
  .accesskey a { color: #fff !important; text-decoration: none; }
  .center-block{text-align: center; margin:1em auto;}
  hr, .panel-footer{border-top: 1px solid #ccc;}

  @media (max-width: 767px) {
    .accesskey { display: none }
  }

  @media (max-width: 767px) {
    body{background: none;}
    .row { padding-left: 15px; padding-right: 15px; }
  }
  @media (max-width: 480px) {
    .row { padding-left: 0px; padding-right: 0px; }
  }
  .navbar-default { background-color: transparent; border-color: transparent; box-shadow: none; background-image: none; border-radius: 0 }
  .navbar { border: none; margin: 0 }
  p { line-height: 1.6em }
  /*------------------------------------------------------------star*/
  .must { color: #FF0000; margin: 0px 5px 0 0; font-size: 150%; font-weight: bold; vertical-align: bottom; line-height: 110%; }
  /*--------------------------------------------------------------------------formBtn--*/
  .formBtn { margin: 10px 0 30px; text-align: center; }
  .formBtn img { vertical-align: middle; margin: 0 5px; }
  .btn3 { background-color: #2291ce; position: relative; border: 1px solid #2291ce; color: #fff; padding: 8px 15px; cursor: pointer; vertical-align: middle; margin: 0; font-family: "微軟正黑體"; font-size: 1.06em; text-align: center; border-radius: 5px; position: relative; }
  .btn3:hover { color: #fff; background-color: #3CA6DF; border: 1px solid #3CA6DF; }
  .btn2 { background-color: #999; position: relative; border: 1px solid #999; color: #fff; padding: 8px 15px; cursor: pointer; vertical-align: middle; margin: 0; font-family: "微軟正黑體"; font-size: 1.06em; text-align: center; border-radius: 5px; position: relative; }

  /*----------scrollUp*/
  #scrollUp {
    bottom: 80px;
    right: 50px;
    color: #fff;
    font-size: 1.2em;
    text-decoration: none;
    opacity: .8;
    width:50px;
    height:50px;
    line-height: 50px;    
    text-align: center;
    position: relative;
    cursor:pointer;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-backface-visibility: hidden;
    background-color: rgba(0,0,0,0.7);
    background-size: cover;
    transition: all .3s ease-in;
  }
  #scrollUp:after{
   position: absolute;
   width: 50px; height: 50px;
   top:0px; left:0;
   font-family:'fontello';
   content: '\E82F';
 }
 #scrollUp:hover{ opacity: 1; }

 /*----------header nav*/
 #Header { }
 .Topheader { position: relative; }
 .Logo { position: absolute;  top: 25px }
 @media (max-width: 991px) {
 }
 @media (max-width: 767px) {
  .Logo { top: 5px; left: 50%; margin: 0 0 0 -150px; width: auto }
  .Logo img { margin: 0 auto; width: 75%; }
}
@media (max-width:420px) {
  .Logo { margin: 0 0 0 -130px; }
  .Logo img { width: 80%; height: 50px }
}
@media (max-width:385px) {
  .Logo { top: 18px; margin: 0 0 0 -100px; }
  .Logo img { width: 75%; height: auto }
}
.navbar-brand, .navbar-nav>li>a { text-shadow: none; }
.navbar-default .navbar-nav>li>a { color: #888 }
.navbar-default .navbar-nav>li>a:hover { text-decoration: underline }
.navbar-collapse { padding: 0 }
.Topnav { padding: 0; float: left; }
.Topnav li { background-image: url(../images/nav_icon.gif); background-repeat: no-repeat; background-position: center right }
.Topnav li a { padding: 10px; }
.navbar-default .navbar-nav>li>a:focus { color: #000; }
.Topnav .accesskey { color: #fff }
/*-----------------------------------------------search-*/
.Search { height:81px;overflow: hidden; clear: both; float: right; margin: 0; padding: 0; }
.Search .navbar-form { padding: 0; }
.Search .form-control { border: 1px solid #eeeeee; width: 200px; background-color: #eeeeee; box-shadow: none; font-size: 1em }
.Search .btn-default { box-shadow: none }
.Search .btn-default { border: 1px solid #eeeeee; background-color: #eeeeee; background-image: none }
.Search .input-group { float: left; margin: 0 0 5px 0 }
.Search .AdvSearch { float: left; margin: 0 0 0 5px; display: none }
.Search .AdvSearch a { color: #fff; display: block; background-color: #167b9a; border-radius: 4px; padding: 7px 10px 6px; text-align: center; text-decoration: none; }
.Search .AdvSearch a:hover { background-color: #1EABD5; }
.Search .HotKeywords { margin: 10px 0 0 0; clear: both }
.Search .HotKeywords a { color: #113d98; margin: 0 5px 0 0; text-decoration: underline }
.Search .HotKeywords a:hover { color: #C00; text-decoration: underline }
@media (min-width:1200px) {
  .Search .navbar-form .input-group .form-control { width: 250px }
}
@media (max-width: 767px) {
  .Search { position: relative; margin-left: 15px; margin-right: 15px; box-shadow: none; padding: 15px 0 }
  .Search { position: relative; margin-left: 15px; margin-right: 15px; box-shadow: none; padding: 15px 0 }
  .Topnav{float: none; margin:0; display: block; }
  .Topnav li{background: none; border-bottom: 1px solid #376696;}
  .navbar-default .navbar-nav>li>a { color: #fff }
  .navbar-default .navbar-nav>li>a:hover{ color: #fff;background-color: #2391ce;  text-decoration:none;  }

  .navbar-default .navbar-collapse, .navbar-default .navbar-form { border: none; }
  .navbar-form { margin-left: 0; margin-right: 0; margin-top: 0 }
  .Search .form-control { width: 100% }
  .Search .input-group { margin: 0 0px 10px 0 }
  .Search .AdvSearch { margin: 0 10px 15px 0; }
  .Search .HotKeywords { float: left; clear: none; color: #fff; }
  .Search .HotKeywords a { color: #fff; }
  .Search .HotKeywords a:hover { color: #FF9 }
  .icon-menu:before { color: #003; font-size: 2em }
  .icon-down-open:before { color: #003; font-size: 2em }
  .navbar-default .navbar-toggle { border: none }
  [class^="icon-"]:before, [class*=" icon-"]:before { margin: 0 }
  .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #fff; }
  .navbar-default .navbar-collapse, .navbar-default .navbar-form { border: none; background-color: #113d98 }
}
/*----------------------------------------------------tab*/
.tabSet {  margin: 0 auto  2em auto;padding:2em;  }
.tabs { position: relative;  }
.tabs>h3 {
  overflow:hidden; 
  font-weight: normal;
  position: relative;
  height: 65px; 
  border:1px solid #fff;
  display: block; font-size: 1.1em; 
  line-height: 1.6em; padding:3px; 
  margin: 0 0 0px 49%; background-color: #eee;
}
.tabs>h3:before{
	content:"";
	position: absolute;
	top:0;left: 0;
	width: 0;
	height: 0;
	/* Skew */
	margin-bottom: 1px;
	border-left: 30px solid #fff;
	border-right: 0px solid transparent;
	border-bottom: 63px solid #eee;
}
.tabs h3>a {height: 60px;  display: block; color: #333;  text-align:left;text-decoration: none;  overflow: hidden; }

.tabs h3.active, .tabs h3:hover { color: white; background: #198dce; }
.statistics .tabs h3.active, .statistics .tabs h3:hover{ color: black; background: #66c9bd; }
.tabs h3.active { color: white; background: #198dce; }
.statistics .more a { color: white ; background: #66c9bd; }
.tabs h3:hover a, .tabs h3.active a, .tabs h3:hover span, .tabs h3.active span{ color: white; }

.tabs h3.active:before, .tabs h3:hover:before{
	border-bottom: 104px solid #198dce;
}
.statistics .tabs h3.active:before, .statistics .tabs h3:hover:before{
	border-bottom: 104px solid #66c9bd;
}
.tabs h3 span{float: left; width: 130px; color:#66c9bd;padding: 1px 0 0 30px;  }
.tabContent {    
	position: absolute;
  top: 0;
  left: 0;
  right: 0;
  clear: both;
  width:47%;
}
.info_pic {position: relative; overflow: hidden; }
.info_pic:after {padding-top:67.7%;content:""; display: block; }
.info_pic img {
	position:absolute;
  top:0;
  bottom:0;
  right:0;
  left:0;
  margin:auto;
  width: 100%;
  height: 100%;
  object-fit: cover !important;
  transition: .3s ease-out;
}
.info_pic img:hover{transform: scale(1.05, 1.05); }
.info_pic span {position: absolute; bottom:0;left:0; right: 0;color:white;
  background-color: rgba(0,0,0,0.8); display: inline-block; margin: 0; padding:10px; }

  .active + .tabContent { display: block; }

  @media (max-width:767px) {
    .tabSet { width: auto; height: auto !important; }
    .tabs { position: relative; }
    .tabs>h3 {position: inherit;}
    .tabs>h3:before{display:none;}
    .tabs h3 span{font-size: 0.9em; float: none; display: block;padding:0; }
    .tabs>h3 { float: none; margin:0; height: inherit;}
    .tabs>h3>a { width: 100% !important; font-size: 1.2em;height: inherit; }
    .tabs>h3.active>a { border-color: #bbb; }
    .tabContent { position: inherit; width: 100%; height: 100%; float: inherit !important;}
    .tabContent .more{margin:-60px 10px 0 0 ;}
  }

  @media (max-width:767px) {
    .tabSet { padding:0.5em;}
  }

  /*-------------------------------------top menu-*/
  @media (min-width: 768px) {
    #Header .menu .accesskey a { color: #2a93ce; text-decoration: none; }
    #Header .menu { width: 100%; margin: 0px 0 0 0; padding: 0; text-align: center; clear: both; z-index: 999; position: relative; background-image: url(../images/menubg.gif); background-repeat: no-repeat; background-position: left top }
    #Header .menu>ul { list-style: none; margin: 0; padding: 0; }
    #Header .menu>ul a { display: block; color: #fff; transition: all .2s; outline: none; text-decoration: none; }
    #Header .menu>ul>li>a:hover { color: #FF9; }
    #Header .menu>ul a:focus { background-color: #61ade1; color: #fff; }
    #Header .menu>ul { padding: 0; margin-bottom: -3px; font-size: 1em; line-height: 20px; display: inline-block; }
    #Header .menu>ul>li { margin: 3px 1px -3px 0; padding: 0; float: left; }
    #Header .menu>ul>li>a { padding: 10px 8px 12px; background-image: url(../images/menu_icon01.png); background-repeat: no-repeat; background-position: left center; }
    #Header .menu ul ul { display: none; overflow: visible; background-color: #fff; position: absolute; top: auto;border-radius: 0 0 4px 4px; text-align: left; margin-top: 0; box-shadow: rgba(0,0,0,0.5) 0 5px 12px; padding: 5px; }
    /*#Header .menu li li { position: relative; display: inline-block; width: 23%; vertical-align: top; margin: 0 0px 5px 10px; }*/
    #Header .menu li li>a { padding: 8px 8px 8px 20px; color: #113d98; display: block; background-image: url(../images/more_icon02.png); background-repeat: no-repeat; background-position: 5px 12px; }
    #Header .menu li li>a:hover { text-decoration: none; color: #006; background-color: #e7e7e7; border-radius: 5px; }
  #Header .menu li li.hasChild>a { /*padding-right: 32px; background-image: url(../images/menu_a_hasChild.png); background-repeat: no-repeat; background-position: 154px 15px; */ }
  #Header .menu li li.hasChild>a:hover { }
  #Header .menu li.menuother { }
  #Header .menu li.menuother ul { margin: 0; }
  #Header .menu li.menuother ul>li { margin: 0; display: block; width: 100% ;  z-index:99 ; position:relative}
  #Header .menu li.menuother ul>li>a { position: relative; display: inline-block; background-color: #E9E9E9; width: 150px; border-bottom: 1px solid #fff;border-radius:5px; z-index:999}
  #Header .menu li.menuother ul>li a:hover { background-color: #088acd; color: #fff; background-image: url(../images/more_icon01.png) }
  /*-機構*/
  #Header .menu li.menuother ul>li ul { top: 0; left: 150px; width: auto; border: none; box-shadow: none; padding: 0; margin: 0 230px 0 10px; background-color: #fff; }
  #Header .menu li.menuother ul>li:first-child ul { display: block }
  #Header .menu li.menuother ul>li ul li { float: left; width: 23% }
  #Header .menu li.menuother ul>li ul li a { background-color: #fff }
  #Header .menu li.menuother ul>li ul li a:hover { background-image: url(../images/more_icon02.png); text-decoration: none; color: #C00; background-color: #fff; border-radius: 5px; }
  #Header .menu li.menuother ul>li .pic2 { position: absolute; top: 0; right: 20px !important }
  #Header .menu li.menuother ul>li .pic2 img { width: 200px }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #Header .menu>ul>li { margin: 0px 5px 0; }
}
@media (min-width: 768px) and (max-width: 991px) {
  #Header .menu { text-align: left; }
  #Header .menu ul { list-style: none; margin: 0px 0 0 0; padding: 0; }
  #Header .menu>ul>li { margin: 0px 0px 0; }
  #Header .menu>ul>li>a { padding: 10px 15px 5px 25px; }
}
@media (max-width: 767px) {
  #Header .menu { text-align: left; }
  #Header .menu ul { list-style: none; margin: 0px; padding: 0; overflow: hidden; font-size: 18px; line-height: 1.2; position: relative; z-index: 999; }
  #Header .menu a { display: block; padding: 10px 16px; transition: .4s; background-color: #2391ce; color: #fff; }
  #Header .menu a:hover { text-decoration: none }
  #Header .menu>ul { padding: 0; font-size: 18px; line-height: 20px; display: inline; }
  #Header .menu>ul>li { margin: 0px 10px 0; padding: 0; float: none; position: relative; }
  #Header .menu>ul>li>a:hover { background-color: #0e317a; }
  #Header .menu>ul>li>a { border-bottom: 1px solid #bbb; background-image: none }
  #Header .menu>ul>li.nav a { background-color: #54B0E2; color: #fff }
  /*-*/
  #Header .menu li.hasChild>a { padding-right: 50px; background-image: url(../images/menu_a_hasChild2.png); background-repeat: no-repeat; background-position: right 12px; }
  #Header .menu li.hasChild.closeThis>a { background-position: right -124px; }
  #Header .menu li li.hasChild>a { background-position: right 15px; }
  #Header .menu li li.hasChild.closeThis>a { background-position: right -102px; }
  #Header .menu ul ul { display: none; padding: 0px; font-size: 16px; margin: 0; width: auto }
  #Header .menu li li:first-child>a { border-top: 1px solid #bbb; }
  #Header .menu li li a { border-bottom: 1px solid #fff; padding: 10px 16px 10px 30px; background-color: #096ecb; color: #fff }
  #Header .menu li li li a { border-bottom: 1px solid #fff; padding: 10px 16px 10px 35px; background-color: #ccc; color: #333 }
  #Header .menu li li li li a { border-bottom: 1px solid #999; padding: 10px 16px 10px 55px; background-color: #fff; color: #333 }
}
/*-----------------------------------------------------------MainContent start----*/
.MainContent { margin: 0px; border-top: 3px solid #fff ; overflow: hidden;}
.more { clear: both; float: right }
.more a { display: block; padding: 10px 35px; background-color: #088acd; color: #fff; border-radius: 5px; position: relative; text-align: center }
.more a::after { content: "\E89D"; font-family: 'fontello'; font-size: 1em;  padding: 0 0 0 10px }
/*----------------------------------------------Block1 第一組----*/
.Block1 { background-color: #088acd; padding: 0; }
.Block1 .btn-more, .Block5 .btn-more {
  width: 33%;
  padding: 10px 20px;
  text-align: center;
  display: none;
  color: #fff;
  margin: 5px auto;
  position: absolute;
  left: 0; right: 0;
  background-color: #666;
}
@media (min-width: 1200px) {
}
@media (max-width: 1200px) and (min-width: 992px) {
}
@media (max-width:991px) {
  .Block1 { padding:0 ; }
}
@media (max-width:767px) {
  .Block1 { padding: 1.5em 0 10px 0; }
}
@media (max-width: 767px) {
  .Block1 .row { padding-left: 0px; padding-right: 0px; }
}
/*-fb*/
.fbblock { width: 293px; height: 360px; display: block; padding: 0; background-color: #fff; float: right }
.fbblock iframe { width: 293px; height: 360px; margin: 0 auto }
@media (max-width: 1200px) and (min-width: 992px) {
	.fbblock { width: 293px; height: 296px;  float: right; overflow:hidden }
	.fbblock iframe { width: 293px; height: 296px; margin: 0 auto }
}
@media (max-width:991px) {
  .fbblock { margin: 20px auto; float: none }
}
@media (max-width: 767px) {
  .Block1 .col-md-8 { padding-left: 0px; padding-right: 0px; }
}

/*----------------------------------------------Block2 第二組----*/
.Block2 { background: #f8f5e7;text-align: center; padding:1em 0 3em 0;  }
/*-七項福利*/
.welfare h2,.Information h2 , .affiliated h2, .statistics h2{ 
	color: #198dce;position: relative;
	text-align: center; font-size: 2em;margin:1em auto;
}
.welfare h2:after,.Information h2:after, .affiliated h2:after, .statistics h2:after{
	width: 300px; display:block; content:'';margin:0 auto; border-bottom: 2px solid #198dce; 
  position: absolute; bottom:-15px;left:0; right:0; background-color: #fff; };
  .welfare_list { overflow: hidden; text-align: center; display: inline-block; background-color: #f8f5e7;  margin: 0 auto 20px auto; }
  .welfare_list li h3 { text-align: center; font-size:1.2em; text-decoration: none; color: #198dce; font-weight: bold; }
  .welfare_list li:nth-child(even) h3 {color:#b28dce; }
  .welfare_list { margin: 1em auto; padding: 0 }
  .welfare_list li {position: relative; vertical-align: top;width: 12%; display: inline-block; margin:0 1% 0 0; }
  .welfare_list .more a { display: block; padding: 0px 20px 10px; background-color: transparent; color: #440062; border-radius: 5px; position: relative; text-align: right; font-weight: bold }
  .welfare_list .more a:after { content: ">"; width: 15px; height: 12px; }

  .welfare_list li .circled ,
  .welfare_list li:nth-child(even) .circled {
   width: 125px;
   height: 125px;
   line-height: 125px;
   border-radius: 50%;
   color: #5bc0de;
   text-align: center;
   margin: 20px auto;
   background-color: #198dce;
   border: 2px solid #198dce;
   -webkit-background-size: 50%;
   background-size: 60%;
   background-repeat: no-repeat;
   background-position: center center;
   transition: .3s ease-out;
   position: relative; 
 } 
 .welfare_list li .circled:hover {
   background-color: #fff;
   border: 2px solid #198dce;
 }
 .welfare_list li .circled a{ 
  content: ''; position: absolute; display: block;width: 125px;
  height: 125px; }

  .welfare_list li:nth-child(even) .circled {
    background-color: #b28dce;
    border: 2px solid #b28dce;
  } 
  .welfare_list li:nth-child(even)  .circled:hover {
   background-color: #fff;
   border: 2px solid #b28dce;
 }

 .icon1{background:url(../images/icon1.png);}
 .icon2{background:url(../images/icon2.png);}
 .icon3{background:url(../images/icon3.png);}
 .icon4{background:url(../images/icon4.png);}
 .icon5{background:url(../images/icon5.png);}
 .icon6{background:url(../images/icon6.png);}
 .icon7{background:url(../images/icon7.png);}

 .icon1:hover{background:url(../images/icon1-hover.png);}
 .icon2:hover{background:url(../images/icon2-hover.png);}
 .icon3:hover{background:url(../images/icon3-hover.png);}
 .icon4:hover{background:url(../images/icon4-hover.png);}
 .icon5:hover{background:url(../images/icon5-hover.png);}
 .icon6:hover{background:url(../images/icon6-hover.png);}
 .icon7:hover{background:url(../images/icon7-hover.png);}

 .affiliated{margin:2em 0;}
 .affiliated h2{color:white; text-shadow: 1px 1px 5px rgba(0,0,0,0.4)}
 .affiliated h2:after{ 
  border-bottom: 2px solid #fff;
}

.affiliated p{font-size: 1.1em;line-height: 1.6em; color: #fff; }
.affiliated_list{margin:1em auto; text-align: center;}
.affiliated_list li{
	width: 17%;
	vertical-align:top;
	margin-right:15px;
  position: relative;
  display: inline-block; 
  border-radius: 15px;
  background-repeat: no-repeat;
  background-position: center center;
}
.affiliated_list li .circled {
  text-align: center; font-size: 1em; text-decoration: none;
  width: 165px;
  height: 165px;
  position: relative;
  overflow: hidden;
  margin:1em auto;
  border-radius: 15px;
  transition: .3s ease-out;
  border:2px solid rgba(255,255,255,0.5);
}
.affiliated_list li .circled  img{ 
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: block;
  z-index:1;
  margin: auto;
  width: 165px;
  height: 165px;
  overflow: hidden;
  border-radius: 15px;

}
.affiliated_list li .circled img:hover{
  transform: scale(1.05, 1.05); border-radius: 15px;
}

.affiliated_list li .circled:before{
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  content: '';
  z-index: 9;
  display: block;
  background:rgba(0,0,0,0.5);
  opacity: 1;
  width: 165px;
  height: 165px;
  overflow: hidden;
}

.affiliated_list li .circled:hover:before{
 opacity: 0; border-radius: 15px;
}

.affiliated_list li h3 {
  position: absolute;top:0; left:0; right:0;  line-height: 1.5em;
  z-index: 99; padding: 50px 15px 0 15px;font-size: 1.35em ; margin:10px auto; 
}
.affiliated_list li h3 a{color:#fff;  text-shadow: 0 0px 5px #333, 0 0px 5px #333;}
.affiliated_list li .circled.unit1{background:url(../images/aff-photo1.jpg); }
.affiliated_list li .circled.unit2{background:url(../images/aff-photo2.jpg); }
.affiliated_list li .circled.unit3{background:url(../images/aff-photo3.jpg); }
.affiliated_list li .circled.unit4{background:url(../images/aff-photo4.jpg); }
.affiliated_list li .circled.unit5{background:url(../images/aff-photo5.jpg); }
.affiliated_list li .circled.unit6{background:url(../images/aff-photo6.jpg); }


@media (min-width: 768px) and (max-width: 991px){

  .affiliated_list{padding:0;}
  .affiliated_list li{width: 30%; margin-bottom: 20px;}
  .welfare_list li { width: 30%;}
  .welfare_list li .circled,
  .welfare_list li:nth-child(even) .circled{ width: 145px; height: 145px;}

}
@media (max-width:767px) {
  .movie { height: auto ;}
  .affiliated_list{padding:0;}
  .affiliated_list li{width: 40%;margin-bottom: 20px;}
  .welfare_list li { width: 45% ;}
  .welfare_list li .circled,
  .welfare_list li:nth-child(even) .circled{ width: 165px; height: 165px;}


}

@media (max-width:480px) {
  .welfare_list li{width: 45%;margin-bottom: 20px;}
  .welfare_list li a .circled{ width: 120px; height: 120px;}
  .welfare_list li .circled,
  .welfare_list li:nth-child(even) .circled{ width: 120px; height: 120px;}
  .affiliated_list li{width: 45%;margin:0; margin-bottom: 20px;}
  .affiliated_list li .circled{  width: 130px; height: 130px;}
}


/*----------------------------------------------Block4 第四組----*/
.Block4{ 
  background:#66c9bd url(../images/affiliated-bg.jpg) no-repeat center center;
  -webkit-background-size: cover;
  background-size: cover;
  min-height: 400px;padding: 50px 0
}

/*相關資訊*/
.Information { margin: 3em 0 4em 0; overflow: hidden;}

.Information .more, .statistics .more  { margin: 5px 0px 15px 0; display: block; }
.Information .more a { background-color: #088acd; border: 1px solid #fff }
/*宣導影片*/
.movie { background-color: #113d98; color: #fff; overflow: hidden; height: 420px; border-radius: 5px; }
.movie p { margin: 10px 15px; font-size: 1.125em }

}


/*----------------------------------------------Block5 第五組----*/
.Block5 { background-color: #fff; padding: 0px 0 50px }
/*統計指標*/
.statistics { padding: 15px 0; overflow: hidden;  margin: 0px; position: relative; display: block; clear: both; }
.statistics h2{color:black;}
.statistics h2:after{ border-bottom: 2px solid black;}
.statistics .tabContent { height:320px; overflow:auto; float:left; text-align: center;padding:5px; border:1px solid #ddd; border-radius: 5px; }

/*相關資訊*/

.Block5 .Information {position: relative; margin: 0 0 30px 0; }
.Block5 .Information h2 { color: #333; font-size: 1.875em; border-bottom: 7px solid #113d98; padding: 0 0 10px 0;  }
.Block5 .Information h2:after{display: none;}
.Block5 .Information .more { position: absolute;bottom:5px;right: 5px; }
.Block5 .Information .more a { background-color: #113d98; border: 1px solid #fff }

/*相關連結*/
.linkbox{margin:3em 0;}
.Information .link { border: 1px solid #CCC;min-height: 354px; border-radius: 5px; padding: 5px; overflow: hidden; margin: 0px; }
.Information .link ul {list-style: disc; margin: 1em 0;  }
.Information .link ul li { list-style: disc; margin: 0 10px 0 0; font-size: 1.1em;}
.Information .link ul li a { display: block; padding: 5px;   }
.Information .link ul li a:hover { background-color: #f5e5cb; }

/*adbanner*/
.adbanner { background-color: #e6e6e6; padding: 25px 20px 25px 60px; }
.adbanner div { margin: 0 15px 0 0; }
.adbanner div img { width: 150px; height: 50px }
.adbanner a:focus>img { border: 1px solid #09F }
.slick-prev { left: 15px }
.slick-next { right: 20px }
.slick-prev:before, .slick-next:before { font-size: 30px; opacity: .75; color: #666; }
@media (max-width: 768px) {
  .Block5 .Information .link {min-height: auto;overflow: inherit;}
  .Block5 .Information .more{position: inherit;}
}

@media (max-width: 420px) {
  .adbanner div { margin: 0 20px 0 15px; }
}
@media (max-width: 350px) {
  .adbanner div { margin: 0 20px 0 5px; }
}
/*----------------------------------------------Block6 第六組----*/
.Block6 { background-color: #E2E2E2; padding: 30px 0 0 }


.FatFooter_block { }
/*----------------------------------------------Block7 第七組----*/
.Block7 { background-color: #EEEEEE; padding: 30px 0 10px }
/*-*/
.footer_logo { float: left }
/*--分享社群-*/
.sharedata { overflow: hidden; float: right }
.sharedata ul { margin: 0 0 20px 0; padding: 0; display: block }
.sharedata ul li { display: inline-block; list-style-type: none; margin: 0 8px 0 0 }
.sharedata ul li a { width: 50px; height: 50px; display: block; background-repeat: no-repeat; background-position: top center; }
.sharedata p { clear: both; float: none; line-height: 1em }
.sharedata p span { margin: 0 0 0 5px }
@media (max-width:767px) {
  .footer_logo { float: none; margin: 0 0 20px 0 }
  .sharedata { float: none; }
  .sharedata ul { margin: 0; }
}
@media (max-width:480px) {
  .footer_logo img { width: 90% }
  .sharedata ul li { margin: 0 3px 0 0 }
}
/*----------------------------------------------Footer----*/
/*-*/
#Footer { background-color: #fff; padding: 20px 0; }
#Footer p { color: #333; margin: 0 }
#Footer a { color: #6abec1; text-decoration: none }
/*-copyright*/
#Footer .copyright { margin: 0 0 15px 0 }
#Footer .copyright ul { margin: 0px; padding: 0; }
#Footer .copyright ul li { display: inline-block; background-image: url(../images/copyright_icon01.gif); background-repeat: no-repeat; background-position: left center; padding: 0 0 0 10px; margin: 0 10px 0 0; border: none }
#Footer .copyright ul li:first-child { background-image: none; padding: 0 }
#Footer .copyright ul li a { color: #113d98; border: none }
#Footer .copyright ul li a:hover { text-decoration: underline; }
/*-說明*/
#Footer .explanation { color: #fff; float: left; padding: 0 40px 0 0; margin: 0 0 40px }
/*-標章*/
.Mark { padding: 0; margin: 0px; display: block; overflow: hidden; float: right }
.Mark ul { margin: 0; padding: 0 }
.Mark ul li { float: left; margin: 0 0px 15px 15px; padding: 0 }
.visitor { clear: both; float: right }
.visitor ul { margin: 0; padding: 0; }
.visitor ul li { margin: 0 0 5px 0; padding: 0 0 0 13px; background-image: url(../images/link_icon01.png); background-repeat: no-repeat; background-position: 0 7px; }
@media (max-width:991px) {
  .Mark, .visitor { float: none; clear: both }
  .Mark ul li { float: left; margin: 0 15px 15px 0px; padding: 0 }
}
/*-------------------------------------------------------------*/
@media (max-width: 767px) {
  .Block2, .Block3, .Block4, .Block5, .Block6, .Block7 { padding: 20px 0; }
}
/*------------------------------------------------------------------------內頁開始*/
.Block_incontent { background-color: #fff; padding: 30px 0 0 }
.Block_incontent a{  color:#113d98; }
.Block_incontent a:hover{  color:#c00; text-decoration: underline;}
@media (max-width: 767px) {
  .Block_incontent { padding: 30px 0 }
}
.Block_incontent h1 { font-size: 1.687em; color: #113d98; padding: 0px 0px 6px; margin: 0 0 20px 0; clear: both; line-height: 140%; border-bottom: 1px solid #113d98; font-weight: 700 }
/*---左欄inmenu*/
.Block_incontent .inmenu { border-radius: 5px; box-shadow: 0 0 5px #999; position: relative; margin: 0px 0 15px 0; background-color: #fff; border: 5px solid #fff; }
.Block_incontent .inmenu a.accesskey { color: #167b9a; text-decoration: none; }
@media (max-width:991px) {
  .Block_incontent .inmenu { display: none }
}
.Block_incontent .inmenu h1 { font-size: 1.375em; background-color: #167b9a; color: #fff; padding: 8px 10px; border-radius: 5px 5px 0 0; position: relative; margin: 0 0 0px 0; text-align: center; }
.Block_incontent .inmenu ul { margin: 0; padding: 0; }
.Block_incontent .inmenu ul li { list-style-type: none; margin: 0; padding: 0; font-size: 1.063em; }
.Block_incontent .inmenu ul li a { border-bottom: 1px solid #CCC; padding: 10px 20px; display: block; text-decoration: none; }
.Block_incontent .inmenu ul li a:hover { background-color: #EAEAEA; text-decoration: none; }
.Block_incontent .inmenu ul li:last-child a { border-radius: 0 0 5px 5px; border-bottom: none; }
/*-*/
/*.inmenubtn{ border-radius:5px; font-size: 1.375em; background-color: #167b9a; color: #fff; padding: 8px 15px; width:100px; margin:0 0 5px 0;  position:relative}
.inmenubtn::after{content:""; position:absolute; top:15px; right:10px; width:20px; height:10px;background-image: url(../images/menu_icon01.gif); background-position:right center; background-repeat:no-repeat}*/
/*--------------------------------------------------------------------右欄*/
/*----麵包屑*/
.breadcrumb { background-color: transparent; margin: 0 0 30px; padding: 0; }
@media (max-width:991px) {
  .breadcrumb { margin: 0 0 20px; }
}
/*--------------------------------------------------------- FontSize*/
.FontSize {
  font-size: 1.4em;  float: right; margin-top: -10px;}
  .FontSize ul {
    float: right;
    margin-top: -35px;
  }
  .FontSize ul li {
    list-style: none;
    display: inline-block;
    cursor: pointer;
    color: #cccccc;
    vertical-align: middle;
  }
  .FontSize ul li a {
    font-weight: normal;
    color: #fff;
    font-size: 0.8em;
    display: block;
    padding: 0;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    line-height: 30px;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
    background-color: #60c4f2;
  }
  .FontSize ul li a:hover,.FontSize ul li a:focus{ 
    background-color: #2c9dd8; text-decoration: none; color:#fff; }


    /*------------------------------------------bottomfunction*/
    .bottomfunction { background-color: #f1f1f1; overflow: hidden; padding: 15px 10px 15px 20px; }
    .bottomfunction .share2 { float: left; width: 320px }
    .bottomfunction .share2 span { float: left; margin: 8px 10px 0 0px }
    .bottomfunction .share2 ul { margin: 0; padding: 0; }
    .bottomfunction .share2 ul li { margin: 0 5px 0 0; float: left; }
    .bottomfunction .share2 ul li img { width: 35px; height: 35px }
    .bottomfunction .share2 ul li a { display: block; background-color: #999; border-radius: 5px; }
    .bottomfunction .share2 ul li a.fb { background-color: #3b5997 }
    .bottomfunction .share2 ul li a.google { background-color: #df2f2f }
    .bottomfunction .share2 ul li a.twitter { background-color: #55acec }
    .bottomfunction .share2 ul li a.line { background-color: #00c214 }
    .bottomfunction .share2 ul li a.forward { background-color: #87cd27 }
    .bottomfunction .share2 ul li a.print { background-color: #5c64b5 }
    .bottomfunction .data { float: right; margin: 8px 0 0; }
    .bottomfunction .data ul { margin: 0; padding: 0; }
    .bottomfunction .data ul li { margin: 0 15px 0 0; display: inline; border-right: 1px solid #999; padding: 0 15px 0 0 }
    .bottomfunction .data ul li:last-child { border-right: none; margin: 0; }
    .bottomfunction .data ul li a { color: #333; text-decoration: none }
    .bottomfunction .data ul li a:hover { color: #C00; text-decoration: underline }
    @media (max-width:991px) {
      .bottomfunction .share2 { clear: both; margin: 0 0 20px 0 }
      .bottomfunction .data { clear: both; float: none }
    }
    @media (max-width:550px) {
      .bottomfunction .data ul li { display: block; border: none; margin: 0 0 7px 0; background-image: url(../images/link_icon01.png); background-repeat: no-repeat; background-position: 0 7px; padding: 0 0 0 15px; }
    }
    @media (max-width:350px) {
      .bottomfunction .share2 span { margin: 3px 10px 0 0px }
      .bottomfunction .share2 ul li img { width: 32px; height: 32px }
    }
    /*--------------------------------------------------------- np*/
    .np { position: relative }
    .np p{ padding:10px; background-color:#E9E9E9}
    /*-*/
    .nplist{ margin:0 0 50px ; padding:0}
    .nplist li{ margin: 0 0 10px 0; padding: 7px 0 7px 40px; border-bottom: 1px  solid #ccc; background-image:url(../images/link_icon01.png); background-repeat:no-repeat; background-position:13px 13px  } 
    .nplist li a{ display:block}
    .nplist li ul{ margin:20px 0; padding:0}
    .nplist li ul li{ background-image: url(../images/np_icon01.gif); background-position:0 18px; border:none; padding: 7px 0 7px 30px;}
    /*-*/
    .nplist2{ margin:0  auto 50px; padding:0 ; overflow:hidden ; text-align:center}
    .nplist2 li{ margin: 0 5px 10px 0;  border: 1px  solid #ccc; width:23%; display:inline-block; text-align:left } 
    .nplist2 li a{ display:block; padding: 10px;}
    .nplist2 li a:hover{ background-color:#FFC}
    @media (max-width:991px){
     .nplist2 li{width:48%;}
   }
   @media (max-width:520px){
     .nplist2 li{width:100%;}
   }


   /*--------------------------------------------------------- lp*/
   .lp { position: relative }
   /*----------------------------------------------------分類*/
   .category { clear: both; margin: 0 0px 20px; }
   .category h3 { font-size: 1.06em; float: left; margin: 5px 0 0; padding: 0; display: none; }
   .category ul { list-style: none; margin: 0; padding: 0; font-size: 1.06em; overflow: hidden; _width: 98%; }
   .category li { line-height: 110%; float: left; margin: 0 6px 6px 0; padding: 0; background-position: right top; *white-space:nowrap;
   }
   .category li a { display: inline-block; padding: 8px 12px 8px; text-decoration: none; background-color: #fff; color: #000; border-radius: 5px; position: relative; border: 1px solid #999 }
   .category li a:hover { text-decoration: none; color: #fff; background-color: #00aff0; }
   .category li.here, .category li.here a { cursor: default; color: #fff; background-color: #00aff0; border-radius: 5px; behavior: url(js/PIE.htc); position: relative; }
   .category li.here { background-position: right -40px; }
   .category li.here a { background-position: 0 -40px; }
   /*-----------------------------------------------topfunction*/
   .topfunction { position: absolute; top: 10px; right: 0 }
   .topfunction ul { margin: 0; padding: 0 }
   .topfunction ul li { float: left; margin: 0 0 0 15px }
   .topfunction ul li a { display: block; padding: 0 0 0 25px; }
   .topfunction ul li a.rss { background-image: url(../images/icon_rss.png); background-repeat: no-repeat; background-position: 0 1px; }
   .topfunction ul li a.condition { background-image: url(../images/icon_condition.png); background-repeat: no-repeat; background-position: 0 1px; }
   @media (max-width:767px) {
    .topfunction { position: static; float: right; margin: 0 0 15px 0 }
  }
  /*---------------------------------------------------- page 分頁 */
  .page { color: #999;clear: both; margin: 5px 0 50px; padding: 0; overflow: hidden; font-size: 1em; line-height: 100%; position: relative; text-align: center }
  .page span { display: inline-block; margin: 10px 8px 0 0; }
  .page em { font-weight: bold; font-style: normal; letter-spacing: 0; margin: 0 3px; color: #00aff0; }
  .page select { font-weight: bold; font-family: Verdana, Geneva, sans-serif; vertical-align: middle; margin: 0 3px 5px; }
  .page option { font-weight: bold; font-family: Verdana, Geneva, sans-serif; }
  /* 1 2 3 4 5 */
  .page ul.number { list-style: none; overflow: hidden; margin: 0px 8px 0 0; padding: 0; line-height: 100%; vertical-align: middle; display: inline-block; }
  .page ul.number li { margin: 0px; padding: 0; float: left }
  .page ul.number li a { padding: 10px 16px; border: 1px solid #bbb; color: #666; text-decoration: none; display: block; margin-left: -1px; cursor: pointer; }
  .page ul.number li:first-child a { margin-left: 0px; border-radius: 5px 0 0 5px }
  .page ul.number li:last-child a { border-radius: 0 5px 5px 0 }
  .page ul.number li a:hover { color: #00aff0; text-decoration: none; background-color: #E9E9E9 }
  .page ul.number li.here a { color: #fff; font-weight: bold; background: #00aff0; cursor: default; }
  .page .items { display: inline-block; }
  .page .items a { padding: 0 5px;color:#02a9ef; }
  @media (max-width:991px) {
    .page .data, .page .items { display: none }
  }
  /*--------------------------------------------list01*/
  .list01 { clear: both; margin: 0px 0 30px; float: none }
  .list01 ul { margin: 0; padding: 0 }
  .list01 ul li { margin: 0 0 10px 0; padding: 7px 0 7px 45px; border-bottom: 1px dotted #666; }
  .list01 ul li a {  color: #113d98;}
  .list01 ul li span { margin: 0 5px; color: #00aff0; }
  .list01 ul li span.number { width: 20px; margin: 0 15px 0 -35px; display: inline-block; color: #000; text-align: right; }
  /*----------------------------------------------------listTb--*/
  .listTb { clear: both; margin: 0 0 30px; padding: 0 1em; }
  .listTb table { width: 100%; border: 1px solid #fff; margin-bottom: 20px; }
  .listTb table tr th { padding: 10px ; color: #333; background-color: #E6E6E6; border: 1px solid #CCC; border-bottom-width: 2px; border-bottom-color: #ddd; text-align: center }
  .listTb table tr th:last-child,.listTb table tr th:nth-child(2){width: 18%;}
  .listTb table tr td { padding: 10px ; text-align: left; border: 1px solid #CCC; }
  .listTb table tr td.title { color: #fff; background: #a487ca; }
  .listTb table tr td.date { color: #fff; background: #BB9BC7; }
  .listTb table tr td.price { color: #333; background: #efefef; }
  .listTb table tr td.type { color: #284da1; width: 15%; }
  .listTb table tr td.info { width: 50%; }
  .listTb table .aCenter { text-align: center; }
  .listTb table .aRight { text-align: right; }
  .listTb table td .map { margin: 0 10px 0 0 }
  .listTb table td .map img { vertical-align: middle }
  /*-----------------------------------------------listTb*/
  .listTb a{ color: #337ab7; text-decoration:underline; }
  #htmlpage .img-photo{ float: left;margin-right: 8px; max-width: 300px; }
  .iconMap{width: 30px;}

  @media (max-width: 767px) {
    .listTb table { width: 100%; }
    .listTb table tr { margin: 0 0 20px 0; display: block; }
    .listTb table tr th { display: none; }
    .listTb table tr td { display: block; width: 100%; margin: -1px 0 0 0 }
    .listTb table tr td:nth-child(1) { width: 100%; }
    .listTb table tr td:nth-child(2) { width: 100%; }
    .listTb table tr td:before { content: attr(data-title) "："; display: inline-block; color: #2792ce }
    .listTb table tr td:empty { display: none; }
    .listTb table tr td.title { color: #fff; background: #a487ca; }
    .listTb table tr td.date { color: #fff; background: #BB9BC7; }
    .listTb table tr td.price { color: #333; background: #efefef; }
    .listTb table .aCenter { text-align: left; }
    .listTb table .aRight { text-align: left; } 
  }


  /*-----------------------------------------------listphoto01圖片燈箱*/
  .listphoto01 { text-align: center; margin-left: auto; margin-right: auto; }
  @media (max-width: 768px) {
    .listphoto01 { width: 90%; }
  }
  .noscroll { overflow: hidden; }
  .listphoto01 h3 { margin: 0; padding: 0; font-size: 1em; text-align: left }
.single-portfolio { height: 200px; margin-bottom: 40px;/* outline:1px solid #CCC; */ }
.single-portfolio a { display: block; width: 100%; height: auto; overflow: hidden; margin: 0 0 10px 0; }
@media (max-width: 767px) {
  .single-portfolio { height: 300px; margin-bottom: 40px; }
  .single-portfolio a { height: 250px; }
}
@media (max-width:450px) {
  .single-portfolio { height: auto; margin-bottom: 40px; }
  .single-portfolio a { height: auto; }
}
.single-portfolio img { width: 100%; opacity: .8; display: block; box-sizing: border-box; transition: .3s ease-out; }
.single-portfolio img:hover { width: 100%; opacity: 1; transform: scale(1.05, 1.05); }
/*.full { -webkit-overflow-scrolling: touch;  position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background: RGBA(0, 0, 0, .9); z-index: 999999999; overflow-y: scroll; text-align: center; padding: 0px; color: #FFF; display: none; }
.full img { max-width: 1000px; margin: 0px auto; opacity: 1; position: relative; z-index: 99999999999; }
.full img:hover { transform: none; opacity: 1; }
@media (max-width:767px) {
.full img { margin-top: 80px; }
}
.full .close { position: fixed; padding: 7px; top: 10px; right: 10px; cursor: pointer; opacity: .5; transition: .3s ease-out; z-index: 99999; }
.full .close { width: 50px !important; height: 50px !important; margin: 0px; color: #FFF; font-size: 36px; }
 @media (max-width: 992px) {
.full .close { width: 40px; height: 40px; }
}
.full .close:hover { opacity: 1; }
.full .out { position: fixed; background: transparent; display: block; width: 100%; height: 100%; top: 0px; left: 0px; z-index: 1; }*/

/*------------------------------考試資訊 */
.examdata { background-color: #5174c0; border-radius: 5px; padding: 15px; margin: 0 0 20px 0 }
.examdata h2 { color: #fff; margin: 0px 0 15px 0; padding: 0; text-align: center; font-size: 1.375em }
.examdata ul { background-color: #fff; border-radius: 5px; margin: 0; padding: 10px }
.examdata ul li { background-image: url(../images/service_icon01.png); background-repeat: no-repeat; background-position: 0 12px; padding: 5px 0 5px 15px; margin: 0; line-height: 1.3em }
/*------------------------------相關網站、申辦類別*/
.related_website, .bigsort { background-color: #5d4eae; border-radius: 5px; padding: 15px; margin: 0 0 20px 0 }
.related_website h2, .bigsort h2 { color: #fff; margin: 0px 0 15px 0; padding: 0; text-align: center; font-size: 1.375em }
.related_website ul, .bigsort ul { margin: 0; padding: 0 }
.related_website ul li, .bigsort ul li { margin: 0 0 7px 0; line-height: 1.3em }
.related_website ul li a, .bigsort ul li a { background-color: #fff; border-radius: 5px; margin: 0; padding: 10px; display: block }
/*------------------------------申辦對象 */
.bidbeau { background-color: #ef857a; border-radius: 5px; padding: 15px; margin: 0 0 20px 0 }
.bidbeau h2 { color: #fff; margin: 0px 0 15px 0; padding: 0; text-align: center; font-size: 1.375em }
.bidbeau ul { margin: 0; padding: 0 }
.bidbeau ul li { margin: 0 0 7px 0; line-height: 1.3em }
.bidbeau ul li a { background-color: #fff; border-radius: 5px; margin: 0; padding: 10px; display: block }
/*--------------------------------------------------------- cp*/
.cp { position: relative }
/*----------------------------------------------------info*/
.cp article ul.info { margin: 10px 0 20px; padding: 0; clear: both; float: none }
.cp article ul.info li { display: inline-block; margin: 0 20px 0 0; padding: 0; list-style-type: none; }
.cp article ul.info li span { color: #088acd; margin: 0 5px }
/*-*/
/*----------------------------------------------------cp內容*/
.cp article { clear: both; margin: 0 0 30px; padding-bottom: 10px;  float: none; overflow: hidden; }
.cp article h2, .cp article h3, .cp article h4, .cp article h5, .cp article h6 { clear:both;margin: 0.5em 0 }
.cp article h2 { font-size: 1.562em; color: #088acd }
.cp article h3 { font-size: 1.23em; color: #1a60be; }
.cp article h4 { font-size: 1.15em; color: #766FBE;}
.cp article h5 { font-size: 1.08em; }
.cp article h6 { font-size: 1em; }
.cp article h2+h3, .cp article h3+h4, .cp article h4+h5, .cp article h5+h6 { margin-top: 0; }
.cp article { line-height: 165%; margin: 0 0 70px 0; }
.cp article p { line-height: 165%; margin: 0 0 20px 0 }
.cp a { color: #2792ce; text-decoration: underline; }
.cp a:hover { color: #F00; text-decoration: underline; }

/*------------------------------------文章內主圖 */
.cp article figure.image_right { float: right; margin: 0px 0px 20px 30px; width: 400px; letter-spacing: 0; border-radius: 5px; background-color: #fff; }
.cp article figure.image_left { float: left; margin: 0px 30px 0px 0px;padding:0; width: 400px; letter-spacing: 0; }
.cp article figure.image_right img, .cp article figure.image_left img{ display: block; width: 400px; transition: .3s ease-out; }
.cp article figure.image_right img:hover, .cp article figure.image_left img:hover{ transform: scale(1.05, 1.05) }
.cp article figure.image_right figcaption, .cp article figure.image_left figcaption { margin: 10px 0; line-height: 140%; width: auto; max-width: 400px; color: #113d98 }
@media (max-width:767px) {
  .cp article figure.image_right, .cp article figure.image_left { width: 100%; letter-spacing: 0; float:none;  margin: 0px 0px 20px 0; }
  .cp article figure.image_right img, .cp article figure.image_left img { width: 100%; }
  .cp article figure.image_right figcaption, .cp article figure.image_left figcaption { max-width: 100%; }
}
/*- 燈箱效果修正*/
.lb-data .lb-caption { font-size: 18px; line-height: 1.5em; font-weight: normal }
/*-相關照片*/
.photolist { margin: 0; padding: 0; }

.photolist figure div,.AP-Photo figure { overflow: hidden; background: #e8e8e8; position: relative; border:2px solid #ddd; }
.photolist figure div:after, .AP-Photo figure:after { padding-top: 65%; content: ""; display: block; }
.photolist figure div img, .AP-Photo figure img { position: absolute; top: 0; bottom: 0; right: 0; left: 0; max-width: 100% !important;max-height: 100% !important;  margin: auto;  object-fit: cover; opacity: .8; transition: .3s ease-out; }
.photolist figure div img:hover,.AP-Photo figure img:hover { opacity: 1; transform: scale(1.05, 1.05); }
.photolist figure figcaption { margin: 10px 0; line-height: 140%; width: auto; color: #333;font-size: 1em; height: 45px;overflow: hidden; }
.photolist figure a{
  display: block;
}
.photolist figure a:hover div,.photolist figure a:focus div{
  border: 2px solid #60c4f2;
}
@media (max-width:767px) {
  .photolist figure { height: auto }
  .photolist .row { padding-left: 0px; padding-right: 0; }
  .photolist figure div:after { padding-top: 67%; }
  .photolist figure figcaption {height: inherit; overflow: inherit; }
}
/*- 燈箱效果修正*/
.lb-data .lb-caption { font-size: 18px; line-height: 1.5em; font-weight: normal }

/*----附件下載*/
.download {clear: both; }
/*table*/
.cp article table { margin: 0 auto 2em; width: 100%; line-height: 150%; border-collapse: collapse; background-color: #fff }
.cp article table.noBorder { width: auto; margin: 0 0 1em; background-color: transparent }
.cp article table caption { font-weight: bold; text-align: left; font-size: 1em; padding: 5px 10px 4px; }
.cp article th, .cp article td { vertical-align: top; padding: 10px 7px; border: 1px solid #CCC; }
.cp article .noBorder th, .cp article .noBorder td { border: none; padding: 10px 7px; }
.cp article th { background-color: #E6E6E6; }
.cp article th[scope="row"] { text-align: right; vertical-align: top; width: 15%; }
.cp article th[scope="col"] { text-align: center; vertical-align: middle; }
.cp article td a { color: #333 }
/*--------------------------------------------------------cpTb*/
.cpTb { }
.cpTb table { border-collapse: collapse; width: 100%; clear: both; margin: 0 0 20px; color: #313131; background-color: #fff }
.cpTb table caption { display: none; }
.cpTb table th { background-color: #e6e6e6; color: #000; text-align: right; padding: 10px ; border: 1px solid #ccc; white-space: nowrap; font-weight: normal; width: 20%; }
.cpTb table td { color: #313131; border: 1px solid #CCC; padding: 10px ; position: relative; word-break: break-all }
.radio { margin: 0; display: inline; }
.cpTb table td a { color: #006699; text-decoration: none; }
.cpTb table td a:hover { color: #CC0000; text-decoration: none; }
.cpTb table input { vertical-align: middle; margin: 0 0px 0 0; font-size: 100%; }
.cpTb table td .text2 { border: 1px solid #ccc; }
.cpTb table td .text { width: 100%; border: 1px solid #ccc; padding: 0 3px; }
.cpTb table td textarea { width: 100%; border: 1px solid #ccc; padding: 0 3px }
.cpTb table td ul { margin: 0 0 0 30px; padding: 0 }
.cpTb table td ul li { margin: 0 0 10px 0; list-style-type: disc }
@media only screen and (max-width: 480px) {
  .cpTb table, .cpTb thead, .cpTb tbody, .cpTb th, .cpTb td, .cpTb tr { display: block; }
  .cpTb table { border: none; border: 1px solid #ccc; }
  .cpTb table tr { border-bottom: none; margin: 0; }
  .cpTb table td { border: none; border-bottom: 1px solid #ccc; position: relative; padding-left: 2%; word-break: break-all }
  .cp .cpTb table th { width: 100%; text-align: left; border: none; border-bottom: 1px solid #ccc; padding: 10px 7px; }
  .cpTb table td .text { width: 100%; }
  .cpTb table td textarea { width: 100%; }
}
/*---ul , ol*/
.cp article ul, .cp article ol { margin: .5em 2em 2em; padding: 0; }
.cp article ul li { margin: 0 0 .2em 0; list-style-type:disc}
.cp article ol li { margin: 0 0 .2em 0; list-style-type:decimal }

/*------------------------------cp考試資訊*/
.cp .examdata h2 { color: #fff; margin: 0px 0 15px 0; padding: 0; text-align: center; font-size: 1.375em }
.cp .examdata ul { margin: 0; padding: 10px }
.cp .examdata ul li { padding: 5px 0 5px 15px; margin: 0; list-style-type:none }
.cp .examdata ul li a { color: #113d98; text-decoration: none }
.cp .examdata ul li a:hover { color: #2792ce; text-decoration: underline }
/*------------------------------cp相關網站、申辦類別*/
.cp .related_website h2, .cp .bigsort h2 { color: #fff; margin: 0px 0 15px 0; padding: 0; text-align: center; font-size: 1.375em }
.cp .related_website ul, .cp .bigsort ul { margin: 0; padding: 0 }
.cp .related_website ul li, .cp .bigsort ul li { margin: 0 0 7px 0; list-style-type:none }
.cp .related_website ul li a, .cp .bigsort ul li a { background-color: #fff; border-radius: 5px; margin: 0; padding: 10px; display: block; color: #333; text-decoration: none }
.cp .related_website ul li a:hover, .cp .bigsort ul li a:hover { color: #2792ce; text-decoration: underline }
/*------------------------------cp申辦對象 */
.cp .bidbeau h2 { color: #fff; margin: 0px 0 15px 0; padding: 0; text-align: center; font-size: 1.375em }
.cp .bidbeau ul { margin: 0; padding: 0 }
.cp .bidbeau ul li { margin: 0 0 7px 0 ;list-style-type:none}
.cp .bidbeau ul li a { background-color: #fff; border-radius: 5px; margin: 0; padding: 10px; display: block; color: #333; text-decoration: none }
.cp .bidbeau ul li a:hover { color: #C00; text-decoration: underline }
/*----gmap*/ 
.cp article .gmap { clear: both; margin: 15px auto; padding: 0; border: 1px solid #CCC; width: 100%; height: 500px; overflow: hidden; border-radius: 5px; }
.cp article .gmap iframe { width: 100%; height: 500px; }
/*-sketch剪影*/
.sketch { border: 1px solid #ccc; border-radius: 5px; padding: 20px; margin: 20px 100px 30px }
.sketch .wordbox { margin: 60px 0 20px }
.sketch .photomore { text-align: left; float: none; }
@media (max-width:1199px) {
  .sketch { margin: 20px 0px 30px }
}
.cp article .sketch .info { margin: 10px 0 0; padding: 10px 0; clear: both; border-top: 1px dotted #CCC; text-align: right }
.cp article .sketch .info li { display: inline-block; margin: 0 0 0 20px; padding: 0; list-style-type: none; }
.cp article .sketch .info li span { color: #333; margin: 0 5px }
/*linebutton-*/
.cp .linebutton { margin: -50px 0 15px 0; float: right }
.cp .linebutton ul { margin: 0; padding: 0 }
.cp .linebutton ul li { float: left; margin: 0 0 0 10px; padding: 0;list-style-type:none }
.cp .linebutton ul li a { display: block; background-color: #2291ce; color: #fff; text-decoration: none; padding: 8px 15px; border-radius: 5px; }
.cp .linebutton ul li a:hover { background-color: #2ea4e6; }
@media (max-width:480px) {
  .cp .linebutton { margin: 0px 0 15px 0; float: none; overflow: hidden }
  .cp .linebutton ul li { margin: 0 10px 0 0; }
}
/*-people*/
.cp .people { margin: 0 0 20px; padding: 0px; text-align: center }
.cp .people img { width: 180px; margin: 0 auto; border: 1px solid #ccc; padding: 10px; border-radius: 5px; box-shadow: 0 0 10px #ccc }
/*--------------------------------------------------------forward 、qp 、 form*/
.forwardForm h3, .qp h3 { margin: 0 0px 10px; font-size: 1.25em; font-weight: bold; color: #F90; }
.forwardForm table, .qp table { border-collapse: collapse; width: 100%; clear: both; margin: 0 0 20px; color: #313131; background-color: #fff }
.forwardForm table caption, .qp table caption { font-size:1.25em  }
.forwardForm table th, .qp table th { background-color: #e6e6e6; color: #000; text-align: right; padding: 10px ; border: 1px solid #ccc; white-space: nowrap; font-weight: normal; width: 20%; }
.forwardForm table td, .qp table td { color: #313131; border: 1px solid #CCC; padding: 10px; position: relative; }
.radio { margin: 0; display: inline; }
.forwardForm table td a, .qp table td a { color: #006699; text-decoration: none; }
.forwardForm table td a:hover, .qp table td a:hover { color: #CC0000; text-decoration: none; }
.forwardForm table input, .qp table input { vertical-align: middle; margin: 0 0px 0 0; font-size: 100%; }
.forwardForm table td .text2, .qp table td .text2 { border: 1px solid #ccc; }
.forwardForm table td .text, .qp table td .text { width: 100%; border: 1px solid #ccc; padding: 0 3px; }
.forwardForm table td textarea, .qp table td textarea { width: 100%; border: 1px solid #ccc; padding: 0 3px }
@media only screen and (max-width: 480px) {
  .forwardForm table, .forwardForm thead, .forwardForm tbody, .forwardForm th, .forwardForm td, .forwardForm tr, .qp table, .qp thead, .qp tbody, .qp th, .qp td, .qp tr { display: block; }
  .forwardForm table, .qp table { border: none; border: 1px solid #ccc; }
  .forwardForm table tr, .qp table tr { border-bottom: none; margin: 0; }
  .forwardForm table td, .qp table td { /* Behave  like a "row" */ border: none; border-bottom: 1px solid #ccc; position: relative; padding-left: 2%; }
  .forwardForm table th, .qp table th { width: 100%; text-align: left; border: none; border-bottom: 1px solid #ccc; padding: 7px; }
  .forwardForm table td .text, .qp table td .text { width: 100%; }
  .forwardForm table td textarea, .qp table td textarea { width: 100%; }
}

/*----------------------------------------------AP-Photo */
#ContentPage article .AP-Photo h2{font-size: 2em !important;position: relative; z-index:9;text-align: center; color:#087bc3 !important; font-weight: bold; margin: 5em auto 1em auto; }
#ContentPage article .AP-Photo h2:before{position: absolute; content: '';z-index: -1; height: 35px; width: 40%; left:30%; background: #fff !important;}
#ContentPage article .AP-Photo h2:after{ position: absolute; content: '';z-index: -2; top: 20px; left:0%; width: 100%; border-bottom: 1px solid #50a6dc; }

.AP-Photo .thumbnail h3{ text-align: center;  color:#088acd;
 width : 98%;  overflow : hidden;text-overflow : ellipsis; white-space : nowrap;}
 .AP-Photo .thumbnail p{ height: 220px;overflow: hidden;margin: 0; }
 .AP-Photo figure{border:none;}
 .AP-Photo figure:after{ padding-top: 56%;}

 #ContentPage article .AP-Photo figure img{ opacity:1; }

 @media (max-width:767px)  {
  .AP-Photo .thumbnail p{ height: auto;overflow: inherit; }
  #ContentPage article .AP-Photo h2{ margin:2em auto;}
  #ContentPage article .AP-Photo h2:before{height: 35px; width: 70%; left:15%;margin: 2em auto 1em auto; }
  #ContentPage article .AP-Photo h2:after{ top: 20px; left:0%; width: 100%;}
}

/*----------------------------------------------------------------------sitemap*/
.sitemap { }
.sitemap p { margin: 15px 0px; padding: 0px; color: #333333; line-height: 180%; }
/*------------------------------------------------------*/
.accesskeyDefine { margin: 10px 0px; padding: 0px; color: #333333; }
.accesskeyDefine li { background-image: url(../img/list_icon04.gif); background-repeat: no-repeat; background-position: 0px 7px; list-style-type: none; padding: 0 0 0 15px; margin: 0 0 10px 0; }
/*---------------------*/
.sitemap ul.cascading { list-style: none; margin: 30px 0; padding: 20px 10px 10px; }
.sitemap ul.cascading a { text-decoration: none; }
.sitemap ul.cascading a:hover { text-decoration: underline; }
.sitemap ul.cascading li { list-style: none; margin: 0 0 .3em; padding: 0; line-height: 125%; }
.sitemap ul.cascading>li { border-top: 3px solid #2792ce; width: 23%; display: inline-block; vertical-align: top; margin: 0 0px 10px 10px; padding-top: 10px; *width:auto;
  *border-top:1px solid #69c5d7;
}
@media (min-width:768px) and (max-width:1199px) {
  .sitemap ul.cascading>li { width: 31%; }
}
@media (min-width:600px) and (max-width:767px) {
  .sitemap ul.cascading>li { width: 31%; }
}
@media (min-width:480px) and (max-width:599px) {
  .sitemap ul.cascading>li { width: 47%; }
}
@media (max-width:479px) {
  .sitemap ul.cascading>li { width: 96%; }
}
.sitemap ul.cascading li li a { display: inline-block; margin: 0 0 .4em; padding: 0 0 0 2em; text-indent: -2em; }
.sitemap ul.cascading li li li a { padding-left: 2.5em; text-indent: -2.5em; }
.sitemap ul.cascading ul { list-style: none; padding: 0; margin: .4em 0 .8em 1.2em; *margin-left:3.2em;
}
.sitemap ul.cascading ul ul { *margin-left:3em;
}


/*----------------------------------------------map----*/

.map {
  display: block;
  margin: 2em auto 3em auto !important;
  z-index: 1;
  position: relative;
  width: 350px;
  height: 448px;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: url(../images/map.png) 0 0 no-repeat;
}

.TotalHome{ color: #333; margin:0em 0 2em 0; }
.TotalHome h3{ font-weight: bold; margin:0 0 10px;}
.TotalHome ul {list-style-type: inherit; }
.TotalHome ol{list-style-type: decimal; }
.TotalHome ol ol{ list-style-type: disc;}
.TotalHome ul li:nth-child(1){color:#2c71c7;}
.TotalHome ul li:nth-child(2){color:#83b958;}
.TotalHome ul li:nth-child(3){color:#b98baf;}
.TotalHome ul li:nth-child(4){color:#e3b92a;}
.TotalHome ul li:nth-child(5){color:#cc3000;}

.map .location1,
.map .location2,
.map .location3,
.map .location4,
.map .location5{
  position: absolute;
  /* z-index: 1; */
  display: none;
  list-style: none !important;
}

.map .location1 li,
.map .location2 li,
.map .location3 li,
.map .location4 li,
.map .location5 li{
  font-size: 1em;
  width: 105px;
  padding: 4px;
  cursor: pointer;  
  line-height: 1.2em;
  color: #FFF;
  z-index: 9999;
  display: block;
  border-radius: 5px;
  text-align: center;
  position: absolute;
  transition: .3s ease-out;
}

.map .location1 li:before,
.map .location2 li:before,
.map .location3 li:before,
.map .location4 li:before,
.map .location5 li:before{
  position: absolute;
  content: "";
  width: 100px;
  height: 1px;
  z-index: -1;
  transition: .3s ease-out;
}
.map .location1 li:after,
.map .location2 li:after,
.map .location3 li:after,
.map .location4 li:after,
.map .location5 li:after{
  position: absolute;
  content: ''; display: block;
  width: 20px; height: 20px;
  background: url(../images/map-service.png) no-repeat;
  background-size: contain;
  transform: rotate(0deg) !important;
}

.map .location1 li:hover,
.map .location1 li:focus{
  background: #055dcb;
  color: #fff !important;
}
.map .location2 li:hover,
.map .location2 li:focus{
  background: #83b958;
  color: #fff !important;
}
.map .location3 li:hover,
.map .location3 li:focus{
  background: #9f448b;
  color: #fff !important;
}
.map .location4 li:hover,
.map .location4 li:focus{
  background: #c3a102;
  color: #fff !important;
}

.map .location5 li:hover,
.map .location5 li:focus{
  background: #cd3f00;
  color: #fff !important;
}

.map .location1 li a,
.map .location2 li a,
.map .location3 li a,
.map .location4 li a,
.map .location5 li a {
  color: #ffffff !important;
  cursor: default;
  cursor: pointer;
  text-decoration: none;
}

.map .location1 {
  top: 22px;
  left: 209px;
  width: 119px;
  height: 120px;
  background: url(../images/a.png) 0 0 no-repeat;
}

.map .location1 li {
  background: #6197da;
}
.map .location1 li:before{
  background: #2c71c7;
}
.map .location2 {
  top: 92px;
  left: 120px;
  width: 147px;
  height: 188px;
  background: url(../images/b.png) 0 0 no-repeat;
}
.map .location2 li {
  background: #99c774;
}

.map .location2 li:before {
  background: #6e9d47;
}
.map .location3 {
  bottom: -13px;
  left: 111px;
  width: 115px;
  height: 210px;
  background: url(../images/c.png) 0 0 no-repeat;
}

.map .location3 li {
  width: 140px;padding:6px 4px;
  background: #b98baf;
}

.map .location3 li:before {
  background: #9a5f8d;
}
.map .location4 {
  top: 70px;
  right: 32px;
  width: 127px;
  height: 334px;
  background: url(../images/d.png) 0 0 no-repeat;
}

.map .location4 li {
  background: #e3b92a;
}

.map .location4 li:before {
  background: #caa00f;
}
.map .location5 {
  top: 26px;
  left: 1px;
  width: 127px;
  height: 334px;
  background: url(../images/e.png) 0 0 no-repeat;
}

.map .location5 li {
  background: #d56d34;
}

.map .location5 li:before {
  background: #be5c05;
}

.map .active {
  opacity: 1;
  display: block !important;
} 
/*----map home style---*/
.map-home .location1 li.N1 {
  top: -55px;
  left: 50px;
}

.map-home .location1 li.N1:before, .map-home .location1 li.N1:after {
  top: 60px;
  right: 66px;
  width: 30px;
  transform: rotate(90deg);
}

.map-home .location1 li.N1:after{right: 62px;top: 60px;}

.map-home .location1 li.N2 {
  top: -42px;
  left: -62px;
}

.map-home .location1 li.N2:before, .map-home .location1 li.N2:after {
  top: 67px;
  left: 65px;
  width: 52px;
  transform: rotate(60deg);
}
.map-home .location1 li.N2:after{  left: 97px; top: 79px;}

.map-home .location1 li.N3 {
  top: 20px;
  right: -114px;
}

.map-home .location1 li.N3:before, .map-home .location1 li.N3:after {
  top: 11px;
  right: 102px;
  width: 68px;
  transform: rotate(0deg);
}
.map-home .location1 li.N3:after{right: 113px;top: -2px;}

.map-home .location1 li.N4 {
  top: 8px;
  left: -118px;
}

.map-home .location1 li.N4:before, .map-home .location1 li.N4:after {
  top: 19px;
  left: 105px;
  width: 51px;
  transform: rotate(0deg);
}
.map-home .location1 li.N4:after{ left: 151px; top: 13px;}


.map-home .location1 li.N5 {
  top: 60px;
  left: -153px;
}

.map-home .location1 li.N5:before, .map-home .location1 li.N5:after{
  top: 0px;
  left: 99px;
  width: 64px;
  transform: rotate(-17deg);
}
.map-home .location1 li.N5:after{left: 150px;top: -16px;}

.map-home .location2 li.C1 {
  top: 43px;
  left: -103px;
}

.map-home .location2 li.C1:before, .map-home .location2 li.C1:after {
  top: 33px;
  left: 103px;
  width: 47px;
  transform: rotate(23deg);
}
.map-home .location2 li.C1:after{top:30px; left:134px;}
.map-home .location2 li.C2 {
  top: 94px;
  left: -118px;
}

.map-home .location2 li.C2:before, .map-home .location2 li.C2:after {
  top: 12px;
  left: 102px;
  width: 52px;
  transform: rotate(-17deg);
}
.map-home .location2 li.C2:after{ top:-3px; left:140px; }
.map-home .location2 li.C3 {
  top: 145px;
  left: -118px;
}

.map-home .location2 li.C3:before, .map-home .location2 li.C3:after {
  top: -9px;
  left: 102px;
  width: 55px;
  transform: rotate(152deg);
}
.map-home .location2 li.C3:after{top:-30px; left:140px;}


.map-home .location3 li.S1 {
  top: 40px;
  left: -144px;
}

.map-home .location3 li.S1:before,.map-home .location3 li.S1:after{
  top: -8px;
  left: 132px;
  width: 60px;
  transform: rotate(-39deg);
}
.map-home .location3 li.S1:after{ top:-35px; left: 176px; }

.map-home .location3 li.S2 {
  top: 82px;
  left: -137px;

}

.map-home .location3 li.S2:before,.map-home .location3 li.S2:after{
  top: -16px;
  left: 127px;
  width: 44px;
  transform: rotate(-54deg);
}
.map-home .location3 li.S2:after{top:-40px; left:148px;}

.map-home .location3 li.S3 {
  top: 119px;
  left: -119px;
}

.map-home .location3 li.S3:before, .map-home .location3 li.S3:after {
  top: -29px;
  left: 110px;
  width: 63px;
  transform: rotate(105deg);
}
.map-home .location3 li.S3:after{ top:-67px; left:140px; }

.map-home .location3 li.S4 {
  bottom: 23px;
  left: -105px;
}

.map-home .location3 li.S4:before, .map-home .location3 li.S4:after {
  bottom: 64px;
  left: 100px;
  width: 69px;
  transform: rotate(-80deg);
}
.map-home .location3 li.S4:after{ bottom:90px; left:133px; }

.map-home .location3 li.S5 {
  bottom: -15px;
  right: 20px;
}

.map-home .location3 li.S5:before, .map-home .location3 li.S5:after {
  top: -41px;
  right: 0px;
  width: 112px;
  transform: rotate(80deg);
}
.map-home .location3 li.S5:after{ top:-110px; right:-34px; }

.map-home .location3 li.S6 {
  bottom: 6px;
  right: -142px;
}

.map-home .location3 li.S6:before, .map-home .location3 li.S6:after {
  top: -19px;
  left: -71px;
  width: 87px;
  transform: rotate(50deg);
}
.map-home .location3 li.S6:after{ top:-64px; left:-64px; }

.map-home .location4 li.E1 {
  top: 80px;
  right: -105px;
}

.map-home .location4 li.E1:before, .map-home .location4 li.E1:after {
  top: 25px;
  right: 103px;
  width: 47px;
  transform: rotate(0deg);
}
.map-home .location4 li.E1:after{top:16px; right:115px;}
.map-home .location4 li.E2 {
  bottom: 47px;
  right: -50px;
}

.map-home .location4 li.E2:before, .map-home .location4 li.E2:after {
  top: 21px;
  right: 103px;
  width: 37px;
  transform: rotate(0deg);
}
.map-home .location4 li.E2:after{ top:12px; right:115px; }


/*----map service style---*/
.map-service .location1 li.N1 {
  top: -55px;
  left: -2px;
}

.map-service .location1 li.N1:before, .map-service .location1 li.N1:after {
  top: 60px;
  right: 14px;
  width: 30px;
  transform: rotate(90deg);
}

.map-service .location1 li.N1:after{ right: 10px;top: 60px;}

.map-service .location1 li.N2 {
  top: -55px;
  right: -101px;
}

.map-service .location1 li.N2:before, .map-service .location1 li.N2:after {
  top: 60px;
  left: -29px;
  width: 60px;
  transform: rotate(-29deg);
}
.map-service .location1 li.N2:after{right: 78px;top: 61px;left: inherit;  }

.map-service .location1 li.N3 {
  top: 0px;
  right: -135px;
}

.map-service .location1 li.N3:before, .map-service .location1 li.N3:after {
  top: 29px;
  right: 103px;
  width: 88px;
  transform: rotate(0deg);
}
.map-service .location1 li.N3:after{  right: 114px; top: 20px;}

.map-service .location1 li.N4 {
  top: -45px;
  left: -114px;
}

.map-service .location1 li.N4:before, .map-service .location1 li.N4:after {
  top: 58px;
  left: 100px;
  width: 52px;
  transform: rotate(40deg);
}
.map-service .location1 li.N4:after{ left: 140px; top: 71px;}


.map-service .location1 li.N5 {
  top: 9px;
  left: -141px;
}
.map-service .location1 li.N5:before, .map-service .location1 li.N5:after{
  top: 36px;
  left: 99px;
  width: 52px;
  transform: rotate(34deg);
}
.map-service .location1 li.N5:after{ left: 139px; top: 37px}

.map-service .location2 li.C1 {
  top: -8px;
  left: -58px;
  width: 106px;
}

.map-service .location2 li.C1:before, .map-service .location2 li.C1:after {
  top: 21px;
  left: 106px;
  width: 39px;
  transform: rotate(0deg);
}
.map-service .location2 li.C1:after{ top: 13px;left: 137px;}
.map-service .location2 li.C2 {
  top: 42px;
  left: -107px;
  width: 139px;
}

.map-service .location2 li.C2:before, .map-service .location2 li.C2:after {
  top: 20px;
  left: 137px;
  width: 40px;
  transform: rotate(17deg);
}
.map-service .location2 li.C2:after{ top: 15px; left: 160px; }
.map-service .location2 li.C3 {
  top: 74px;
  left: -118px;
  width: 138px;
}

.map-service .location2 li.C3:before, .map-service .location2 li.C3:after {
  top: 9px;
  left: 137px;
  width: 26px;
  transform: rotate(158deg);
}

.map-service .location2 li.C3:after{top: -3px; left: 150px;}
.map-service .location2 li.C4 {
  top: 105px;
  left: 45px;
  width: 78px;
  border: 2px solid #fff;
}

.map-service .location2 li.C4:before, .map-service .location2 li.C4:after {
  top: -3px;
  left: 49px;
  width: 22px;
  transform: rotate(90deg);
}
.map-service .location2 li.C4:after{top: -17px;left: 50px;}
.map-service .location2 li.C5 {
  top: 107px;
  left: -86px;
  width: 86px;
}

.map-service .location2 li.C5:before, .map-service .location2 li.C5:after {
  top: 9px;
  left: 85px;
  width: 36px;
  transform: rotate(181deg);
}
.map-service .location2 li.C5:after{top: 1px; left: 106px;}
.map-service .location2 li.C6 {
  top: 166px;
  left: -108px;
  width: 102px;
}

.map-service .location2 li.C6:before, .map-service .location2 li.C6:after {
  top: -1px;
  left: 99px;
  width: 42px;
  transform: rotate(153deg)
}
.map-service .location2 li.C6:after{top: -22px; left: 132px;}


.map-service .location3 li.S1 {
  top: 61px;
  left: -144px;
}

.map-service .location3 li.S1:before,.map-service .location3 li.S1:after{
  top: 0px;
  left: 137px;
  width: 26px;
  transform: rotate(-39deg);
}
.map-service .location3 li.S1:after{   top: -19px; left: 154px; }

.map-service .location3 li.S2 {
  top: 97px;
  left: -137px;

}

.map-service .location3 li.S2:before,.map-service .location3 li.S2:after{
  top: 6px;
  left: 136px;
  width: 36px;
  transform: rotate(-31deg);
}
.map-service .location3 li.S2:after{ top: -11px; left: 159px;}

.map-service .location3 li.S3 {
  top: 133px;
  left: -119px;
}

.map-service .location3 li.S3:before, .map-service .location3 li.S3:after {
  top: -14px;
  left: 131px;
  width: 44px;
  transform: rotate(-44deg);
}
.map-service .location3 li.S3:after{ top: -40px; left: 158px;}


.map-service .location4 li.E1 {
  top: 5px;
  right: -137px;

}

.map-service .location4 li.E1:before, .map-service .location4 li.E1:after {
  top: 25px;
  right: 103px;
  width: 47px;
  transform: rotate(0deg);
}
.map-service .location4 li.E1:after{top:16px; right:115px;}
.map-service .location4 li.E2 {
  bottom: 197px;
  right: -104px;
}

.map-service .location4 li.E2:before, .map-service .location4 li.E2:after {
  top: 21px;
  right: 103px;
  width: 37px;
  transform: rotate(0deg);
}
.map-service .location4 li.E2:after{ top:12px; right:115px; }
.map-service .location4 li.E3 {
  bottom: 51px;
  right: -56px;
}

.map-service .location4 li.E3:before, .map-service .location4 li.E3:after {
  top: 21px;
  right: 103px;
  width: 37px;
  transform: rotate(0deg);
}
.map-service .location4 li.E3:after{ top:12px; right:115px; }

.map-service .location5 li.Island1 {
  top: 29px;
  right: 69px;
  width: 140px;
}

.map-service .location5 li.Island1:before, .map-service .location5 li.Island1:after {
  top: 35px;
  right: 31px;
  width: 31px;
  transform: rotate(40deg);
}
.map-service .location5 li.Island1:after{ top: 28px; right: 17px;}
.map-service .location5 li.Island2 {
  bottom: 90px;
  left: -116px;
}

.map-service .location5 li.Island2:before, .map-service .location5 li.Island2:after {
  top: 20px;
  left: 103px;
  width: 21px;
  transform: rotate(-30deg);
}
.map-service .location5 li.Island2:after{ top:12px; right:115px; }




/*----map medical style---*/
.map-med .location1 li.N1 {
  top: -45px;
  left: 26px;
}

.map-med .location1 li.N1:before, .map-med .location1 li.N1:after {
  top: 40px;
  right: 41px;
  width: 30px;
  transform: rotate(90deg);
}

.map-med .location1 li.N1:after{ 
  top: 54px;left: 38px;}

  .map-med .location1 li.N2 {
    top: -32px;
    left: -83px;

  }

  .map-med .location1 li.N2:before, .map-med .location1 li.N2:after {
    top: 56px;
    left: 97px;
    width: 28px;
    transform: rotate(50deg);
  }
  .map-med .location1 li.N2:after{ left: 108px;top: 56px;}

  .map-med .location1 li.N3 {
    top: 21px;
    left: -129px;
  }

  .map-med .location1 li.N3:before, .map-med .location1 li.N3:after{
    top: 32px;
    left: 102px;
    width: 36px;
    transform: rotate(29deg);
  }
  .map-med .location1 li.N3:after{left: 127px;top: 32px;}



  .map-med .location2 li.C1 {
    top: 8px;
    left: -65px;
  }

  .map-med .location2 li.C1:before, .map-med .location2 li.C1:after {
    top: 40px;
    left: 95px;
    width: 36px;
    transform: rotate(58deg)
  }
  .map-med .location2 li.C1:after{ top: 46px; left: 113px;}
  .map-med .location2 li.C2 {
    top: 41px;
    left: -95px;
  }

  .map-med .location2 li.C2:before, .map-med .location2 li.C2:after {
    top: 43px;
    left: 98px;
    width: 96px;
    transform: rotate(27deg);
  }
  .map-med .location2 li.C2:after{ top: 58px; left: 185px; }
  .map-med .location2 li.C3 {
    top: 91px;
    left: -112px;
  }
  .map-med .location2 li.C3:before, .map-med .location2 li.C3:after {
    top: 36px;
    left: 100px;
    width: 56px;
    transform: rotate(-149deg);
  }
  .map-med .location2 li.C3:after{ top: 43px; left: 140px;}
  .map-med .location2 li.C4 {
    top: 144px;
    left: -120px;
  }
  .map-med .location2 li.C4:before, .map-med .location2 li.C4:after {
    top: 20px;
    left: 101px;
    width: 75px;
    transform: rotate(157deg);
  }
  .map-med .location2 li.C4:after{ top: -3px; left: 169px;}

  .map-med .location3 li.S1 {
    top: 40px;
    left: -144px;
  }

  .map-med .location3 li.S1:before,.map-med .location3 li.S1:after{
    top: 13px;
    left: 139px;
    width: 27px;
    transform: rotate(0deg);
  }
  .map-med .location3 li.S1:after{ top:4px; left:155px; } 

  .map-med .location3 li.S2 {
    top: 82px;
    left: -137px;
  }

  .map-med .location3 li.S2:before,.map-med .location3 li.S2:after{
    top: 9px;
    left: 136px;
    width: 34px;
    transform: rotate(-31deg);
  }
  .map-med .location3 li.S2:after{top: -4px;left: 156px;}

  .map-med .location3 li.S3 {
    top: 119px;
    left: -119px;
  }

  .map-med .location3 li.S3:before, .map-med .location3 li.S3:after {
    top: 4px;
    left: 136px;
    width: 56px;
    transform: rotate(-29deg);
  }
  .map-med .location3 li.S3:after{ top: -18px; left: 184px; }



  .map-med .location4 li.E1 {
    top: 1px;
    right: -126px;
  }

  .map-med .location4 li.E1:before, .map-med .location4 li.E1:after {
    top: 25px;
    right: 103px;
    width: 43px;
    transform: rotate(0deg);
  }
  .map-med .location4 li.E1:after{    top: 16px; right: 130px;}
  .map-med .location4 li.E2 {
    top: 53px;
    bottom:inherit;
    right: -121px;
  }
  .map-med .location4 li.E2:before, .map-med .location4 li.E2:after {
    top: 4px;
    right: 96px;
    width: 43px;
    transform: rotate(47deg);
  }
  .map-med .location4 li.E2:after{ top: -17px; right: 119px;}
  .map-med .location4 li.E3 {
    top: 102px;
    right: -98px;
  }
  .map-med .location4 li.E3:before, .map-med .location4 li.E3:after {
    top: 19px;
    right: 103px;
    width: 37px;
    transform: rotate(22deg);
  }
  .map-med .location4 li.E3:after{ top: 6px;right: 125px }

  .map-med .location4 li.E4 {
    top: 160px;
    right: -94px;
  }
  .map-med .location4 li.E4:before, .map-med .location4 li.E4:after {
    top: 9px;
    right: 99px;
    width: 49px;
    transform: rotate(40deg);
  }
  .map-med .location4 li.E4:after{ top: -15px;right: 130px;}

  .map-med .location4 li.E5 {
    bottom: 47px;
    right: -50px;
  }
  .map-med .location4 li.E5:before, .map-med .location4 li.E5:after {
    top: 21px;
    right: 103px;
    width: 37px;
    transform: rotate(0deg);
  }
  .map-med .location4 li.E5:after{ top:12px; right:125px; }


  /*---map medical---*/
  .map-med .location1 li:after,
  .map-med .location2 li:after,
  .map-med .location3 li:after,
  .map-med .location4 li:after,
  .map-med .location5 li:after{
    position: absolute;
    content: ''; display: block;
    width: 20px; height: 20px;
    background: url(../images/map-medical.png) no-repeat;
    background-size: contain;
    transform: rotate(0deg) !important;
  }
  /**/
  .map-med .location1 li.N2:after,.map-med .location1 li.N3:after,
  .map-med .location2 li.C2:after,.map-med .location2 li.C3:after,
  .map-med .location2 li.C4:after,.map-med .location3 li.S1:after,
  .map-med .location3 li.S3:after,.map-med .location4 li.E1:after,
  .map-med .location4 li.E2:after,.map-med .location4 li.E3:after,
  .map-med .location4 li.E4:after,.map-med .location4 li.E5:after{
    background: url(../images/map-medical2.png) no-repeat;
    background-size: 100%;
    width: 20px !important; height: 20px !important;
  }



  /*---map service---*/
  .map-service .location1 li:after,
  .map-service .location2 li:after,
  .map-service .location3 li:after,
  .map-service .location4 li:after,
  .map-service .location5 li:after,
  .map-service .location6 li:after{
    position: absolute;
    content: ''; display: block;
    width: 20px; height: 20px;
    background: url(../images/map-service.png) no-repeat;
    background-size: contain;
    transform: rotate(0deg) !important;
  }

  .ENsize{ font-size:12px; }

  .map-service.ENsize .location1 li.N1:before{ 
    top: 47px;
    right: 2px;
    width: 52px;
    transform: rotate(90deg);
  }
  .map-service.ENsize .location1 li.N1:after{ 
    right: 8px;
  }
  .map-service.ENsize .location5 li.Island1:before, .map-service.ENsize .location5 li.Island1:after{ top:29px; }
  .map-service.ENsize .location5 li.Island2:before, .map-service.ENsize .location5 li.Island2:after{transform: rotate(0deg);}
  .map-med.ENsize .location1 li.N2:before, .map-med.ENsize .location1 li.N2:after {
    top: 47px;
    left: 89px;
    width: 33px;
    transform: rotate(50deg);
  }
  .map-med.ENsize .location2 li.C1:before, .map-med.ENsize .location2 li.C1:after{
    top: 40px;left: 92px;width: 46px;}

    .map-med.ENsize .location2 li.C3,.map-med.ENsize .location2 li.C4,
    .map-med.ENsize .location4 li, .map-home.ENsize .location4 li,
    .map-home.ENsize .location1 li ,.map-home.ENsize .location2 li{height: 35px;}
    .map-med.ENsize .location1 li.N2:after{ left:108px; }
    .map-med.ENsize .location2 li.C1:after{ left:117px; top:48px; }
    .map-med.ENsize .location2 li.C3, .map-med.ENsize .location4 li.E1{width: 115px;}
    .map-med.ENsize .location2 li.C4:after{ top:-2px; transform: rotate(167deg);  }
    .map-home.ENsize  .location1 li.N4:before{ top:30px; transform: rotate(32deg); }
    .map-home.ENsize  .location1 li.N2:before{top:50px; transform: rotate(59deg);}
    .map-home.ENsize  .location1 li.N1:before{ top:48px; }
    .map-med2{width: 20px;}


    @media (max-width:767px) {
      .TaiwanMap{ max-width: 767px; overflow-x:auto; }
      .map-service .location5 li.Island1 {
        top: 3px;
        right: 69px;
        width: 72px;
        font-size: 0.8em
      }
      .map-service .location5 li.Island1:before, .map-service .location5 li.Island1:after {
        top: 55px;
        right: 21px;
        width: 33px;
        transform: rotate(90deg);
      }
      .map-service .location5 li.Island1:after {
        top: 55px;
        right: 15px;
      }
      .map-service .location5 li.Island2 {
        bottom: 129px;
        left: -18px;
        width: 61px;
        font-size: 0.8em;
      }
      .map-service .location5 li.Island2:before, .map-service .location5 li.Island2:after {
        top: 26px;
        left: 16px;
        width: 20px;
        transform: rotate(90deg);
      }
      .map-service .location5 li.Island2:after {
        top: 34px;
        left: 23px;
      }

    }

    @media (max-width:480px) {
      .TaiwanMap{ max-width: 480px; overflow-x:auto; }
    }

    /*----------------------------------------------------------------------stepwizard-step*/

    .stepwizard-step p {
      margin: 1em 0; color:#999;   
    }

    .stepwizard-row {
      display: table;
      position: relative;
      width: 100%; padding:5px 0;
      border-radius: 10px;
      /*border:1px solid #ddd;*/
    }

    .stepwizard {
      display: table;     
      width: 100%;
      position: relative;
      
    }

    .step5 .stepwizard-step{width: 20%}
    .step3 .stepwizard-step{width: 33%}


    .stepwizard-step button[disabled] {
      opacity: 1 !important;
      
      filter: alpha(opacity=100) !important;
    }
    .stepwizard-step:first-child.active{
      border-radius: 15px;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }
    .stepwizard-step:last-child.active{
      border-radius: 15px;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
    .stepwizard-step {    
      display: table-cell;
      text-align: center;
      position: relative;
      padding:5px;
    }
    .stepwizard-step a{color: #666;border-color: #888 !important;}
    .stepwizard-step a:after{
      font-family: 'fontello';
      display: block;
      position: absolute;
      content: "\E8A1";
      font-size: 2.5em;
      color: #ccc;
      top:40px;right: 5px;
    }
    .stepwizard-step:last-child a:after{display: none;}
    .stepwizard-step .active-step{background: #007bbb!important; border:1px solid #007bbb !important;
      color:#fff !important; opacity: 1 !important;}
      .stepwizard-step .active-step:after{
        color: #007bbb!important;
      }
      .stepwizard-step.active p{ color:#007bbb !important; font-weight: bold; }
      .btn-circle {
        width: 40px;
        height: 40px;
        text-align: center;
        font-size: 1.2em;
        line-height: 25px;
        border-radius: 50%;
      }
      .stepwizard-content{
       border:none !important;
       float: left !important;
       margin-top: 0 !important;
       padding: 15px !important;
       width: 100% !important;
     }
     .setup-content h2{ 
      font-size: 1.5em; margin:2em auto 15px auto; padding:5px; border-bottom: 1px dotted #ccc;color: #007bbb; font-weight: bold;
    }

    .setup-content {margin: 0 -15px; padding:0;}
    .setup-content .form-group{ overflow:hidden; display: block;}
    .setup-content hr{border-color:#ccc; width: 100%; }
    .setup-content ol{   list-style-type: decimal ;margin:1em 0;padding: 0 1em; }
    .setup-content ul{   list-style-type: disc !important;}
    .setup-content .phoneBox{ background-color: #fff; margin:2em auto; padding:2em 0; border:2px solid #ddd; text-align: center; border-radius: 15px; }
    .setup-content .note { overflow: hidden; font-size: 0.9em;}
    .setup-content .note ul{margin:1em 2em ;}
    .setup-content .note ul a{ color: blue; }
    .setup-content .tabContent li{border-bottom: none;}
    .setup-content .tabContent li a{display: inline;}
    .setup-content .panel-group{clear:both;}
    .setup-content .panel-group  ol>li{ margin-bottom: 15px; font-weight: bold; }
    .setup-content .panel-group  ol>li>ul{ margin:1em 0; font-weight: normal; }
    .setup-content .center-block{width: auto;margin:1em 0; text-align: center;padding:1em 0;}
    .setup-content .btn{ white-space: inherit; }
    .setup-content .btn-default{  background: #ccc!important;border:1px solid #ccc !important; }
    .setup-content .btn-primary{  background: #007bbb!important;border:1px solid #007bbb !important; }
    .setup-content .panel-heading{ font-size: 1.5em; background: #007bbb!important; padding:10px 5px; text-align: center; }
    .setup-content .panel-body{padding-bottom: 2em;}
    .setup-content .tabSet{min-height:850px;height: auto !important; clear:both; margin: 2em 1em  !important;}
    .setup-content .tabs h1{ width:33%;border-bottom: none;clear: inherit;font-weight: normal;font-size:1.25em; }
    .setup-content .tabs h1.active a{background: rgba(122,181,181,0.8) !important; color: #fff;}
    .setup-content .tabs h1 a{ width:auto !important; text-overflow: inherit;white-space: inherit;overflow: inherit;}
    .setup-content .tabs h1 a { color: #666;}
    .setup-content .tabs h1.active:hover a,
    .setup-content .tabs h1 a:hover{ background: #7ab5b5 !important; color: #fff; }
    .setup-content .tabContent{margin:4em 0 0 0; clear: both;}
    .setup-content .tabContent .note li{padding:0;}
    .text-denger{ margin:1em auto 2em auto; }
    .setup-content  .select-input{ min-width: 200px;}
    .form-horizontal .control-label{padding-top:0;}
    .muR{ float: right; font-size: 0.7em; }
    .setup-content fieldset{
      display: table;
      width: 100%;
      border-radius: 10px;
      padding: 1%;
      margin: 2em auto;
      background-color: #eee ;
    }
    .setup-content  legend{
      text-align: center;
      padding: 0 1em;
      text-align: center;
      color: #069;
      font-size: 1.2em;
      font-weight: bold;
      border-bottom: none;
    }
    .icon-volume-down{font-size: 1.5em; }
    /*--------------------------------stepList*/
    .stepList { display:block; clear: both; margin:2em auto !important; text-align: center; overflow: hidden; clear:both;}
    .stepList li { width: 24%;vertical-align: top; border-bottom: none; padding-top: 2em;text-align: center; display: inline-block;  position: relative; margin:0 auto; background-size: cover;}
    .stepList li:before{position: absolute;top:0px; left: 40%; margin:0 auto; content:attr(data-title); color:#49bba7; font-weight:bold; font-size: 1.2em; display:block;}
    .stepList li:after{ position: absolute;top:30%; right: -8px; margin:0 auto; font-family: 'fontello'; content: "\E8A1"; color: #7ab5b5;font-size: 2em;}
    .stepList li:last-child:after{display: none;}
    .stepList li a{overflow: inherit;   white-space: inherit;  text-overflow: inherit; display: block }
    .stepList li span{ display: block;  overflow: hidden; clear: both; font-size: 1.2em; margin:0 1em;  } 
    .stepList li span.text-danger{display: inline; margin:0; clear:inherit; overflow: inherit;}
    .stepList li .circled{
      width: 150px;
      height: 150px;
      line-height: 180px;
      border-radius: 50%;
      color: #5bc0de;
      text-align: center;
      overflow: hidden;
      display: block;
      margin:0 auto;
      background-color: #fff ;
      border: 3px solid rgba(122,181,181,0.8) ;
      background-repeat: no-repeat;
      background-position: center center;
      transition: .3s ease-out;
    } 
    .stepList li .circled img{width: 150px; vertical-align: 0;}
    .stepList li:last-child  .circled{line-height: 170px ;}

/* .icon1{background:url(../images/step-pic1.jpg);}
.icon2{background:url(../images/step-pic2.jpg);}
.icon3{background:url(../images/icon3.png);}
.icon4{background:url(../images/icon4.png);}
.icon5{background:url(../images/icon5.png);} */
.box-default{ border-radius: 5px; background: #e8e8e8;
  margin:1em auto 2em auto; padding:10px;}


  /*serviceList style*/
  .serviceList{
    margin:2em auto;padding:0; overflow:hidden; text-align: center; clear: both;width: 100%;
  }
  .serviceList li{
    position: relative;
    width: 25%;
    height: 70px;
    float: left;margin:0;
    display: inline-block;border-radius: 10px; 
  }
  .serviceList img{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    height: 100%;
    width: auto;
  }
  .serviceList li a{
    display:block;
    position: absolute;
    top: 0;
    left: 0;
    right:0;
    bottom:0;
    box-sizing: border-box;
    border:4px solid #fff;
    text-align: center;
    text-decoration: none;
    font-size: 1.5em;
    margin:auto;
    color:#fff;
    border-radius: 10px;
  }
  .serviceList li a:hover{color:#fff; }
  .serviceList li a:before{
    content:'';
    height:100%;
    display:inline-block;
    vertical-align:middle;
  }

  .serviceList li:nth-child(4n+1) a{background-color:rgba(240,165,20,1);}
  .serviceList li:nth-child(4n+2) a{background-color:rgba(50,120,212,1);}
  .serviceList li:nth-child(4n+3) a{background-color:rgba(105,211,180,1);}
  .serviceList li:nth-child(4n+4) a{background-color:rgba(150,175,90,1);}

  .serviceList li:nth-child(4n+1) a:hover{background-color:rgba(240,165,20,0.9);}
  .serviceList li:nth-child(4n+2) a:hover{background-color:rgba(50,120,212,0.9);}
  .serviceList li:nth-child(4n+3) a:hover{background-color:rgba(105,211,180,0.9);}
  .serviceList li:nth-child(4n+4) a:hover{background-color:rgba(150,175,90,0.9);}

  @media (max-width:767px) {
    .stepList li .circled{  width: 100px;height: 100px;}
    .stepList li .circled img{width: 100px; }
    .stepList li:after{right:10px;}
    .setup-content .tabs h1{ width:100%; }
    .setup-content .tabs h1 a {background:#e7e7e7;}
    .stepwizard-step a:after, .stepwizard-step p{font-size: 1em; line-height: 1em;}
    .setup-content{ margin: 0 -15px; padding: 0;}


  }
  @media (max-width:767px) {
    .stepList li { width: 45%;margin-right: 15px;}
    .stepList li .circled{ width: 150px; height: 150px; }
    .stepList li .circled img{width: 170px; }
    .serviceList li a{font-size: 1em;}
  }
  @media (max-width:480px) {
    .stepList li { width: 100%;margin-right: 0; margin-bottom: 2em;}
    .stepList li span{ width: auto; font-size: 1.2em;margin:0 auto; }
    .stepList li .circled{width: 165px;height: 165px; margin:0 auto;}
    .stepList li:before{left:40%;}
    .stepList li:after{
      content: "\E89F";
      position: absolute;
      top: 95%;bottom: 0;
      right: 0; left:0;
    }
    .serviceList li a{padding-top: inherit;}
    .serviceList li a:before{height: 25%; }

  }
  @media (max-width:320px) { .serviceList li a{padding-top: 8px;} }


