@charset "utf-8";
/* CSS Document */
#Wrap { padding-top:60px; }

/*----------------------------------------------------------------------*/
/* Header */
#Header { padding:0 10px 0 70px; position:fixed; }
#Header > div { height:60px; }

/* 關係企業 */
#Header div.conglomerate { display:none; }

/* logo */
#Header .logo h1 { margin:0 auto; }
#Header .logo a { width:220px; }
#Header .logo span { display:none; }

/* top_links */
.top_links { display:none; }


/*----------------------------------------------------------------------*/
/* Menu */
#Menu { display:none; }


/*----------------------------------------------------------------------*/
/* Center */


/*----------------------------------------------------------------------*/
/* Footer */
#Footer { display:none; }
#Copyright { font-size:13px; }
#Copyright .copyright, #Copyright .slogan { margin-left:155px; line-height:20px; }
#Copyright .btn_grandtech { position:absolute; top:20px; left:10px; }


/*----------------------------------------------------------------------*/
/* KeyVisual */
#KeyVisual .bx-wrapper .bx-pager { display:none; }
#KeyVisual .bx-wrapper .bx-controls-direction a { width:40px; height:60px; margin-top:-30px; }
#KeyVisual .bx-wrapper .bx-controls-direction a::after { width:20px; height:20px; margin-top:-10px; }
#KeyVisual .bx-wrapper .bx-controls-direction .bx-prev::after { left:10px; }
#KeyVisual .bx-wrapper .bx-controls-direction .bx-next::after { right:10px; }
@media screen and (orientation: portrait) and (max-width: 640px) {
#KeyVisual .bx-wrapper { padding-bottom:120%; }
}

.down_arrow a { 
	margin-left:-24px; border-top:34px solid #fff; border-left:24px solid transparent; border-right:24px solid transparent; 
	}


/*----------------------------------------------------------------------*/
/* 首頁區塊 */
.block_title h2 { font-size:24px; }

/* 活動訊息 */
.index_event_list { background-image:url("../images/index_event_list_bg_mobile.png"); background-position:center bottom; }
.index_event_list .item { padding:10px 20px; }
.index_event_list .item .cont { padding:10px 10px 5px 10px; }

.index_event_list .owl-carousel .owl-nav .owl-prev, .index_event_list .owl-carousel .owl-nav .owl-next { 
	background-color:#fff; 
	-webkit-box-shadow:0 0 10px rgba(0,0,0,0.2);
	-moz-box-shadow:0 0 10px rgba(0,0,0,0.2);
	box-shadow:0 0 10px rgba(0,0,0,0.2);
	}
.index_event_list .owl-carousel .owl-nav .owl-prev:hover, .index_event_list .owl-carousel .owl-nav .owl-next:hover {  
	-webkit-box-shadow:0 0 10px rgba(0,0,0,0.4);
	-moz-box-shadow:0 0 10px rgba(0,0,0,0.4);
	box-shadow:0 0 10px rgba(0,0,0,0.4);
	}
.index_event_list .owl-carousel .owl-nav .owl-prev::after, .index_event_list .owl-carousel .owl-nav .owl-next::after { 
	margin-top:-6px; width:12px; height:12px; border-color:#7c7c7c; 
	}
.index_event_list .owl-carousel .owl-nav .owl-prev { left:-5px; }
.index_event_list .owl-carousel .owl-nav .owl-next { right:-5px; }
.index_event_list .owl-carousel .owl-nav .owl-prev::after { margin-left:-5px; }
.index_event_list .owl-carousel .owl-nav .owl-next::after { margin-right:-5px; }

/* 企業新聞 */
.IndexNews::before { padding-bottom:60px; }
.IndexNews::after { bottom:0; left:0; width:10.9375%; height:140px; }
.IndexNews > div { padding-top:60px; padding-bottom:100px; }
.IndexNews > div::before { top:40px; right:20px; width:80px; height:67px; }
.IndexNews > div::after { bottom:9.0342%; left:9.2708%; width:50px; height:36px; }
.index_news_list .title a { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:60px; }

/* 事業群 */
.index_conglomerate_block { padding-bottom:40px; }

