/* ================================== Basic ================================== */
body {font: 16px/24px Heiti TC, "微軟正黑體", "メイリオ", Microsoft JhengHei, Helvetica, Arial, sans-serif;color: #333;}
/* 主外框架 */
.outWrap{width: 100%;margin: 0px;padding: 0px;background: none;}
/* 全站基本標籤樣式設定 */ 
a:link, a:visited {color: #333;text-decoration: none;}
a:hover {color: #09C;}
a:active {color: #333;}
p{line-height:1.5em;text-align: justify;text-justify:inter-ideograph;}

/* 畫面跳轉LOADING.....動畫 */
/* 遮罩mask */
#loading{z-index: 10000;width: 100%;height: 100%;max-width: 100%;max-height: 100%;background: rgba(0,0,0,0.9);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; text-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);}
}
#loading .txt{color: #FFF;}


/* ================================== Header ================================== */
header{position: fixed;margin: 0px;padding: 0px;z-index:9999;width:100%;background:rgba(255,255,255,0.65);max-height: 100px;}
#Head {overflow: hidden;height: 100px;padding:0;margin:0;}
/* Logo */
.topLogo {position: relative;width:20%;float:left;top: 10px!important;;left: 10px;}
.topLogo img {background:none;z-index: 9999;}

/* 上方Icon */
.TopIcon {/*display:none;*/position: absolute;right: 180px;top: 10px;list-style-type: none;}
.TopIcon li {display: inline-block;margin: 0px 2px;padding: 0 5px;}
.TopIcon li a {font-size: 1.25em;}
.TopIcon li a > i {color: #FFF;background: #26496f;border-radius: 99em;width: 30px;height: 30px;text-align: center;line-height: 30px;}

/* ------------ 系統上方選單列新版(topmenu_new) ------------ */
/* RESPONSIVE NAV STYLES */
#HeadTopMenu{z-index:9999;left: 85% !important;
top: 3px!important;
background-color: rgba(0,0,0,0.55);}
.nav-collapse {margin: 0;padding: 0;}
.nav-collapse ul {margin: 0;padding: 0;width: 100%;display: block;list-style: none;}
.nav-collapse ul li {width: 100%;display: block;}
.js .nav-collapse {clip: rect(0 0 0 0);max-height: 0;position: absolute;display: block;overflow: hidden;zoom: 1;}
.nav-collapse.opened {max-height: 9999px;}
.disable-pointer-events {pointer-events: none !important;}
.nav-toggle {-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-touch-callout: none;-webkit-user-select: none;-moz-user-select: none;
-ms-user-select: none;-o-user-select: none;user-select: none;}

/* 個別選單的icon, img, 背景圖樣式 */
/*.nav-collapse ul li.mid-15 a:before {color: #09C;padding-right:7px;content:"\f0ac";font-family: FontAwesome;font-style: normal;font-weight: normal;}
.nav-collapse ul li.mid-16 a:before {color: #09C;padding-right:7px;content:"\f2c2";font-family: FontAwesome;font-style: normal;font-weight: normal;}
.nav-collapse ul li.mid-18 a:before {color: #09C;padding-right:7px;content:"\f022";font-family: FontAwesome;font-style: normal;font-weight: normal;}
.nav-collapse ul li.mid-20 a:before {color: #09C;padding-right:7px;content:"\f238";font-family: FontAwesome;font-style: normal;font-weight: normal;}
.nav-collapse ul li.mid-17 a:before {color: #09C;padding-right:7px;content:"\f098";font-family: FontAwesome;font-style: normal;font-weight: normal;}*/

/**/
@media screen and (min-width: 1025px) {
.js .nav-collapse {position: relative;}
.js .nav-collapse.closed {max-height: none;}
/*.nav-toggle {display: none;}*/
}

/* 上方選單樣式 */
.fixed {position: fixed;width: 100%;left: 0;top: 0;}
.nav-collapse, .nav-collapse * {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.nav-collapse, .nav-collapse ul {list-style: none;width: 100%;float: left;}
.nav-collapse ul li {
/*float: left;
width: 100%;*/
display: inline;
}
/* 個別選單樣式 */
.nav-collapse ul li a {-webkit-tap-highlight-color: rgba(0,0,0,0);border-top: 1px solid #CCC;text-decoration: none;
padding: 15px 10px 15px 30px;;width: 100%;float: left;font-size: 18px;    border-bottom: thin solid rgba(255,255,255,0.2);color: #fff;
}}
.nav-collapse a:active, .nav-collapse .active a {}
.nav-collapse ul ul a {padding-left: 2em;}

@media screen and (min-width: 1025px) {
.nav-collapse {width: auto;}
.nav-collapse ul{padding:0;margin:0;}
.nav-collapse ul li {width: auto;}
.nav-collapse ul li a {
	/*border-left: 1px solid white;*/
	padding: 1.02em 2em;
	text-align: left;
	border-top: 0;
	float: left;
	margin: 0;
	color: #fff;
}
.nav-collapse ul li a:hover {
color:#33FFFF
	
	
}
.nav-collapse ul ul a {display: none;}

}

/* iPad, Mobile 選單遮罩 */
/*.mask {-webkit-transition: opacity 300ms;-moz-transition: opacity 300ms;transition: opacity 300ms;background: rgba(0,0,0,0.75);visibility: hidden;position: fixed;opacity: 0;z-index: 2;bottom: 0;right: 0;left: 0;top: 0;}
.android .mask {-webkit-transition: none;transition: none;}
.js-nav-active .mask {visibility: visible;opacity: 1;}
@media screen and (min-width: 1025px) {
.mask {display: none !important;opacity: 0 !important;}
}*/

/* iPad,Mobile 選單展開鈕樣式(MENU) */
.nav-toggle {
-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-decoration: none;text-indent: -300px;position: 
relative;overflow: hidden;
width: 80px;height: 80px;
float: right;
/*border:1px #CCC solid;*/
top:30px;right:60px;border-radius:5px;margin-bottom:18px;}
.nav-toggle:before {font-size: 50px;color: #84B7E3;text-transform: none;text-align: center;position: absolute;content:"\f0c9";font-family: FontAwesome;font-style: normal;font-weight: normal;text-indent: 0;speak: none;width: 100%;left: 0;line-height:40px;
}
.nav-toggle.active:before {font-size: 60px;color: #84B7E3;content:"\f00d";font-family: FontAwesome;font-style: normal;font-weight: normal;}
/* ------------ 系統上方選單列新版(topmenu_new) End ------------ */


/* Banner區 */
#featured_div {position: relative;width: 100%;margin: 0px;padding:0px;overflow: hidden;}
/* 讓img填滿全螢幕 */
.featured {height:100vh;} 

/* ================================ Content ================================ */
/* 系統側邊選單列表(mainmenu) */
.MainMenu {position: relative;margin: 0px;padding: 0px;}
/*.MainMenu {position: fixed;top: 0px;left: 580px;margin: 0px;padding: 0px;z-index: 9999;}*/
.MainMenu ul {margin: 0;padding: 0;list-style-type: none;}
.MainMenu li {margin-bottom: 0px;display:inline-block;}
.MainMenu li > a {display: block;padding: 10px;color: #333;}
/*.MainMenu li > a:after {content:"\f0da";font-family: FontAwesome;font-style: normal;font-weight: normal;font-size: 1.25em;float: right;}*/
.MainMenu li > a:hover {background: #09C;color: #FFF;border-radius: 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);}


/* 主區塊內區 */
#Container {width:100%;position: relative;margin: 0px;padding: 0px 0px 30px 0px;overflow: hidden;text-align: left;}
#CenterBlock, #LeftBlock {overflow: hidden;word-wrap: break-word;}
#LeftBlock {margin: 0px;display: none;}
.sectionLeft {overflow: hidden;}
#main_block {}
#CenterBlock {margin: 0px;}
.sectionCenter {}
#RightBlock {display: none;}
/* 頁面路徑連結 */
.SectionTitle {display: none;}
.SectionTitle a:link, .SectionTitle a:visited {}
.SectionTitle a:hover {}
/* 區塊抬頭名稱 */
.blockTitle {padding: 0px 0px 30px 0px;text-align:center;}
.blockTitle h2 {font-size: 1.75em;color: #84B7E3;}
.left_b .blockTitle {}
.center_b .blockTitle {}
/*.center_b .blockTitle span {padding: 0px 0px 5px 0px;border-bottom: 5px solid #F00;border-bottom-left-radius:5px;}*/
.right_b .blockTitle {}
/* 區塊內容 */
.block{padding:50px 0px 0px 0px;margin: 0px 20px;}
.blockContent {padding: 0px;}
.left_b .blockContent {}
.center_b .blockContent {}
.right_b .blockContent {}



.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;}

/* =============================== Footer =============================== */
footer {width:100%;height:240px;position: relative;margin: 0px;padding: 0px;background: #666666;overflow: hidden;}
#Footer {width: 1280px;margin: 0px auto;padding: 0px;color: #FFF;}
#Footer a:link, #Footer a:visited {color: #fff;}
#Footer a:hover {}
.FootMenu {display: block;height: auto;position:absolute;top:20px;right:20px;}
.FootMenu ul {display: none;list-style-type: none;}
.FootMenu li {display: inline-block;}
.FootTitle {display: none;}

/* footer內容資訊 */
/* footer logo - 系統預設與上方頁首logo相同----可自行在footer_info.htm更換 */
.ft_col_1, .ft_col_2, .ft_col_3, .ft_col_4 {float: left;margin: 10px 0px;}
.ft_col_1 {width: 20%;text-align: left;display: none;}
.ft_col_1 img{vertical-align: middle;width: 180px;}
.ft_col_1 h6 {font-size:12px;color:#CCC;margin:0px;padding:10px 0px;line-height: 1.5em;text-align:center;}

/* 公司資訊 */
.ft_col_2 {width: 100%;
text-align: center;line-height: 18px;}
.ft_col_2 ul {list-style-type: none;margin: 0px;padding: 0px;}
.ft_col_2 ul li {font-size: 12px;padding: 2px;line-height: 18px;}
.ft_col_2 ul li:first-child {font-size: 30px;}

/* QR CODE */
.ft_col_3 {width: 15%;text-align: center;display: none;}
.ft_col_3 img{vertical-align: middle;}

/* ICON AND POWER */
.ft_col_4 {width: 20%;display: none;}
.ft_col_4 ul {position: relative;list-style-type: none;padding:0;margin:0;}
.ft_col_4 ul li {display: inline-block;margin: 0px 2px;}
.ft_col_4 ul li a {font-size: 1em;}
.ft_col_4 ul li a > i {color: #FFF;border-radius: 99em;border: 1px solid #FFF;width: 30px;height: 30px;text-align: center;line-height: 30px;}
.ft_col_4 ul li a:hover > i {opacity: 0.75;}
/**/
ul.iconimg li{
display:inline-block;

}
/* 回到頁首 */
#goTop {display: none;position: fixed;bottom: 5px;right: 5px;width: 40px;height: 40px;z-index: 9999;cursor: pointer; }
#goTop a i {font-size: 2.5em;color: rgba(0,0,0,0.75);}
#goTop a i:hover {opacity: 0.75;}


#bc_57{
margin-top:100px;
}
#bc_68{
top:-700px;
display: flex;
align-items: center;
justify-content: center;
position:relative;

margin:0 auto;
}

.amlogo{
display:none;
}
#bc_59{
transform: none!important;
    opacity: 10!important;
	}
	
/**/
.Cupid-1{
float: left;
padding: 0 20px;
margin: 0px 50px 0px 0px;
color:#A6AAAD;line-height: 1.8em;font-size:18px;
width: 50%;
height: 450px;
}

.Cupid-2{
margin: 0 50px;
color:#A6AAAD;line-height: 1.8em;font-size:18px;
}
/* ========================================= Responsive Start ========================================= */
@media only screen and (max-width: 1440px) {
.view-third a.info2 {
   
 
    top: 57%!important;
   
}
}
@media only screen and (max-width: 1366px) {
.view-third a.info2 {
    
    right: 86%!important;
    top: 50%!important;
    
}
.info {
    
    
    top: 50%!important;
    
}
}
@media only screen and (max-width: 1250px) {
#HeadTopMenu {
  
    left: 50% !important;
   
   
}
.amlogo{
display:none!important;
}

}
@media screen and (min-width: 1201px) {
	#bc_60,#bc_61{
display:none;
}
}
@media screen and (max-width: 1200px) {
	#bc_59{
display:none;
}
.Cupid-1{
float:none;
width: 90%;


}

.Cupid-2 {
    margin: 0px 10px;
    

}
}
@media only screen and (max-width: 1024px) {
header{position: fixed;width: 100%;margin-left:0px;/*box-shadow: 0px 1px 2px 2px rgba(0,0,0,0.25);background:#FFF;*/height:80px;}
/*#form_column_sort_div {display: none;}*/
#Logo {z-index: 100000;}
.topLogo {width:auto;zoom: 0.7;top:15px!important;}
#HeadTopMenu{
/*background:#FFF;*/
}
.flexslider .slides > li {
  height: 100%;
  width: 100%;
  display: none; 
  -webkit-backface-visibility: hidden;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#featured_div{
/*padding-top:80px;*/
height:auto;}
#featured_div img {} 
#LeftBlock, #CenterBlock {width: 100%;margin: 0px;}
.block{padding:0px;margin: 0px 10px;}
footer {height:auto;}
#Footer {width: 100%;margin: 0px;}
.ft_col_1, .ft_col_2, .ft_col_3, .ft_col_4 {width: 100%;line-height:0px;text-align: center;padding: 20px 0px;margin: 0px;}
.ft_col_2 ul {margin: 0px;}
.ft_col_2 ul li {
   
    line-height: 26px;
}
#HeadTopMenu {
   top: -20px !important;
    left: 0% !important;
   
   
}
.nav-toggle {
   
    top: 20px;
    right: 0px;
   
}
.TopIcon {/*display:none;*/position: absolute;right: 90px;top: 10px;list-style-type: none;zoom: 0.8;}
.TopIcon li {
    margin: 0px;
    padding: 0px;
}
#bc_57{
margin-top:0px;
}
}
@media only screen and (max-width: 840px) {
.ft_center {width: 100%;}
.ft_right {width: 100%;}
.ft_right ul {text-align: center;padding: 10px 0px;}

}
@media only screen and (max-width: 480px) {
.outWrap .footer-wrap-col{margin: 10px;}
.blockTitle {padding: 20px 0px 20px 0px;}
/*.ft_left img{width: 50%;}*/
.ft_center .col-1-3, .ft_center .col-2-3 {width: 100%;}
.ft_center .wrap-col p {text-align: center;}


.topLogo {
    
    zoom: 0.55;
    top: 30px!important;
}
.cp {
    

background-color: #000!important;
padding: 20px!important;
margin-top: -40px!important;
}
#bc_61{
margin-top:-5px;
}
#bc_80.blockContent{

