@charset "utf-8";

/* CSS Document */
html,body {
    padding: 0px; margin: 0px;
	font-size:15px; color: #333; line-height:21px;	
	height:100%; min-height:100%;
}
body:before {
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;
}

a:link, a:visited {color: #333;	text-decoration: none;}
a:hover {text-decoration: underline; color: #f91c52;}

.clear{clear:both}
img {border:0;}
h1, h2, h3, h4, h5, h6, p{ padding:0px; margin:0px; color: #000;}
h1{ font-size:30px; color:#1e99a8; border-bottom:1px solid #ccc; padding:0px 0px 10px 0; margin-bottom:15px;  line-height:33px;}
h2{ }
h3{ }
h4{ }
h5{ }
h6{ }
p { }
div, ul li{ margin:0px auto; padding:0px;}
#wrap{ width:100%; min-height:100%; height:100%; background:#edfdff }
.screen{ min-width:680px; max-width:970px; position:relative; padding:0px 15px;}
.screen_Full{ min-width:680px; max-width:1200px; position:relative; padding:0px 0px; overflow-x: hidden;}
.left_title{ width:150px; float:left}

.box_shadow{ border:1px solid #ddd; box-shadow:0px 0px 5px #ccc;}

/* Header */
.header{ position:relative; background: url(../images/bg_top.jpg) repeat-x #33c5d7 top   }
.header .logo_img{ position:absolute; left:5px; top:10px; }

.header .logo{ float:left; padding:20px 0px 0px 88px; height:90px; font-size:26px; color:#fff; text-shadow:0px 0px 3px #333 }
.chi{font-family: "微軟正黑體", "Microsoft JhengHei", "Segoe UI Semibold", "Segoe UI", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; line-height:45px;
}
.header .logo a{ color:#FFF}
.header .logo a:hover{ color:#FFF; text-decoration:none}
.header .logo img{ height:100%;}
.header .top_shortcut{ padding:20px 0px 0px 0px; position:absolute; right:15px; top:0px;}
.header .language{}
.header .top_shortcut ul{ list-style:none; padding:0px; margin:0px;}
.header .top_shortcut ul li{ float:left; padding-left:15px; color:#FFF}
.header .top_shortcut ul li a{ color:#FFF}
.header .top_shortcut ul li a:hover{ text-decoration: none; color:#ff9c00}
.header .top_shortcut ul li a.current{ text-decoration: underline}
.top_linking{ position:absolute; right:15px; top:60px;}
.top_linking div{ float:right; margin-left:15px;}
.cms_demo a{ background: url(../images/panel.png) no-repeat #b01731; background-position:15px 50%; padding:10px 15px 10px 55px; display:block; color:#FFF; text-decoration:none;}
.cms_demo a:hover{ background: url(../images/panel.png) no-repeat #333; background-position:15px 50%;}
.tutor_back a{ background: url(../images/panel.png) no-repeat #0570bf; background-position:15px 50%; padding:10px 15px 10px 55px; display:block; color:#FFF; text-decoration:none;}
.tutor_back a:hover{ background: url(../images/panel.png) no-repeat #333; background-position:15px 50%;}


#ad_float_ad {display: none; position: absolute;	z-index:4001; }
#ad_float_ad .ad_close_ad {
	display: block; background:url(../images/icon/btn_close.png) no-repeat; height:30px; width:30px; background-size:30px 30px;
	cursor: pointer; position:absolute; right:-5px; top:-10px;
	-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1;
}
#ad_float_ad .ad_close_ad:hover {  transform: rotate(90deg);}

.special_news{ background:url(../images/icon/bg_box.png) #eb1f24; padding:3px; width:210px; box-shadow:0 0 1px rgba(0,0,0,.1)}
.title_special{ background:#fff; padding:1px 5px; color:#ea1e22; border-bottom:1px solid #ea1e22;}
.special_news .content{ background:#fff; padding:2px 5px; color:#333; font-size:13px;}
.special_news .content img{ max-width:100%;}
.highlight{ color:#F03}


/* Content Section */
.container{   float: left; width:100%; min-height:300px; background:#edfdff;}
.container h1{ background: url(../images/bg_title.png) no-repeat top center #fff; padding:45px 0px; text-align: center; color:#1e99a8; border-bottom:0px;}

.index_main{ margin:30px 0px 40px 0; min-height:250px; }


.index_main .intro{ float:left; width:67%; text-align:justify;}
.index_main .intro h1{ border-bottom:1px solid #ccc; font-size:21px; padding:5px 0px; text-align: left; background:none}
.index_main .intro img{ float: right; border:2px solid #fff; box-shadow:0px 0px 3px #ddd; margin:0px 0px 10px 15px}
.index_main .intro a{ color:#1e99a8; text-decoration:underline}
.index_main .intro a:hover{ color: #F90; text-decoration:none}
.index_main .icon_right{ float: right; width:42%;}
.index_main .icon_right ul{ list-style:none; margin:0px; padding:0px;}
.index_main .icon_right ul li{ float:left; width:48%; margin-left:0%;}
.index_main .icon_right ul li + li{ margin-left:4%;}
.index_main .icon_right ul li img{ width:100%;}

.latest_new{ float:right; width:30%; margin-top:-11px;}
.latest_new img{ display:none;}
.latest_new span{ padding:5px 0; color:#1e99a8; padding-bottom:5px;}
.latest_new .content { padding:5px 0;}

.latest_new h2{ font-weight:normal;  font-size:21px;  border-bottom:1px solid #ccc;  }
.latest_new ul{ border:1px solid #d2ebee; padding:10px;  list-style:none;background:#FFF}
.latest_new ul li{ line-height:19px; font-size:13px; border-bottom:1px dotted #ccc; margin-bottom:10px;}
.latest_new ul li a:hover{ color:#1e99a8}
.latest_new .preview{ float:left; margin-right:10px; } 
.latest_new .preview img{ border:1px solid #fff; box-shadow:0px 0px 2px #ddd; width:110px;} 


.latest_new .date{ color:#1e99a8}
.latest_new .more { margin:10px 0 15px 0;}
.latest_new .more a{ background: url(../images/more.png) no-repeat #ff9c00; background-position:10px 52%; color:#fff; padding:3px 18px 3px 25px; font-style:12px; }
.latest_new .more a:hover{ background: url(../images/more.png) no-repeat #1e99a8; background-position:10px 52%;color:#fff; }
/* Footer Section */
#footer{ background: url(../images/footer_bg.png) no-repeat center bottom #edfdff; font-size:11px; padding:0px; position: relative; height:80px; margin-top:-80px; clear:both; }
#footer .screen{ padding-top:30px; }
#footer a{ color:#333;} 
#footer .copy{ width:70%; float: left; color:#333;}
#footer .designby{ width:30%; float: right; color:#fff; text-align: right}

.information_bar{background:#edfdff; height:130px; float: left; width:100%; padding-top:15px;}
.information_bar .screen{background:#edfdff;  }
.information_bar .contentss{ border:1px solid #d2ebee; padding:10px 15px; background:#fff;  }
.information_bar .contentss .left_info{ width:33%; float:left; border-right:1px solid #77cdd8;}
.information_bar .contentss .left_info a{ color:#0a8c9c}

.information_bar .contentss .right_content{ width:63%; float: right;}
.closing_date{ color:#0a8c9c; text-align:right}

.nevigation{ padding:10px 0px; background:#edfdff  }
.nevigation .home{ background:url(../images/icon_home.png) no-repeat; background-position:0px 5px; display: block; padding-left:25px; }
.nevigation ul{ list-style: none; margin:0px; padding:0px; color:#0d8796;}
.nevigation ul .sp{ padding:0px 15px; color:#666 }
.nevigation ul li{ float: left; line-height:24px;  }
.nevigation ul li a{ color:#666; text-decoration: none }
.nevigation ul li a:hover{ color:#0d8796; text-decoration: underline }

.inner_main{ margin:30px 0px 10px 0; min-height:250px; text-align: justify }
.inner_main .img{ max-width:100%;}
.inner_main p{ clear:both; margin-bottom:0px;}
.inner_main a{ color:#1e99a8; text-decoration:underline }
.inner_main a:hover{ color:#333; text-decoration: none }

.Album{ margin:15px 0px;}
.Album .title{ background:#4579e5; color:#fff; padding:7px 19px; font-size:21px; display:inline;  box-shadow:3px 3px 0px rgba(0,51,153,.2) }
.Album .description{ background:#fff; padding:10px; margin:20px 0; border:1px solid #0076c0; line-height:21px;}
.Album ul{ list-style:none; padding:0px; margin:0}
.Album ol{ margin:0px; padding:0 5px;}
.Album ul li{ text-align: center; margin:0 0 10px 0; }
.Album ul li img{ box-shadow:0 0 3px rgba(0,0,0,.5); }
.Album ul li:hover img{ box-shadow:0 0 3px rgba(0,51,204,.5)}
.Album ul li p{ margin:0px; padding:5px 0; line-height:15px; text-align: center; }

#Inner_Type_A{ padding:15px;  }
#Inner_Type_A .title{ margin-left:-15px; }
#Inner_Type_A ul{ margin:20px 0 0 -2%; }

#Inner_Type_A ol li{ float: none; width:100%; margin:0 0 5px 2%; }
#Inner_Type_A li{ float:left; width:31%; margin:0 0 15px 2%; }

#Inner_Type_A li:nth-child(3n+1){ clear:both}

#Inner_Type_A li img{ max-width:100%; max-height:155px  }
#Inner_Type_A li p{  }

#Inner_Type_B { }
#Inner_Type_B .title{ margin:0 0 ;  }
#Inner_Type_B ul{ margin:20px 0 0 -2%; padding:0; }

#Inner_Type_B li{ float:left; width:48%; margin:0 0 15px 2%; background:rgba(255,255,255,.7); box-shadow:0 0 3px rgba(0,0,0,.2) }
#Inner_Type_B .title_des { float: left; width:100%;}
#Inner_Type_B li img{ max-width:100%; height:auto }
#Inner_Type_B li:nth-child(2n+1) { clear:both}
#Inner_Type_B li p { text-align: left; padding:0; line-height:23px;}
#Inner_Type_B .right_desc { float: right; width:100%; padding:10px 0 0}


#Inner_Type_C {padding:0px; border:2px solid #259cd8; background: url(../images/icon/bg_album_type_c.png) #fff}
#Inner_Type_C ul{ margin:20px 15px 0 15px; padding:0px;}
#Inner_Type_C li{ float:none; margin:0 0 15px 0%; width:100%; text-align: left; clear:both; padding:0}
#Inner_Type_C li img{ width:100%; height: auto; text-align: center; margin:0 0 10px 0}
#Inner_Type_C li .title_des{ width:40%; float:left; }
#Inner_Type_C li .right_desc{ float: right; width:60%; padding:10px 10px 15px 10px; line-height:33px; width:55%; text-align: left; box-shadow:0 0 3px rgb(0,0,0,.2)}
#Inner_Type_C .title{ background:#259cd8; color:#fff; padding:7px 19px; font-size:21px; display: block; margin-left:0px; box-shadow:0 0 0}

#Inner_Type_D { background:none}
#Inner_Type_D li{ float:none; margin:0 0 15px 0%; width:100%; text-align: left; clear:both; padding:0}

.Album_org {background:#fff; border:1px solid #d7d7d7; border-radius: 0px;  position:relative; margin-bottom:30px;}
.Album_org .title { margin:2%; border-bottom:1px dotted #ccc; padding-bottom:15px; margin-bottom:0px;}
.Album_org ul{ list-style: none; padding:0% 1% 1% 1%;}
.Album_org ul li{ float: left; margin:1%; width:23%; text-align: center; background:#FFF }
.Album_org ul li img{ width:100%}
.Album_org ul li .enlargeicon{ position:absolute; text-align: center; top:43%; width:100%;}

.Album_tpl_B {background:#fff; border:1px solid #d7d7d7; border-radius: 0px;  position:relative; margin-bottom:30px;}
.Album_tpl_B .title { margin:2%; width:auto; height: auto; border-bottom:1px dotted #ccc; padding-bottom:15px; }
.Album_tpl_B .title span {  padding:3px 15px;background:#333; color:#FFF; }
.Album_tpl_B ul{ list-style: none; padding:0% 1% 1% 1%;}
.Album_tpl_B ul li{ float: none; margin:1%; clear:both; padding-bottom:10px; border-bottom:1px dotted #ccc; }
.Album_tpl_B ul li .photo_Area{ float: left; width:25%;}
.Album_tpl_B ul .photo_Area img{ width:100%; border: 5px solid #fff; box-shadow: 0px 0px 2px #ccc;}

.Album_tpl_B ul .photo_Area img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.Album_tpl_B ul .photo_Area:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.Album_tpl_B ul li .Description{ width:72%; float:right; text-align: left;}

.main_content{ min-height:350px;}

.Pdf_download {background:#fff; border:1px solid #d7d7d7; border-radius: 0px;  position:relative; margin-bottom:30px;}
.Pdf_download .title { margin:2%; border-bottom:1px dotted #ccc; padding-bottom:15px; margin-bottom:0px;}
.Pdf_download ul{ list-style: none; padding:0% 1% 1% 1%;}
.Pdf_download ul li{ float: left; margin:1%; width:30%; }
.Pdf_download ul li a{ display:block; color:#333333; background:url(../images/pdf_download.png) no-repeat; background-position:0px 0%; padding:3px 3px 3px 35px; font-size:15px; text-align:left}
.Pdf_download ul li a:hover{ color:#0d8796}

.cd-top {
  display: inline-block;
  height: 50px;
  width: 50px;
  position: fixed;
  bottom: 90px;
  right: 30px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: #000 url(../images/cd-top-arrow.svg) no-repeat center center;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
  background: #0a8c9c url(../images/cd-top-arrow.svg) no-repeat center center;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: #0a8c9c;
  opacity: 1;
}


.Sub_menu_container{ width:20%; float: right; box-shadow: 0px 0px 3px #ccc; margin-top:30px }
.Sub_menu_container .title{ background:#000; color:#fff; font-size:19px; font-weight: normal; margin-bottom:0px; text-align: center; padding:13px 0px 13px 0; text-transform:uppercase; }
.sub_menu{}
.sub_menu ul{ list-style:none;  margin:0px; padding:0px;  }
.sub_menu ul li{ margin:0px; border-bottom:1px solid #d2d4d4; border-top:1px solid #fff;}
.sub_menu ul li a{ padding:10px; display:block; font-size:15px; text-decoration: none;
   background-color: rgba(242,243,246, 0.6);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;}
.sub_menu ul li a:hover, .sub_menu ul li a.current{ background:#0d8796; color:#fff; }
.sub_menu ul li ul{ }
.sub_menu ul li ul li{ margin:0px; border-bottom:0px solid #d2d4d4; border-top:0px solid #fff;}
.sub_menu ul li ul li a{ background: url(../images/icon_arrow_r.png) no-repeat #fff;  padding:10px 10px 10px 28px; font-size:13px; background-position:10px 50%;}
.sub_menu ul li ul li a:hover, .sub_menu ul li ul li a.current{ background: url(../images/icon_arrow_r_white.png) no-repeat #0d8796;  background-position:10px 50%;}

#Main_content_with_submenu{ width:77%; float: left;  }

.fade_effect{
	-webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out; opacity: 1;}

/* Product */
.Product_category {position:relative; margin-bottom:30px;}
.Product_category ul{ list-style: none; padding:0% 0% 0% 0%; margin-right:-1.5%}
.Product_category ul li{ float: left; margin:0px 1.5% 15px 0%; width:31.8%; text-align: center; background:#FFF }
.Product_category ul li div{ border: 5px solid #fff; box-shadow: 0px 0px 2px #ccc;}
.Product_category ul li img{
   width:100%; 
   opacity: 1;
   background-color: rgba(0,0,0, 0.6);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out; }   
.Product_category ul li:hover img{opacity: 0.7; }
.Product_category ul li a{ text-decoration:none}
.Product_category ul li p{ padding:10px 10px 0 10px}
.Product_category ul li:hover p{ color:#666 }

.product_gallery{ float:left; width:70%;}
.product_description{ float:right; width:28%;}

/* News */
.News { position:relative; margin-bottom:30px;}
.news_listing ul{ list-style: none; padding:0% 0% 0% 0%; margin-right:-1.5%}
.news_listing ul li{ float: left; margin:0px 1.5% 15px 0%; width:31.8%; text-align: center; background:#FFF; position:relative}
.News .date { position:absolute; left:5px; top:5px; width:90px; z-index:9999; opacity: 0.9; text-align: center}
.News .Day  { background:#333; color:#fff; line-height:70px; font-size:38px; white-space:nowrap; margin:0px;}
.News .Month_Year  { background:#1e8d90; color:#fff; line-height:25px; font-size:12px; white-space:nowrap;  margin:0px;}
.news_listing ul li .News_Contetent{ border: 5px solid #fff; box-shadow: 0px 0px 2px #ccc;}
.news_listing ul li p{ padding:10px 10px 0 10px}
.news_listing ul li:hover p{ color:#666 }
.news_listing ul li img{ width:100%;}
.news_listing ul li .prev{
   width:100%; 
   opacity: 1;
   background-color: rgba(0,0,0, 0.6);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out; }   
   
.news_listing ul li:hover .prev{opacity: 0.7; }
.news_listing ul li a{ text-decoration:none}
.news_detail{ border: 5px solid #fff; box-shadow: 0px 0px 2px #ccc; position:relative; min-height:250px; clear:both; background:#f7f7f7}
.News_container{ background:#FFFFFF; min-height:300px; margin:15px 15px 15px 115px; padding:15px;}
.news_detail h2{ margin:10px 0 0 115px ; }
div.contextual-links-wrapper{ z-index:1}
.information{ margin:15px 0 0 0; min-height:350px;}
.information ul{ list-style:none; margin:0 0 0 -2%; padding:0px;}
.information ul li{ float:left; width: 31%; margin:0 0 30px 2%; padding:0; line-height:17px; }
.information ul li a{ display:block}
.information ul li a:hover{ color:#9151b2; text-decoration:none}
.information ul li img{ box-shadow:0 0 3px rgba(0,0,0,.3); border:1px solid #fff; margin:0; max-width:100%;}
.information ul li:hover img{ box-shadow:0 0 3px rgba(0,51,204,.3); border:1px solid #0083ca; }
.information p{ margin:0px 0 0 0px; padding:0px 0px; font-size:13px}
.information .date{ margin:0px 0 0 0px; }
.information .date span{ padding:10px 0 5px 20px; color:#666; font-size:13px; display:block; background:url(../images/icon/icon_date.png) no-repeat left center; background-size:17px 17px;}
.information .single{ background:#fff}
.information .double{ background:#f6f6f6}
.pagers{ text-align: center; margin:10px 0;}
.pagers a{ color:#333333; padding:2px 9px; margin:0px 5px; border-radius:50%; line-height:15px;}
.pagers a:hover{ background:#ddd}
.pagers a.current{ color:#fff; background:#0d8796}
.btn_back{text-align: center; margin:20px 0;}
.btn_back a{ padding:7px 20px 7px 40px; background:url(../images/icon_back_white.png) no-repeat #000; background-position:20px 50%; color:#FFF; font-size:21px; text-decoration:none; text-transform:uppercase; }
.btn_back a:hover{ background:url(../images/icon_back_white.png) no-repeat #0d8796; background-position:12px 50%; color:#FFF }

#pages{ float:right; margin:15px 0px 0 ; clear: both; font-size:12px;}
.pages_page{ float:left;padding:0px 10px 0 0;}
#pages ul{ float: left; list-style:none; min-height:17px; margin:0px; padding:0px;}
#pages ul li{  float: left; margin:0px 5px 0px 5px;}
#pages ul li a{ line-height:25px; height:25px; width:25px; display: inline-block; text-align: center; background:#fff; border-radius:50%; color:#333; box-shadow:0 0 3px rgba(0,0,0,.2)}
#pages ul li a:hover{ background:#ececec; text-decoration:underline }
#pages ul li a.pgCurrent{ background:#8ec63f; color:#fff}
.year_box{ position:absolute; right:20px ;top:20px;}

#Information_detail{ background:#fff; box-shadow: 0 0 3px rgb(0,0,0,.2); padding:20px;}

.contactus{}
.contactus .info{ float: left; font-size:15px; width:60%}
.contactus .info table{ margin:15px 0; padding:0px; width:100% ;border-collapse: inherit}
.contactus .info table td{ padding:0px 15px 15px 0px; text-align: left;}
.contactus .info .title_contact{ width:15%; padding-right:15px; }
.contactus .info table a{ color:#0d8796}
.contactus .info table a:hover{ color:#666}
.maparea{ margin:30px 0px; box-shadow: 0px 0px 3px #ccc; padding:2px;}
.maparea iframe{ width:100%; height:450px;}
.contact_form{ float:right; width:36%;}

.sitemap{}
.sitemap ul{ list-style: none; margin:0px; padding:0px;}
.sitemap ul li{ float:left; margin:0px; width:18%; margin:10px 2% 10px 0; }
.sitemap ul li ul{ padding:0px;}
.sitemap ul li ul li{ width:100%;  margin:10px 0% 10px 0; }
.sitemap ul li ul li ul li{ margin:5px 0% 5px 0;}

.sitemap ul li a{ font-size:19px; display: block; border-bottom:1px solid #ddd; padding:0px 0px 10px 0px;}
.sitemap ul li ul li a{ font-size:15px; display: block; border-bottom:0px solid #ddd; padding:0px 0px 0px 0px;}
.sitemap ul li ul li ul li  a{ font-size:13px; display: block; border-bottom:0px solid #ddd; padding:0px 0px 0px 0px;}

#green_tt p{color:#fff}
#green_tt {background:#128695; color:#fff}

.inner_main img{ max-width:100%}