@import url("reset.css");
@import url("FontAwesome_4.6.3/css/font-awesome.css");
@import url("FontAwesome_4.6.3/css/font-awesome.min.css");

/* ================================== Basic ================================== */
html {font: 13px/18px Heiti TC, "微軟正黑體", "メイリオ", Microsoft JhengHei, Helvetica, Arial, sans-serif;}
html, body {width: 100%;max-width: 100%;height: 100%;padding: 0;margin: 0;-webkit-tap-highlight-color: transparent;}
body {font-size: 1.25em;-webkit-text-size-adjust: none;background-size: cover; background:url(/WebMaster/images/css_new/background/bg_01.jpg) no-repeat left center fixed; overflow-x: hidden;color: #EEE;}
/* 防止超出邊界 */
.bodyWrap {position: relative;min-height: 100%;*display: table; /* For IE7 Hack */*height: 100%; /* For IE7 Hack */}
.b-box {-o-webkit-box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;}
/* CKEditor RWD Object 處理 */
embed, object, iframe {width: 100%;height:100%;}
.embededContent {position:relative; padding-bottom:62.75%; padding-top:30px;height: 0;overflow: hidden; float:none;}
.embededContent embed, .embededContent object, .embededContent iframe{position: absolute;top:0;left:0;width: 100%;height:100%;}
/* 基本標籤物件處理 */
img {max-width: 100%;height: auto;width: auto/9;} 
a:link, a:visited {color: #FFF;text-decoration: none;}
a:hover {color: #F90;}
a:active {color: #333;}
p{line-height:1.313em;text-align: justify;text-justify:inter-ideograph;padding-bottom: 15px;}
input[type=button], input[type=submit], input[type=reset]{cursor: pointer;}
/* 首頁會員中心顯示 */
#bb_6.block {display: none;} 
/* 系統後台管理選單 */
#MoveNav{height: auto;width: 190px;position: fixed;z-index: 99999;} 
/* 刪除繼承父樣式 */
.clear {clear: both;}

/* Loading Mask */
#loading{z-index: 100000;width: 100%;height: 100%;max-width: 100%;max-height: 100%;background: rgba(255,153,0,0.95);position: fixed;}
#loading .loader {font-size: 0.75em;position: absolute;top: 0;right: 0;bottom: 0;left: 0;margin: auto;border-top: 1.1em solid rgba(255, 255, 255, 0.2);border-right: 1.1em solid rgba(255, 255, 255, 0.2) ;border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);border-left: 1.1em solid #ffffff;-webkit-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);-webkit-animation: load8 1.1s infinite linear;animation: load8 1.1s infinite linear; -indent: -9999em;}
.loader, .loader:after {border-radius: 50%;width: 10em;height: 10em;}
@-webkit-keyframes load8 {
  0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
  100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}
@keyframes load8 {
  0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
  100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}

/* ================================== Header ================================== */
header{position: relative;margin: 0;padding: 0;width: 100%; z-index: 9999;}
#Head {overflow: hidden;height: 130px;}
img#Logo {position: absolute;top :30px;left: 0;margin: 0;padding: 0;z-index: 9998;}
#HeadTopMenu {width: 100%;z-index: 9997;}
/* 自製上方Icon功能 */
.topIcon {position: relative;text-align: right;width: 100%;padding-top: 20px;}
.topIcon ul {margin: 0;padding: 0px;display: inline-block;list-style-type: none;}
.topIcon ul li {float: left;margin-left: 10px;}
/* 上方Searching jQuery */
.sb-search {position: relative;width: 0%;min-width: 36px;height: 36px;display: inline-block;overflow: hidden;-webkit-transition: width 0.3s;-moz-transition: width 0.3s;transition: width 0.3s;-webkit-backface-visibility: hidden;margin-right: 0px;}
.sb-search-input {position: absolute;top: 0;right: 0;border: none;outline: none;background: rgba(255,255,255,0.35);width: 200px;height: 36px;margin: 0;z-index: 10;padding: 0px 0px 0px 5px;font-family: inherit;color: #FFF;}
.sb-search-input::-webkit-input-placeholder {color: #FFF;font-size: 1.05em;}
.sb-search-input:-moz-placeholder {color: #FFF;font-size: 1.05em;}
.sb-search-input::-moz-placeholder {color: #FFF;font-size: 1.05em;}
.sb-search-input:-ms-input-placeholder {color: #FFF;font-size: 1.05em;}
.sb-icon-search,.sb-search-submit {width: 36px;height: 36px;display: block;position: absolute;right: 0;top: 0;padding: 0;margin: 0;line-height: 36px;text-align: center;cursor: pointer;}
.sb-search-submit {background: rgba(255,255,255,0.25); /* IE needs this */-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */filter: alpha(opacity=0); /* IE 5-7 */opacity: 0;color: transparent;border: none;outline: none;z-index: -1;}
.sb-icon-search {color: #fff;background: rgba(255,255,255,0.25);z-index: 10;font-family: FontAwesome;speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;-webkit-font-smoothing: antialiased;}
.sb-icon-search:before {content: "\f002";font-family: FontAwesome;font-style: normal;font-weight: normal;font-size: 1.25em;}
/* Open state */
.sb-search.sb-search-open,
.no-js .sb-search {width: 201px;}
.sb-search.sb-search-open .sb-icon-search,
.no-js .sb-search .sb-icon-search {background: #F90;color: #fff;z-index: 11;}
.sb-search.sb-search-open .sb-search-submit,
.no-js .sb-search .sb-search-submit {z-index: 90;}

/* 系統上方選單列新版(topmenu_new) */
.TopMenuNew {height: auto;position: absolute;top: 95px;right: 0;background: none;}
.TopMenuNew ul {display: inline-block;margin: 0;padding: 0;list-style: none;}
.TopMenuNew ul li {float: left;position: relative;white-space: nowrap;}
.TopMenuNew ul > li {-webkit-transition: opacity 0.8s;transition: opacity 0.8s;}
.TopMenuNew ul li a {color: #FFF;display: block;line-height: 2em;text-shadow: 2px 2px 5px rgba(0,0,0,0.35);font-weight: 500;padding: 0px 0px 0px 20px;}
.TopMenuNew a:hover {-webkit-transition: opacity 0.8s;transition: opacity 0.8s;color: #F90;}
.TopMenuNew li:hover > a {color: #F90;}
.TopMenuNew ul ul {position: absolute;top: 100%;margin: 0px;padding: 0;list-style: none;left: 9999px;opacity: 0;-webkit-transition: opacity 0.8s;transition: opacity 0.8s;}
.TopMenuNew ul ul li {float: none;}
.TopMenuNew ul ul li a {padding: 0px 40px 0px 19px;text-shadow: none;}
.TopMenuNew ul ul li a:hover {background: none;color: #F90;}
.TopMenuNew ul li:hover > ul {display: block;opacity: 1;-webkit-transition: opacity 0.8s;transition: opacity 0.8s;left: 0px;background: rgba(51,51,51,0.85);padding: 3px 3px 6px 3px;border-top: #F90 3px solid;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;}
/* Mobile-Pad 主選單關閉 */
.menu-btn, .pushy {display:none;}
/* Mobile-Pad 主選單 Bar Area */
.container {position:relative;height: 100%;width: 100%;left: 0;-webkit-transition: left 0.5s ease-in-out;-moz-transition: left 0.5s ease-in-out;-ms-transition: left 0.5s ease-in-out;-o-transition: left 0.5s ease-in-out;transition: left 0.5s ease-in-out;}
.container.open-sidebar {left: 215px;}
.search_rwd {display:none;}

/* 系統上方選單列初始版(topmenu_default) */
.TopMenu{display: none;}
.TopMenu ul {}
.TopMenu li {}
.TopMenu a:link, .TopMenu a:visited {}
.TopMenu a:hover {}

/* 系統側邊選單列表(mainmenu) */
.MainMenu {margin: 10px 0px 10px 30px;padding: 10px 20px;background: rgba(222,242,241,0.1);border-radius: 5px;border: rgba(222,242,241,0.15) 1px solid;}
.MainMenu ul {margin: 0px;padding: 0;}
.MainMenu li {list-style-type: none;padding: 5px 30px 5px 0px;display: inline-block;}
.MainMenu a:link, .MainMenu a:visited {display: block;position: relative;color: #FFF;text-shadow: 0px 0px 10px rgba(95,240,254,0.75),0px 0px 10px rgba(95,240,254,0.75);}
.MainMenu a:hover {text-shadow: none;}
.MainMenu a:after {content: "\f06c";font-family: FontAwesome;font-style: normal;font-weight: normal;padding-left: 5px;}
.MainMenu .sub_menu, .MainMenu .sub_menu_end {padding-left: 20px;background-image: url(../images/system/li_sub_menu.gif);background-position: left center;
background-repeat: no-repeat;}
.MainMenu .sub_menu_end {background-image: url(../images/system/li_sub_menu_end.gif);}


/* ================================ Content ================================ */
#Container {position: relative;text-align: left;margin: 0px;padding: 0px 0px 120px 0px;overflow: hidden;width: 100%;z-index: 0;}
#main_block {width: 100%;background: rgba(0,0,0,0.5);padding: 20px 0px;}
#CenterBlock, #LeftBlock {overflow: hidden;word-wrap: break-word;}
#LeftBlock {width: 100%;}
.sectionLeft {overflow: hidden;}
#CenterBlock {width: 100%;}
.sectionCenter {float: right;overflow: hidden;}
#RightBlock {}
#RightBlock .blockTitle {}
#RightBlock .blockContent {}

/*首頁自製區域內容*/
.center_top {float: left;vertical-align: middle;margin: 0px;width: 100%;}
.center {float: left;vertical-align: middle;margin: 0px;width: 33.33%;}
.center img{max-height: 100%;}

/* 頁面路徑連結 */
.SectionTitle {padding-left: 10px;display: none;}
.SectionTitle a:link, .SectionTitle a:visited {color: #666;}
.SectionTitle a:hover {color: #333;}
/* 區塊抬頭名稱 */
.blockTitle {font-size: 1.313em;width: auto;padding: 20px 10px 20px 45px;background:url(/WebMaster/images/css_new/blockTitle_icon/blockTitle_c.png) no-repeat left center;margin-left: 45px;}
.left_b .blockTitle {}
.center_b .blockTitle {}
.right_b .blockTitle {}
/* 區塊內容 */
.blockContent {margin: 0px 25px;padding: 0px;}
.left_b .blockContent {margin: 0px 10px;}
.center_b .blockContent {margin: 10px 10px 10px 35px;}
.right_b .blockContent {margin: 0px;}

.indent {padding-left: 20px;padding-top: 5px;}
.plus_html {margin: 5px 5px 5px 10px;clear: both;}
.show_sub ul {margin: 1px 10px 5px 15px;padding: 1px;}
.show_sub li {list-style-type: none;padding: 3px;margin: 2px 5px 2px 1px;}

/* fix */
.blockContent {height: 1%}
.lastObject {clear: both;}

/* =============================== Footer =============================== */
footer {width: 100%;margin: 0;position: absolute;bottom: 0;left: 0;background:rgba(0,0,0,0.5);overflow: hidden;}
#Footer {position:relative;margin: 0;padding: 10px;}
#Footer .rowLeft{position:relative;margin:0;float: left;width: 66.66%;}
#Footer .rowCenter{}
#Footer .rowRight{position:relative;margin:0;float: right;width: 33.33%;text-align: left;}
#Footer .rowRight .wm {position: absolute;top: 15px;right: 0;}
#Footer .rowRight ul {margin: 20px 0px 0px 0px;padding: 0;list-style-type: none;}
#Footer .rowRight ul li {display: inline-block;font-size: 1.5em;}
#Footer .rowRight ul li a{padding: 5px 6px;}
#Footer h2{margin: 0;padding: 0px;font-size: 1.05em;font-weight: bold;line-height: 1.25em;}
#Footer h6{margin: 0;padding: 0px;font-size: 0.75em;font-weight: normal;line-height: 1.25em;}
#Footer h2 p, #Footer h6 p {display: inline-block;margin: 0;padding: 0px;}
#Footer a:link, #Footer a:visited {}
#Footer a:hover {}
.FootMenu {display: none;height: 0;}
.FootMenu ul {}
.FootMenu li {}
.FootTitle {display: none;height: 0;}
.CopyRight {clear: both;}
.wm{clear: both;}


/* =============================== Responsive Start =============================== */
@media only screen and (max-width: 1024px) {
#MoveNav {display: none;}
header{position: fixed;background: rgba(0,0,0,0.9);box-shadow: 0 3px 2px 0px rgba(0,0,0,0.15);}
#Head {overflow: hidden;height: 80px;}
img#Logo{position: absolute;top: 7px;left: 10px;float: none;margin: 0;padding: 0;width: auto;height:80%;}
.topIcon {padding-top: 22px;right: 60px;}
.TopMenuNew {display: none;}
#Container {padding-top: 80px;}
.blockTitle {line-height: 1.5em;}

/* Mobile-Pad 主選單樣式及開啟 */
.menu-btn, .pushy {display: block;}
.menu-btn {width: 60px; height: 40px;padding:25px 5px 5px 5px;color: #FFF;text-align: center; cursor: pointer;font-size:2em;position: absolute;top: 0px;right: 0px;z-index: 9998;}
.menu-btn:hover {opacity: 0.75;}
.sb-search-m {margin: 10px;}
.sb-search-m input[type=text] {display: inline-block;width:100px;height: 25px;}
.sb-search-m input[type=button] {display: inline-block;width:25px;height: 25px;}
.pushy {position: fixed;width: 215px;height: 100%;top: 0;z-index: 10000;background: rgba(0,0,0,0.75);overflow: auto;visibility: hidden;-webkit-overflow-scrolling: touch;}
.pushy h3 {font-size:1.125em;padding: 10px 10px 10px 15px;color: #FFF;background: rgba(255,153,0,0.9);} 
.pushy ul {list-style-type: none;margin: 0;padding: 0;}
.pushy a {color: #FFF;display: block;text-decoration: none;outline: 0;}
.pushy a:hover {color: #F90;}
.pushy ul:first-child {margin-top: 10px;}
.pushy.pushy-left {left: 0;}
.pushy.pushy-right {right: 0;}
/* Menu Movement */
.pushy-left {-webkit-transform: translate3d(-215px, 0, 0);-ms-transform: translate3d(-215px, 0, 0);transform: translate3d(-215px, 0, 0);}
.pushy-open-left #container, .pushy-open-left .push {-webkit-transform: translate3d(215px, 0, 0);-ms-transform: translate3d(215px, 0, 0);transform: translate3d(215px, 0, 0);}
.pushy-right {-webkit-transform: translate3d(215px, 0, 0);-ms-transform: translate3d(215px, 0, 0);transform: translate3d(215px, 0, 0);}
.pushy-open-right #container,
.pushy-open-right .push {-webkit-transform: translate3d(-215px, 0, 0);-ms-transform: translate3d(-215px, 0, 0);transform: translate3d(-215px, 0, 0);}
.pushy-open-left .pushy,
.pushy-open-right .pushy {-webkit-transform: translate3d(0, 0, 0);-ms-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);}
/* Menu Transitions */
#container, .pushy, .push {transition: transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);}
/* Site Overlay */
.site-overlay {display: none;}
.pushy-open-left .site-overlay,
.pushy-open-right .site-overlay {display: block;position: fixed;top: 0;right: 0;bottom: 0;left: 0;z-index:9999;background-color: rgba(255,255,255,0.9);-webkit-animation: fade 500ms; animation: fade 500ms;}

@keyframes fade {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
@-webkit-keyframes fade {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
.pushy-submenu {/* Submenu Icon */}
.pushy-submenu ul {padding: 0px 0px 0px 10px;transition: max-height 0.2s ease-in-out;margin: 0px;}
.pushy-submenu ul .pushy-link {transition: opacity 0.2s ease-in-out;padding: 5px 0px 15px 10px;}
.pushy-submenu > a {position: relative;border-top: 1px #666 solid;padding: 15px 0px 15px 15px;}
.no-link > a {position: relative;border-top: 1px #666 solid;padding: 15px 0px 15px 15px;}
.pushy-submenu > a::after {
  content: '';
  display: block;
  height: 11px;
  width: 8px;
  position: absolute;
  top: 45%;
  right: 15px;
  content:"\f0da";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  float:right;
  margin-right: 5px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  transition: transform 0.2s;
}
.pushy-submenu-closed ul {max-height: 0;overflow: hidden;}
.pushy-submenu-closed .pushy-link {opacity: 0;}
.pushy-submenu-open {/* Submenu Icon */}
.pushy-submenu-open ul {max-height: 1000px;}
.pushy-submenu-open .pushy-link {opacity: 1;}
.pushy-submenu-open a::after {-webkit-transform: translateY(-50%) rotate(90deg);-ms-transform: translateY(-50%) rotate(90deg);transform: translateY(-50%) rotate(90deg);}
.no-csstransforms3d .pushy-submenu-closed ul {max-height: none;display: none;}
/* Mobile-Pad 主選單 ----- End */
}

@media only screen and (max-width: 960px) {
#Container {padding-bottom: 20px;}
footer {position: relative;}
}

@media only screen and (max-width: 840px) {
.MainMenu {padding: 5px 10px;margin: 10px;}	
.blockTitle {padding: 0px 0px 0px 45px;margin: 5px 20px;}
.center_b .blockContent {margin: 10px;}
#Footer .rowLeft, #Footer .rowCenter ,#Footer .rowRight {width: 100%;}
#Footer .rowRight {text-align: center;}
#Footer .rowRight .wm{position: relative;margin-bottom: 20px;}
}

@media only screen and (max-width: 768px) {
.center{display: block;width: 50%;}
}

@media only screen and (max-width: 640px) {	
.topIcon {display: none;}
#LeftBlock {margin-bottom: 0px;}
#LeftBlock, #CenterBlock {width: 100%;float: none;}
.left_b .blockTitle {margin: 0px 0px 0px 15px;}
.MainMenu {margin: 20px 0px 10px 0px;}
.search_rwd {position: relative;display: inline-block;margin: 20px 15px;width: 100%;}
.search_rwd_input {width: 150px;height: 20px;padding: 0;margin: 0;float: left;}
.search_rwd_input::-webkit-input-placeholder {color: #CCC;}
.search_rwd_input:-moz-placeholder {color: #CCC;}
.search_rwd_input::-moz-placeholder {color: #CCC;}
.search_rwd_input:-ms-input-placeholder {color: #CCC;}
.search_rwd a {float: left;margin: 0px 10px;}
.search_rwd a:hover {color: rgba(22,137,198,0.85);}
.search_rwd a:before{content: "\f002";font-family: FontAwesome;font-style: normal;font-weight: normal;font-size: 1.25em;width: 20px;height: 20px;-webkit-font-smoothing: antialiased;line-height: 20px;}
}

@media only screen and (max-width: 480px) {
#main_block {padding: 15px 0px;}	
.center {width: 100%;}
#Footer h2, #Footer h6{padding-bottom: 10px;}
}

@media only screen and (max-width: 320px) {

}