/*transition:none!important;
transform:none!important;*/
opacity: 10!important;
}
.Cupid-1 {
text-align:center;
  
   
}
.Cupid-2 {
  
    margin-top: 280px;
}
.Cupid-2img {
margin: 0 auto;
   width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
  
  
}
}
.cp {
    color: #83B8E4;
font-size: 12px;
text-align: center;
margin-bottom: 30px;
margin-top: 50px;
background-color: rgba(0,0,0,0.7);
padding: 20px;
margin-top: -100px;
}
#bb_52{
display:none;
}
/**/
.mask2  p{
color: #fff;
font-size: 36px;
padding-top: 50%;
text-align:center;
font-weight:bold

}
.view .mask,.view .content {
   width: 50%;
   height: 970px;
   position: absolute;
   overflow: hidden;
   display:block!important;
  
   top: 0;
   right: 0;
}
.mask2 {
   width: 50%;
   height: 970px;
   position: absolute;
   overflow: hidden;
  
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
   transition: all 0.3s linear;
}
.view img:hover {
    /*opacity: 0.6;*/
	/*transform: scale(1.05);*/
	
}
.view icon1 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
  
   margin: 20px 0 0 0;
}
.view icon2 {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 12px;
   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}


.view-third .mask {
   background-color: rgba(0,0,0,0.4);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   /*-webkit-transform: translate(460px, -100px) rotate(180deg);
   -moz-transform: translate(460px, -100px) rotate(180deg);
   -o-transform: translate(460px, -100px) rotate(180deg);
   -ms-transform: translate(460px, -100px) rotate(180deg);
   transform: translate(460px, -100px) rotate(180deg);*/
   -webkit-transition: all 0.2s 0.4s ease-in-out;
   -moz-transition: all 0.2s 0.4s ease-in-out;
   -o-transition: all 0.2s 0.4s ease-in-out;
   -ms-transition: all 0.2s 0.4s ease-in-out;
   transition: all 0.2s 0.4s ease-in-out;
}
.mask2 {
   background-color: rgba(0,0,0,0.4);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   /*-webkit-transform: translate(460px, -100px) rotate(180deg);
   -moz-transform: translate(460px, -100px) rotate(180deg);
   -o-transform: translate(460px, -100px) rotate(180deg);
   -ms-transform: translate(460px, -100px) rotate(180deg);
   transform: translate(460px, -100px) rotate(180deg);*/
   -webkit-transition: all 0.2s 0.4s ease-in-out;
   -moz-transition: all 0.2s 0.4s ease-in-out;
   -o-transition: all 0.2s 0.4s ease-in-out;
   -ms-transition: all 0.2s 0.4s ease-in-out;
   transition: all 0.2s 0.4s ease-in-out;
    width: 50%;
	left:0;
}

