@charset "utf-8";
/* CSS Document */

/*----------------------------------------------------------------------*/
/* Header */
#Header .logo { float:left; margin:32px 0 26px; }
#Header .logo a { height:52px; max-width:190px; }
#Header .header_info { float:right; margin:15px 0; width:70%; text-align:right; font-size:0; }
#Header .header_info::after { content:''; display:block; clear:both; }
#Header .header_search, #Header .header_link { display:inline-block; vertical-align:top; }

.header_search { position:relative; }
#Header .search_box { float:left; border-radius:10px; height:35px; line-height:35px; }
#Header .search_box::after { content:''; display:block; clear:both; }
#Header .search_box input[type="text"] { 
	float:left; box-sizing:border-box; width:150px; border:none; height:35px; line-height:35px; padding:0 10px; background:#fff; border-radius:10px 0 0 10px; font-size:0.875rem; 
	}
#Header .search_box input[type="text"]:focus { background-color:#f6fdff; }
#Header .search_box button::after { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../images/header_icons.png) no-repeat 0 0; }
#Header .search_box button { float:left; width:35px; height:35px; position:relative; background-color:#003b59; border-radius:0 10px 10px 0;  overflow:hidden; text-indent:-99px; }
#Header .search_box button::before { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(255,255,255,.15); }
#Header .search_box button:hover::before, #Header .search_box button:focus::before { background-color:rgba(255,255,255,.45); }

#Header .header_link:after { content:""; clear:both; display:block; }
#Header .header_link li { float:left; margin-left:13px; }
#Header .header_link li a { text-decoration:none; background-color:rgba(255,255,255,.15); background-image:url(../images/header_icons.png); background-repeat:no-repeat; border-radius:10px; font-size:0; line-height:35px; height:35px; width:35px; display:inline-block; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; text-indent:-9999; }
#Header .header_link li.fb a { background-position:-48px 0; }
#Header .header_link li.en a { background-position:-96px 0; }
#Header .header_link li.zh a { background-position:-144px 0; }
#Header .header_link li.sitemap a { background-position:-192px 0; }
#Header .header_link li a:hover, #Header .header_link li a:focus { background-color:rgba(255,255,255,.45); }

/* footer */
#Footer .location .item { margin-right:50px; margin-bottom:10px; }
#Footer .footer_info .organizer { justify-content:flex-end; }
#Footer .footer_info .copyright .authority { }
#Footer .footer_info .copyright .authority + .adviser { padding-left:30px; }
#Footer .footer_info .bottom { justify-content:flex-end; }


/*----------------------------------------------------------------------*/
/* Menu */
.MenuBar { width:70%; float:right; }
#Menu { float:right; }
#Menu:after { content:""; clear:both; display:block; }
#Menu li { position:relative; }
#Menu li a { text-decoration:none; color:#333; display:block; font-family:"Noto Sans TC", "Microsoft JhengHei", "微軟正黑體", "Microsoft YaHei", "微软雅黑", sans-serif; transition:all 0.3s; -moz-transition:all 0.3s; -webkit-transition:all 0.3s; -o-transition:all 0.3s; }
#Menu > li { float:left; }
#Menu > li:before {  content:""; width:1px; height:25px; background:rgba(255,255,255,.25); position:absolute; left:0; top:0; }
#Menu > li:first-child:before { display:none; }
#Menu > li > a { line-height:25px; padding:0 15px 20px; font-size:1.125rem; letter-spacing:1px; font-weight:400; color:#ffffff; }
#Menu > li:hover > a, #Menu > li > a:focus { color:#1fa3d9; }

/*第二層底下共用*/
#Menu > li > ul { display:none; position:absolute; top:45px; left:0; width:155px; z-index:999; background-color:#ffffff; }
#Menu > li:hover > ul { display:block; z-index:9999; }
#Menu ul { -moz-box-shadow:0px 5px 5px rgba(0,0,0,.2); -webkit-box-shadow:0px 5px 5px rgba(0,0,0,.2); box-shadow:0px 5px 5px rgba(0,0,0,.2); }
#Menu ul li { border-top:1px solid #ccc; }
#Menu ul li:first-child { border:none; }
#Menu ul li a { line-height:1.5em; padding:8px 15px; text-decoration:none; font-size:0.9375rem; }
#Menu ul li a:hover, #Menu ul li a:focus { color:#1fa3d9; }

/*第三層*/
#Menu > li > ul > li > ul { display:none; position:absolute; left:100%; top:0px; width:100%; z-index:999; background-color:#ffffff; }
#Menu > li > ul > li:hover > ul { display:block; z-index:9999; }