@media screen and (max-width: 767px) {
.index_conglomerate_block .img, .index_conglomerate_block .cont { padding-top:40px; }
.index_conglomerate_block .img { max-width:480px; margin-left:auto; margin-right:auto; padding-left:20px; padding-right:20px; }
.index_conglomerate_block .cont > div { padding-left:20px; padding-right:20px; }

/* block2 */
.IndexConglomerate .index_conglomerate_block:nth-child(2) .cont::before { display:none; }
.IndexConglomerate .index_conglomerate_block:nth-child(2) .cont::after { display:none; }

/* block3 */
	
/* block4 */
.IndexConglomerate .index_conglomerate_block:nth-child(4) .cont::before { display:none; }
.IndexConglomerate .index_conglomerate_block:nth-child(4) .cont::after { display:none; }
}
@media screen and (min-width: 768px) {
.index_conglomerate_block .img { width:52%; }
.index_conglomerate_block .img, .index_conglomerate_block .cont { padding-top:60px; }
.IndexConglomerate .index_conglomerate_block:nth-child(odd) .img { float:right; }
.IndexConglomerate .index_conglomerate_block:nth-child(even) .img { float:left; }

.IndexConglomerate .index_conglomerate_block:nth-child(odd) .cont > div { padding-left:20px; padding-right:40px; margin-right:52%; }
.IndexConglomerate .index_conglomerate_block:nth-child(even) .cont > div { padding-left:40px; padding-right:20px; margin-left:52%; }

/* block2 */
.IndexConglomerate .index_conglomerate_block:nth-child(2) .cont::before { top:-8%; right:7%; width:100px; height:84px; }
.IndexConglomerate .index_conglomerate_block:nth-child(2) .cont::after { bottom:12%; right:2.5%; width:50px; height:38px; }

/* block3 */
.IndexConglomerate .index_conglomerate_block:nth-child(3) .cont::before { top:-8%; left:2%; width:70px; height:60px; }
	
/* block4 */
.IndexConglomerate .index_conglomerate_block:nth-child(4) .cont::before { top:-4%; right:22%; width:40px; height:46px; }
.IndexConglomerate .index_conglomerate_block:nth-child(4) .cont::after { top:6%; right:2%; width:80px; height:68px; }
}

	/* 動畫效果 */
	@media screen and (max-width: 767px) {
	.IndexConglomerate .index_conglomerate_block .img {
		transform:scale(1.2); transform-origin:center center;
		}
	.IndexConglomerate .index_conglomerate_block .block_title,
	.IndexConglomerate .index_conglomerate_block .desc {
		transform:translateY(-50px);
		}
	.IndexConglomerate .index_conglomerate_block .img.active {
		transform:scale(1);
		}
	.IndexConglomerate .index_conglomerate_block .cont.active .block_title,
	.IndexConglomerate .index_conglomerate_block .cont.active .desc {
		transform:translateY(0); 
		}
		
	.IndexConglomerate .index_conglomerate_block .btn_more { transform:translateX(80px); }
	.IndexConglomerate .index_conglomerate_block .btn_more.active { transform:translateX(0);}
	}
	@media screen and (max-width: 767px) and (orientation: portrait) {
	.IndexConglomerate .index_conglomerate_block .img,
	.IndexConglomerate .index_conglomerate_block .cont {
		transition-delay:0.3s;
		}
	}
	@media screen and (max-width: 767px) and (orientation: landscape) {
	.IndexConglomerate .index_conglomerate_block .block_title,
	.IndexConglomerate .index_conglomerate_block .desc {
		-webkit-transition:transform 0.5s ease, opacity 0.5s ease;
		-moz-transition:transform 0.5s ease, opacity 0.5s ease;
		transition:transform 0.5s ease, opacity 0.5s ease;
		}
	}
	@media screen and (min-width: 768px) {
	.IndexConglomerate .index_conglomerate_block:nth-child(odd) .img {
		transform:translateX(100px);
		}
	.IndexConglomerate .index_conglomerate_block:nth-child(odd) .block_title,
	.IndexConglomerate .index_conglomerate_block:nth-child(odd) .desc {
		transform:translateX(-100px);
		}
	.IndexConglomerate .index_conglomerate_block:nth-child(even) .img {
		transform:translateX(-100px);
		}
	.IndexConglomerate .index_conglomerate_block:nth-child(even) .block_title,
	.IndexConglomerate .index_conglomerate_block:nth-child(even) .desc {
		transform:translateX(100px);
		}
	.IndexConglomerate .index_conglomerate_block .img.active,
	.IndexConglomerate .index_conglomerate_block .cont.active .block_title,
	.IndexConglomerate .index_conglomerate_block .cont.active .desc {
		transform:translateX(0);
		}
		
	.IndexConglomerate .index_conglomerate_block:nth-child(odd) .btn_more { transform:translateX(80px); }
	.IndexConglomerate .index_conglomerate_block:nth-child(even) .btn_more { transform:translateX(-80px); }
	.IndexConglomerate .index_conglomerate_block .btn_more.active { transform:translateX(0);}
	}