.info {
   /*-webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;*/
   position: absolute;
   left: 86%;
   top:680px;
   /*opacity: 0.5;*/
}
.view-third a.info2 {
  /*-webkit-transform: translateY(-200px);
   -moz-transform: translateY(-200px);
   -o-transform: translateY(-200px);
   -ms-transform: translateY(-200px);
   transform: translateY(-200px);
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;*/
   position: absolute;
   right: 88%;
   top:680px;
    /*opacity: 0.5;*/
}
.view-third:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
   -webkit-transform: translate(0px, 0px);
   -moz-transform: translate(0px, 0px);
   -o-transform: translate(0px, 0px);
   -ms-transform: translate(0px, 0px);
   transform: translate(0px, 0px);
   -webkit-transition: 0.6s;
   -moz-transition: 0.6s;
   -ms-transition: 0.6s;
   -o-transition: 0.6s;
   transition: 0.6s;
}
.mask2:hover {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
   -webkit-transform: translate(0px, 0px);
   -moz-transform: translate(0px, 0px);
   -o-transform: translate(0px, 0px);
   -ms-transform: translate(0px, 0px);
   transform: translate(0px, 0px);
   -webkit-transition: 0.6s;
   -moz-transition: 0.6s;
   -ms-transition: 0.6s;
   -o-transition: 0.6s;
   transition: 0.6s;
}
.view-third:hover a.info {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.3s;
   -moz-transition-delay: 0.3s;
   -o-transition-delay: 0.3s;
   -ms-transition-delay: 0.3s;
   transition-delay: 0.3s;
   
   
}
	.view-third:hover a.info2 {
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
   -webkit-transition-delay: 0.3s;
   -moz-transition-delay: 0.3s;
   -o-transition-delay: 0.3s;
   -ms-transition-delay: 0.3s;
   transition-delay: 0.3s;
}	
.info2:hover	{	
 opacity: 1;
}


/***/
.w3-col.s4{
/*width:33.33333%*/
margin: 4px 6px;
}

.w3-content{
margin-left:auto;
margin-right:auto;
}

.w3-content{
float: left;
width: 80%;
margin-top: 3px;
}

.w3-section{
width: 20%;
float: right;

}

/**/