/*第四層*/
#Menu > li > ul > li > ul li > ul { display:none; position:absolute; left:100%; top:0px; width:100%; z-index:999; background-color:#ffffff; }
#Menu > li > ul > li > ul li:hover > ul { display:block; z-index:9999; }

/*最後一個往左長*/
#Menu li.last ul { right:0; left:auto; }
#Menu > li.last > ul > li > ul { right:155px; left:auto; }
#Menu > li.last > ul > li > ul li > ul { right:155px; left:auto; }

/* 浮動效果 
#Header, #Header .logo a, #Menu { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease; }
#Wrap.MenuFix #Header { position:fixed; top:0; left:0; width:100%; z-index:9999; }
#Wrap.MenuFix { padding-top:110px; }
#Wrap.MenuFix .header_info { display:none; }
#Wrap.MenuFix #Header .logo { margin:10px 0; }
#Wrap.MenuFix #Header .logo a { height:40px; }
#Wrap.MenuFix #Menu { padding-top:18px; }
#Wrap.MenuFix #Menu > li > a { padding-bottom:17px; }
#Wrap.MenuFix #Menu > li > ul { top:42px; }

.MenuFix #Header { animation:menu 0.5s ease 1; }
@-webkit-keyframes menu{
	0% { top:-60px;	}
	100%{ top:0; }
}*/


/*----------------------------------------------------------------------*/
/* 首頁 */
/* 首頁第一區 */
.IndexArea01 { padding-top:60px; }
.IndexArea01:before { top:14.8%; height:85.2%; }

/* 智農新聞 */
.IndexNews { padding-bottom:80px; }
.IndexNewsList .item { width:33.33%; }
@media screen and (min-width:1440px) {
    .IndexNewsList { margin-left:-14px; margin-right:-14px; }
}

/* 活動課程 */
@media screen and (max-width:1439px) {
    .IndexEvents { margin:0 14px; }
}
.IndexEvents .IndexMoreBtn { padding-top:20px; }