/*----------------------------------------------------------------------*/
/* 表單 */
@media screen and (max-width: 767px) {
.FormGroup, .FromSubGroup { padding:20px 10px 10px; }
.FormGroup .FormTable, FromSubGroup .FormTable { margin-left:-10px; margin-right:-10px; width:auto; }

table.FormTable { border-top:1px solid #e7e7e7; }
table.FormTable , table.FormTable > tbody, table.FormTable > tbody > tr, table.FormTable > tbody > tr > th, table.FormTable > tbody > tr > td { display:block; }
table.FormTable > tbody > tr { padding:10px 10px 4px 10px; border-bottom:1px solid #d4d0cd; }
table.FormTable > tbody > tr > th, .FormTable > tbody > tr > td { border-bottom:0; }
table.FormTable > tbody > tr > th { text-align:left; }

.FormElmt input[type="file"] { width:100%; }
}
@media screen and (min-width: 768px) {
table.FormTable > tbody > tr > th, table.FormTable > tbody > tr > td { border-bottom:1px solid #dddddd; vertical-align:top; }
table.FormTable > tbody > tr:last-child > th, table.FormTable > tbody > tr:last-child > td { border-bottom:0; }
table.FormTable > tbody > tr > th { border-right:1px solid #dddddd; width:150px; padding:15px 15px 15px 6px; text-align:right; }
table.FormTable > tbody > tr > th::after { position:absolute; top:14px; right:0; }
table.FormTable > tbody > tr > th:empty::after { display:none; }
table.FormTable > tbody > tr > td { padding:10px 15px 4px 15px; }
}


/*----------------------------------------------------------------------*/
/* 內頁 */
#Content { padding-bottom:80px; }


/*----------------------------------------------------------------------*/
/* 內頁元素 */
/* 導覽列(麵包屑) */

/* 工具列 */
.ToolBar .colm_left a, .ToolBar dl.font_size, .ToolBar dl.share { line-height:40px; }
.ToolBar .colm_left a span, .ToolBar .colm_left a, .ToolBar dl.font_size a, .ToolBar dl.share a { width:40px; height:40px; }
.ToolBar .colm_left { display:none; }

/* 標題 */
.PageTitle::before { width:2.3%; padding-bottom:3.177%; }
.PageTitle::after { width:50px; height:28px; }
.PageTitle > div::before { width:24px; height:24px; }
.PageTitle > div::after { width:5.3646%; padding-bottom:4.6354%; }
.PageTitle h2 { background-position:0 center; line-height:100px; }
h3.title { font-size:1.625rem; }

/* 分類下拉 */
.CatTitle h3 { float:left; }
.CatTitle h3 + .cat_select { float:right; }

/* 列表搜尋 */
.ListSearch > div { 
	padding:20px 20px 10px 20px;  
	-webkit-border-radius:20px;
	-moz-border-radius:20px;
	border-radius:20px;
	}
.ListSearch > div::before { top:7px; right:3px; width:24px; height:10px; }
.ListSearch > div::after { 
	content:''; display:block; position:absolute; bottom:-1px; left:-1px; width:24px; height:24px; background-color:#e7ded5;
	}
.ListSearch .item { font-size:0.875rem; }
.ListSearch .title { display:none; }
.ListSearch .BtnCommon input { padding-left:20px; padding-right:20px; font-size:0.875rem; }

/* 頁碼 */
#Pagination a { 
	background-color:#eeeeee; display:none; line-height:40px; font-size:0.875rem; 
	}
#Pagination a:hover { background-color:#d42828; color:#fff; }
#Pagination a.first, #Pagination a.prev, #Pagination a.next, #Pagination a.last { display:inline-block; padding:0 10px; }
#Pagination .setting { padding-top:10px; line-height:24px; }
#Pagination .dev-script-oper { display:none; }

/* 內頁顯示欄位 */
.content_info ul { display:table; }
.content_info li { display:table-row; }
.content_info li span { display:table-cell; vertical-align:top; padding:5px 0; }
.content_info li span.title { text-align:right; }

/* 編輯器 */
.editable_content blockquote { padding:30px 60px; margin-left:20px; margin-right:20px; }

/* colorbox */
#colorbox_thum a { width:160px; height:120px; margin:10px; }


/*----------------------------------------------------------------------*/
/* 文字列表 */
.ListTable table, .ListTable table tbody, .ListTable table tr, .ListTable table th, .ListTable table td { display:block; }
.ListTable { margin-top:60px; margin-bottom:60px; border-top:1px solid #dddddd; }
.ListTable table tr:first-child { position:absolute; left:-10000px; top:-10000px; }
.ListTable table tr { padding:15px 10px; border-bottom:1px solid #dddddd; }
.ListTable table tr:nth-child(even) { background-color:#fff; }

.ListTable table td { margin:5px 0; text-align:left; }
.ListTable table td.no { display:none; }
.ListTable table td:before { font-weight:bold; content: attr(data-th)"："; }
.ListTable table td.no:before, .ListTable table td:first-child.date:before, .ListTable table td.title:before { 
	content:""; 
	}
.ListTable table td.date { display:inline-block; font-weight:bold; font-size:0.875rem; position:relative; }
.ListTable table td.date::before { 
	content:''; display:block; position:absolute; top:14px; left:10px; width:80px; height:14px; background:url("../images/pattern1.png") repeat-x 0 0; 
	}
.ListTable table td.date br { display:none; }
.ListTable table td.title { padding-left:30px; line-height:180%; position:relative; }
.ListTable table td.title a::after { 
	content:''; display:block; position:absolute; top:7px; left:5px; 
	border-left:12px solid #e75548; border-bottom:5px solid transparent; border-top:5px solid transparent; 
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.ListTable table td.title a:hover::after, .ListTable table td.title a:focus::after { left:10px; }


/*----------------------------------------------------------------------*/
/* 圖文列表 */
.ListPicText > div { margin-left:-10px; margin-right:-10px; }
.ListPicText .item { padding-left:10px; padding-right:10px; margin-bottom:20px; }

/* list-view */
.ListPicText.list-view.single.staggered .item:nth-child(2n+2) .img { float:right; padding-right:0; padding-left:20px; }
.ListPicText.list-view .img { float:left; width:360px; max-width:50%; padding-right:15px; }
.ListPicText.list-view .img a::after { display:none; }
.ListPicText.list-view .cont { padding-top:0 !important; }
.ListPicText.list-view .title::after { display:none; }
.ListPicText.list-view .btn { margin-top:10px; }

@media screen and (max-width: 767px) {
.ListPicText .cont { padding:10px; }
.ListPicText .title { font-size:1.125rem; }
.ListPicText .date { font-size:0.8125rem; }
.ListPicText .desc { font-size:0.875rem; }

/* list-view 一律以單欄顯示 */

/* grid-view 一律以兩欄顯示 */
.ListPicText.grid-view .item { float:left; width:50%; }
.ListPicText.grid-view .item > div { padding-bottom:56px; }/* 預留按鈕的高度 */
.ListPicText.grid-view .btn { position:absolute; width:100%; bottom:20px; left:0; padding-left:15px; padding-right:15px; }
}

@media screen and (min-width: 768px) {
.ListPicText .cont { padding:10px; }
.ListPicText .title { font-size:1.125rem; }
.ListPicText .date { font-size:0.8125rem; }
.ListPicText .desc { font-size:0.875rem; }

/* list-view 一律以單欄顯示 */

/* grid-view 一律以三欄顯示 */
.ListPicText.grid-view .item { float:left; width:33.3333%; }
.ListPicText.grid-view .item > div { padding-bottom:56px; }/* 預留按鈕的高度 */
.ListPicText.grid-view .btn { position:absolute; width:100%; bottom:20px; left:0; padding-left:15px; padding-right:15px; }
}


/*----------------------------------------------------------------------*/
/* 商品列表 */
@media screen and (max-width: 767px) {
.ProductCat li { width:23.5%; margin-right:2%; padding-bottom:15.65%; }
	.ProductCat li:nth-child(4n+4) { margin-right:0; }
}
@media screen and (min-width: 768px) {
.ProductCat li { width:18.4%; margin-right:2%; padding-bottom:12.5%; }
	.ProductCat li:nth-child(5n+5) { margin-right:0; }
}

@media screen and (max-width: 767px) {
.ProductList .item { width:48%; margin-right:4%; }
.ProductList .item:nth-child(2n+2) { margin-right:0; }
}
@media screen and (min-width: 768px) {
.ProductList .item { width:32%; margin-right:2%; }
.ProductList .item:nth-child(3n+3) { margin-right:0; }
}


/*----------------------------------------------------------------------*/
/* 經營團隊 */
.TeamList .item { float:left; padding-top:40px; padding-bottom:40px; }
.TeamList .nameplate .title { font-size:1rem; }
.TeamList .nameplate .name { font-size:1.5rem; }
.TeamList .info_list dd { font-size:0.9375rem; }
@media screen and (max-width: 799px) {
.TeamList { padding-left:2.5%; padding-right:2.5%; }
.TeamList .item { width:50%; padding-left:3.3333%; padding-right:3.3333%; }
.TeamList .item::after { height:38%; width:200%; }
	.TeamList .item:nth-child(4n+1)::after { content:''; left:-24%; }
	.TeamList .item:nth-child(4n+4)::after { content:'';  right:-24%; }
.TeamList .cont { padding:0 20px; }
.TeamList .info_list dl { margin-left:10px; margin-top:38px; }
.TeamList .info_list dt { left:-10px; top:-25px; }
}
@media screen and (min-width: 800px) {
.TeamList { padding-left:2%; padding-right:2%; }
.TeamList .item { width:33.3333%; padding-left:2%; padding-right:2%; }
.TeamList .item::after { height:36%; width:271.604%; }
	.TeamList .item:nth-child(6n+1)::after { content:''; left:-22%; }
	.TeamList .item:nth-child(6n+6)::after { content:'';  right:-22%; }
.TeamList .cont { padding:0 10px; }
.TeamList .info_list dl { margin-left:10px; margin-top:38px; }
.TeamList .info_list dt { left:-10px; top:-25px; }
}

/* popup box */
@media screen and (orientation: portrait) and (max-width: 799px) {
.team_box .box_wrap > div { padding:20px 20px 10px 20px; }
.team_box .box_wrap { width:96vw; height:96vh; margin:-48vh 0 0 -48vw; }
}
@media screen and (orientation: portrait) and (min-width: 800px) {
.team_box .box_wrap > div { padding:60px 40px 20px 40px; }
.team_box .box_wrap { width:90vw; height:90vh; margin:-45vh 0 0 -45vw; }
}
@media screen and (orientation: landscape) {
.team_box .box_wrap > div { padding:30px 20px 10px 20px; }
.team_box .box_wrap { width:96vw; height:90vh; margin:-45vh 0 0 -48vw; }
}
.team_box .brief .nameplate { padding:15px; margin-top:15px; text-align:center; }
.team_box .brief .nameplate .title { font-size:1.125rem; }
.team_box .brief .nameplate .name { font-size:1.5rem; }
@media screen and (max-width: 799px) {
.team_box .brief .colm_left { width:42%; padding:10px; }
.team_box .brief .colm_right { width:54%; }
}
@media screen and (min-width: 800px) {
.team_box .brief .colm_left { width:36%; padding:20px; }
.team_box .brief .colm_right { width:60%; }
}


/*----------------------------------------------------------------------*/
/* 投資人專區 */
/* 首頁 */
.ContentIRKeyVisual .bx-wrapper .bx-pager { display:none; }
.ContentIRKeyVisual .bx-wrapper .bx-controls-direction a { width:30px; height:60px; margin-top:-30px; }
.ContentIRKeyVisual .bx-wrapper .bx-controls-direction a::after { width:12px; height:12px; margin-top:-6px; }
.ContentIRKeyVisual .bx-wrapper .bx-controls-direction .bx-prev::after { left:10px; }
.ContentIRKeyVisual .bx-wrapper .bx-controls-direction .bx-next::after { right:10px; }

.ir_index_btns .item { width:25%; }
	.ir_index_btns .item1, .ir_index_btns .item4 { width:50%; }
	.ir_index_btns .item4 { float:right; }
	
@media screen and (max-width: 767px) {
.ir_index_btns { margin-left:-5px; margin-right:-5px; }
.ir_index_btns .item {  padding:5px; }
.ir_index_btns .item > div { padding-bottom:100%; }
	.ir_index_btns .item1 > div, .ir_index_btns .item4 > div {padding-bottom:47.6%; }
}
@media screen and (min-width: 768px) {
.ir_index_btns { margin-left:-10px; margin-right:-10px; }
.ir_index_btns .item {  padding:10px; }
.ir_index_btns .item > div { padding-bottom:84.0336%; }
	.ir_index_btns .item1 > div, .ir_index_btns .item4 > div {padding-bottom:40%; }
}
	
.ir_index_btns .item a { font-size:1.125rem; }
	
/* 投資人專區內頁 */
#ContentIR_Left { display:none; }

.ir_list_table table, .ir_list_table tbody, .ir_list_table tr, .ir_list_table th, .ir_list_table td { display:block; }
.ir_list_table { border-top:1px solid #e3e4e5; }
.ir_list_table tr:first-child { position:absolute; left:-10000px; top:-10000px; }
.ir_list_table tr { padding:10px 15px 5px 15px; border-bottom:1px solid #e3e4e5; }
.ir_list_table table tr:nth-child(even) { background-color:#ffffff; }
.ir_list_table table tr:nth-child(odd) { background-color:#f9f9f9; }
.ir_list_table td { margin:5px 0; text-align:left; }
.ir_list_table td:before { font-weight:bold; content: attr(data-th)"："; }
.ir_list_table td.revenue_report_month { font-size:1.25rem; }
.ir_list_table td.revenue_report_month:before { display:none; }

/* 公司年報 */
.AnnualReport .img { max-width:120px; }
@media screen and (max-width: 767px) {
.AnnualReport .item { width:48%; margin-right:4%; margin-bottom:50px; }
.AnnualReport .item:nth-child(2n+2) { margin-right:0; }
}
@media screen and (min-width: 768px) {
.AnnualReport .item { width:32%; margin-right:2%; margin-bottom:50px; }
.AnnualReport .item:nth-child(3n+3) { margin-right:0; }
}

/* 財務報告 */
.dividend_info th, .dividend_info td { border-bottom:3px solid #f9f9f9; padding:10px 30px; }
.dividend_info th { border-right:3px solid #f9f9f9; background-color:#c9e1ea; }
.dividend_info td { background-color:#e8eef1; }


/*----------------------------------------------------------------------*/
/* 活動報名 */
.EventList .btn { width:100%; text-align:center; }
@media screen and (max-width: 767px) {
.EventList .item { width:48%; margin-right:4%; margin-bottom:40px; }
	.EventList .item:nth-child(2n+2) { margin-right:0; }
.EventList .date { font-size:0.875rem; }
.EventList .desc { font-size:0.875rem; }
}
@media screen and (min-width: 768px) {
.EventList .item { width:31.25%; margin-right:3.125%; margin-bottom:40px; }
	.EventList .item:nth-child(3n+3) { margin-right:0; }
.EventList .date { font-size:0.875rem; }
.EventList .desc { font-size:0.875rem; }
}

.EventList.active .desc { font-size:1rem; }