.IndexEvents .IndexTitle { height:370px; position:relative; max-width:360px; width:30%; background:url(../images/index_events_title_bg.jpg) no-repeat; padding:33px 30px 53px; box-sizing:border-box; display:table; }
.IndexEvents .IndexTitle h2 { display:table-cell; vertical-align:middle; }
.IndexEvents .IndexTitle h2:before { content:""; background:url(../images/icon_index_events.png) no-repeat center; width:100%; height:88px; display:block; margin-bottom:10px; }
.IndexEvents .IndexTitle h2 span { display:inline-block; line-height:115%; text-shadow:3px 5px 0 rgba(0,0,0,.1); font-size:4.25vw; color:#fff; max-width:11.3vw; letter-spacing:.125em; }
.IndexEvents .IndexTitle:before, .IndexEvents .IndexTitle:after { 
	display:block; position:absolute; font-family:"Arial"; font-size:7rem; font-weight:700; line-height:100%; color:rgba(255,255,255,.45); 
	-webkit-text-shadow:0 0 15px rgba(0,0,0,0.2);
	-moz-text-shadow:0 0 15px rgba(0,0,0,0.2);
	text-shadow:0 0 15px rgba(0,0,0,0.2);
}
	.IndexEvents .IndexTitle:before { content:'“'; left:5px; top:-26px; }
	.IndexEvents .IndexTitle:after { content:'”'; right:5px; bottom:-76px; }

.IndexEventsList { position:absolute; right:0; top:25px; width:75%; }
.IndexEventsList .item > div { font-size:1.25rem; }
.IndexEventsList .date { width:20%; }
.IndexEventsList .title { width:80%; }
.IndexEventsList .title a {  text-overflow:ellipsis; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; }

/* 推動現況與實例-圖像牆 */
.IndexArticleList .item { float:left; width:25%; padding-bottom:16.66%; height:auto !important; }
.IndexArticleList .item.focus { width:50%; padding-bottom:33.33%; }
.IndexArticleList .item.focus.right { position:absolute; bottom:0; right:0; }
.IndexArticleList .item:nth-child(4) { clear:left; }

.IndexArticleList .item > div { position:absolute; width:100%; }

.IndexArticleList .img { width:100%; height:100%; }

.IndexArticleList .cont { background-color:rgba(0,0,0,0.4); position:absolute; left:0; top:100%; width:100%; height:100%; }
.IndexArticleList .cont > div { width:100%; }
.IndexArticleList .title { 
	text-align:center; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; color:#fff; padding-left:20px; padding-right:20px; padding-top:10px; padding-bottom:10px; 
	}
	.IndexArticleList .focus .title { padding-top:14px; padding-bottom:14px; }
.IndexArticleList .desc { 
	padding-left:20px; padding-right:20px; max-height:4.688em; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden;
	font-size:1rem; line-height:160%; color:#fff; 
	}
.IndexArticleList .focus .desc { margin-top:5px; margin-bottom:25px; }

@media screen and (max-width:1199px) {
	.IndexArticleList { margin-left:-5px; margin-right:-5px; }
    .IndexArticleList .item > div { padding-left:5px; padding-right:5px; padding-bottom:10px; }

    .IndexArticleList .cont { margin-top:-40px; }
    .IndexArticleList .focus .cont { margin-top:-55px; }
    .IndexArticleList .title { font-size:0.9375rem; }
    .IndexArticleList .focus .title { font-size:1.25rem; }
    .IndexArticleList .desc { margin-bottom:10px; font-size:0.875rem; }
    .IndexArticleList .focus .desc { font-size:0.9375rem; max-height:140px; }
}
@media screen and (min-width:1200px) {
	.IndexArticleList { margin-left:-10px; margin-right:-10px; }
    .IndexArticleList .item > div { padding-left:10px; padding-right:10px; padding-bottom:20px; }

    .IndexArticleList .item .cont { margin-top:-40px; }
    .IndexArticleList .focus .cont { margin-top:-60px; }
    .IndexArticleList .title { font-size:1rem; }
    .IndexArticleList .focus .title { font-size:1.5625rem; }
    .IndexArticleList .desc { margin-bottom:15px; font-size:0.875rem; }
    .IndexArticleList .focus .desc { font-size:1rem; }
}

/* hover效果 */
.IndexArticleList .item a:hover .cont, .IndexArticleList .item a:focus .cont { background-color:rgba(0,52,102,0.7); top:0; margin-top:0; display:flex; align-items:center; justify-content:center; }


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


/*----------------------------------------------------------------------*/
/* 內頁元素 */
#MainBar { padding:30px 0; }

/* 標題 */
.PageTitle { height:60px; }
.PageTitle h2 { font-size:2.5rem; }
h3.article_title { font-size:2.1875rem; }

/* 導覽列(麵包屑) */
#Breadcrumbs { text-align:center; }

/* 工具列 */
.ToolBar { margin-top:25px; margin-bottom:25px; }
.ToolBar .colm_right { float:right; }
.ToolBar dl.font_size { float:left; }
.ToolBar dl.share { float:left; margin-left:3px; }
.ToolBar dl.share:before { content:""; width:1px; height:100%; background:#d6dbe3; position:absolute; left:-3px; top:0; }

/* 分類下拉 */
.CatTitle { padding:0 4px; }
.CatTitle h3 { float:left; }
.CatTitle .cat_select { float:right; }

/* 列表搜尋 */
.ListSearch .item { font-size:1.25rem; line-height:45px; }
.ListSearch .item input[type="text"], .ListSearch.FormElmt select { height:45px; line-height:45px; }
.ListSearch .item input[type="text"], .ListSearch .item select { font-size:1.125rem; }
.FormElmt .dev-calendar { max-width:200px; }
.ListSearch .BtnCommon input { height:45px; line-height:45px; font-size:1.25rem; }

/* 頁碼 */
#Pagination { margin-top:15px; }
#Pagination a { margin:0; }
#Pagination .current { display:none; }

/* 編輯器 */
.editable_content blockquote { padding:55px 80px; }
.editable_content blockquote::before, .editable_content blockquote::after { font-size:7rem; }
.editable_content .MsgModule_Media .describe:after { font-size:7rem; }
.editable_content .MsgModule_Media .describe { padding:38px 45px 44px; }
ul.ext_list { margin-left:65px; }

.editable_content table.table_style1 th, .editable_content table.table_style1 td { padding:15px 20px; }
.editable_content table.table_style2 th, .editable_content table.table_style2 td { padding:15px 20px; }
.editable_content table.table_style3 th, .editable_content table.table_style3 td { padding:15px 20px; }

.editable_content .guest_tabs .item { margin:10px 20px 25px; }
.editable_content .guest_tabs a { font-size:1.375rem; padding:11px 52px; }

/* 智農是什麼-客製樣式 */
.editable_content .aboutBox { padding:45px 0 30px; margin:50px 0; }
.editable_content .aboutBox h3 { font-size:2.5rem; margin-bottom:5px; padding:9px 45px; }
.editable_content .aboutBox h4 { font-size:2.5rem; }
.editable_content .aboutBox p { font-size:1.125rem; }
.editable_content .aboutBox > p, .editable_content .aboutBox > .imgBox { padding:15px 45px; }
.editable_content .aboutBox .block { padding:40px 45px 30px 45px; }
.editable_content .aboutBox.img_right { padding-right:50%; position:relative; min-height:410px; }
.editable_content .aboutBox.img_right .imgBox { position:absolute; right:45px; top:50px; margin:0; padding:0 0 0 30px; width:50%; }
.editable_content .two_imgBox { display:table; width:100%; }
.editable_content .two_imgBox > div { display:table-cell; vertical-align:top; width:50%; padding:15px 15px 0; }
.editable_content .two_imgBox img { width:100%; }
.PageNavFix .editable_content .PageNav { top:0; animation:navMenu 0.5s ease 1; }
@-webkit-keyframes navMenu{
	0% { top:-60px;	}
	100%{ top:0; }
}
.editable_content .PageNav .nav_item { font-size:1.375rem; padding:14px; }

/* colorbox */
#colorbox_thum { padding-left:35px; }
#colorbox_thum a { margin:5px 12px 10px; width:218px; }

/*----------------------------------------------------------------------*/
/* 表單 */
.FormTable > tbody > tr > th, .FormTable > tbody > tr > td { vertical-align:top; }
.FormTable > tbody > tr > th { width:150px; padding:15px 15px 15px 0; text-align:right; }
.FormTable > tbody > tr > th:empty::after { display:none; }
.FormTable > tbody > tr > td { padding:12px 0 4px; }
.FormTable.lectureForm > tbody > tr > th { padding:18px 15px 18px 0; }
.FormTable.lectureForm > tbody > tr > td { padding:14px 15px 7px 0; }

/* 表單元件 */
.FormElmt .input_group > div { display:inline-block; white-space:nowrap; margin-right:12px; }
.FormElmt input + input, .FormElmt input + select, .FormElmt select + input, .FormElmt select + select { margin-left:4px; }

/* item */
.input_table li { width:25%; }

/*----------------------------------------------------------------------*/
/* 按鈕 */
.BtnCommon.large div[class] a, .BtnCommon.large div[class] input { padding-left:62px; padding-right:35px; }
.BtnCommon.large div[class] span:before { left:35px; }
.BtnCommon.mid div[class] a, .BtnCommon.mid div[class] input { padding-left:52px; padding-right:25px; }
.BtnCommon.mid div[class] span:before { left:25px; }

/*----------------------------------------------------------------------*/
/* 文字列表 */
.ListTable table { font-size:1.25rem; }
.ListTable th, .ListTable td { position:relative; }
.ListTable th { padding:12px; background-color:#003466; color:#fff; line-height:1.75rem; white-space:nowrap; letter-spacing:.5px; }
.ListTable th:before { content:""; width:1px; height:60%; position:absolute; left:0; top:20%; background:#dce4e5; }
.ListTable th:first-child:before { display:none; }
.ListTable td { padding:15px 1em; }
.ListTable td:before { content:""; width:1px; height:60%; position:absolute; left:0; top:20%; background:#dce4e5; }
.ListTable td:first-child:before { display:none; }
.ListTable tr:nth-child(2n+3) td:before { background:#b9d3d6; }
.ListTable tr:nth-child(2n+3) { background:#ddedf3; }

.ListTable th.no { width:40px; }
.ListTable td.no { width:40px; color:#444; text-align:right; }
.ListTable td.no::after { content:'.'; }
.ListTable th.date { width:7.5em; }
.ListTable td.date { width:7.5em; color:#444; font-size:1rem; word-break:break-all; text-align:center; }
	.ListTable th.date.range, .ListTable td.date.range { width:140px; }
.ListTable th.cat { width:6em; }
.ListTable td.cat { width:6em; text-align:center; }
.ListTable th.unit { width:9em; }
.ListTable td.unit { width:9em; }
.ListTable td.cont { width:40%; }
.ListTable th.download { width:100px; }
.ListTable td.download { width:100px; }
.ListTable td.download a.file_ext { width:20px; height:20px; line-height:20px; }
.ListTable td.download a.file_ext::before { width:20px; height:20px; }
.ListTable td.download.desc li { display:block; }
.ListTable td.download.desc a.file_ext { text-indent:0; width:auto; padding-left:24px; }
.ListTable td.download.desc a.file_ext::before { left:0; margin-left:0; }
.ListTable .tc { text-align:center; }

.ListTable td.main { width:55%; }

/*----------------------------------------------------------------------*/
/* 圖文列表 */
.ListPicText > div { margin-left:-5px; margin-right:-5px; position:relative; }
.ListPicText .item { padding-left:20px; padding-right:20px; }
.ListPicText .btn { bottom:20px; }
.ListPicText .btn a { font-size:1rem; }

/* list-view */
.ListPicText.list-view .img { float:left; width:360px; }
.ListPicText.list-view .btn { text-align:right; }
.ListPicText.list-view .cont { overflow:hidden; }
.ListPicText.list-view .cont > div { padding-bottom:50px; }
/* grid-view */
.ListPicText.grid-view .item { margin-bottom:40px; }
.ListPicText.grid-view .cont { padding:28px 28px 88px 28px; }
.ListPicText.grid-view .date { margin-top:-2.75em; background:#fff; padding-left:.75em; padding-right:.75em; }

/* hover效果 */
.ListPicText .item > div, .ListPicText .img > div, .ListPicText.grid-view .img, .ListPicText .btn a  { 
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	transition:all 0.3s ease;
	} 
.ListPicText.grid-view .img:hover > div { transform:scale(1.05); }
.ListPicText .item > div:hover { -moz-box-shadow:0 18px 18px -10px rgba(0,0,0,.3); -webkit-box-shadow:0 18px 18px -10px rgba(0,0,0,.3); box-shadow:0 18px 18px -10px rgba(0,0,0,.3); transform:translateY(-5px); }

/* 單欄 */
.ListPicText.list-view.single.staggered .item:nth-child(2n+2) .img { float:right; padding-right:0; padding-left:20px; }
.ListPicText.single .cont { padding:20px; }
.ListPicText.single .title { font-size:1.375rem; }
.ListPicText.single .date { font-size:1rem; }
.ListPicText.single .desc { font-size:1rem; }
.ListPicText.list-view.single > div { margin-left:0; margin-right:0; }
.ListPicText.list-view.single .item { padding:0 0 40px; }
.ListPicText.list-view.single .item > div { padding-left:410px; min-height:286px; }
.ListPicText.list-view.single .cont { padding:20px 25px 20px 5px; }
.ListPicText.list-view.single .img { padding:20px; width:410px; float:none; position:absolute; left:0; top:0; }
.ListPicText.list-view.single .title a { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ListPicText.list-view.single .btn { padding-right:25px; }

/* 兩欄 */
.ListPicText.bisection .item { float:left; width:50%; }
.ListPicText.bisection .title { font-size:1.375rem; }
.ListPicText.bisection .date { font-size:1rem; }
.ListPicText.bisection .desc { font-size:1rem; }
.ListPicText.list-view.bisection .item > div { padding-left:315px; min-height:315px; }
.ListPicText.list-view.bisection .cont { padding:20px 20px 0 0; }
.ListPicText.list-view.bisection .img { padding:20px; width:315px; float:none; position:absolute; left:0; top:0; }
.ListPicText.list-view.bisection .item { padding-bottom:40px; }
.ListPicText.list-view.bisection .btn { padding-right:20px; }
@media screen and (min-width:1280px) {
.ListPicText.list-view.bisection > div { margin-left:-20px; margin-right:-20px; }
}
@media screen and (max-width:1279px) {
.ListPicText.bisection.bisection .item { float:none; width:100%; }
}

/* 三欄 */
.ListPicText.trisection .item { float:left; width:33.3333%; }
.ListPicText.trisection .title { font-size:1.375rem; }
.ListPicText.trisection .date { font-size:1rem; }
.ListPicText.trisection .desc { font-size:1rem; }
.ListPicText.list-view.trisection .img { padding:15px; }
.ListPicText.list-view.trisection .cont { padding:15px; }
.ListPicText.list-view.trisection .item { padding-top:15px; padding-bottom:15px; }

/* 四欄 */
.ListPicText.quarters .item { float:left; width:25%; }
.ListPicText.quarters .title { font-size:1.125rem; }
.ListPicText.quarters .date { font-size:0.8125rem; }
.ListPicText.quarters .desc { font-size:0.875rem; }
.ListPicText.list-view.quarters .img { padding:10px; }
.ListPicText.list-view.quarters .cont { padding:10px; }
.ListPicText.list-view.quarters .item { padding-top:10px; padding-bottom:10px; }

/*----------------------------------------------------------------------*/
/* 搜尋結果 */
.AdvancedSearch .item { width:300px; font-size:1.25rem; line-height:45px; }
.AdvancedSearch .item input[type="text"] { height:45px; line-height:45px; }
.AdvancedSearch .item input[type="text"], .AdvancedSearch .item select { font-size:1.125rem; }
.AdvancedSearch .BtnCommon input { width:70px; height:45px; line-height:45px; font-size:1.125rem; }