@charset "utf-8";

/*----------------------------------------------------------------------*/
/* 內頁 */
#Center { overflow:hidden; }
#Content { position: relative; margin-bottom: 30px; }
#Content::after { content:''; clear:both; display:block; width:100%; }
#Content .inner > *:last-child { margin-bottom:0; }

/*----------------------------------------------------------------------*/
/* 導覽列(麵包屑) */
#Breadcrumbs ul { display: flex; flex-wrap: wrap; padding-bottom: 15px; }
#Breadcrumbs ul li { letter-spacing: .075em; line-height:1.25em; position:relative; font-weight: 700; color: #444; }
#Breadcrumbs ul li:last-child { color: var(--color2); }
#Breadcrumbs ul li:not(:last-child) { padding-right:24px; }
#Breadcrumbs ul li a { display:block; color:#444; text-decoration:none; }
#Breadcrumbs a:hover, #Breadcrumbs a:focus { color: var(--color2); }
	#Breadcrumbs ul li:after { content:''; position:absolute; top:50%; right:8px; color:#555; background: url(../images/bread_arrow.png) no-repeat; width: 8px; height: 13px; margin-top: -6px; }
	#Breadcrumbs ul li:last-child:after { display: none; }

/*----------------------------------------------------------------------*/
/* 標題 */
.PageTitle { background-color: var(--main_color); background-image: url("../images/pageTitle_bg-01.svg"); background-position: center center; background-size: cover; padding: 15px; margin-bottom: 15px; }
.PageTitle h2 { font-size: 1.5em; font-weight: 700; color: #fff; text-shadow: 0 0 10px rgba(0, 0, 0, .3); text-align: center; text-transform:uppercase; letter-spacing: .1em; }

h3.articleTitle { margin-bottom:20px; line-height:1.5; letter-spacing: .02em; font-size: 2em; color: #333; }

.MainBar { text-align: center; margin-bottom: 20px; }
.MainBar h3.articleTitle { margin-bottom: 8px; }
.MainBar .desc { color: #444; }

.post_info { display: flex; flex-wrap: wrap; align-items: flex-start; line-height: 1.5em; letter-spacing: .0em; }
.post_info span { color:#555; position: relative; letter-spacing: .1em; }
.post_info span:not(:first-child) { margin-left:12px; }

.post_info.below { justify-content: flex-end; position: relative; }
.post_info.below::before { content: ''; position: absolute; top: 50%; left: 0; height: 1px; width: 100%; background-color: #ddd; }
.post_info.below.no_line::before { display: none; }
.post_info.below span { color: #555; background-color: #fff; margin-left: 0; padding-left: 1em; }
.post_info.below span:not(:last-child) { padding-right: 1em; }
.post_info.below span:not(:first-child) { padding-left: 1rem; border-left: 1px solid #ddd; }
.post_info .date { font-size: 1.15rem; font-weight: 700; color: #1cafa4; display: inline-flex; flex-wrap: wrap; align-items: center; line-height: 1.5em; vertical-align: top; letter-spacing: .0em; }
.post_info .date::before { content: ''; display: inline-block; width: 17px; height: 19px; background: url(../images/icon_date.png) no-repeat; margin-right: 0.5em; } 
.post_info .cat { display: inline-flex; align-items: center;letter-spacing: .05rem; border-radius: 4px; background-color: #e3e3e3; color: #999; padding: 0 .5rem 0 .5rem; height: 1.8rem;  line-height: 1.8rem; position: relative; z-index:1; }

/* 內頁顯示欄位 */
.content_info { padding-top:10px; line-height: 2em; letter-spacing: .05em; color: #555; }

@media screen and (max-width: 639px) {
    .post_info.below span { font-size: .875em; letter-spacing: 0; padding-left: .5em; }

    h3.articleTitle { font-size: 1.5em; }
    .item_title h3 { font-weight: bold; font-size: 1.25em; }
    .post_info { font-size: .875em; }

    #Breadcrumbs { display:none; }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    #Content { margin-bottom: 40px; }
	.PageTitle { padding: 20px; }
	.PageTitle h2 { font-size: 2.5em; }

    h3.articleTitle { font-size: 1.75em; }
    .item_title h3 { font-weight: bold; font-size: 1.375em; }
    .post_info { font-size: .9375em; }
}

@media screen and (min-width: 1024px) {
    #Content { margin-bottom: 60px; }
	.PageTitle { padding: 56px 20px; margin-bottom: 40px; }
    .PageTitle h2 { font-size: 3.125em; }
}

@media screen and (min-width: 1280px) {
    .MainBar h3.articleTitle { font-size: 2.25em; }
    #Content { margin-bottom: 70px; }
}

/*----------------------------------------------------------------------*/
/* 工具列 */
.ToolBar { box-sizing:border-box; position: relative; margin-bottom: 15px; }
.ToolBar a.sr-only { position: absolute; left: -1.5em; top: 0; color: #fff; }
.ToolBar a.sr-only:hover, .ToolBar a.sr-only:focus { background-color: #fdc147; }
.ToolBar .colm_left a span::after, .ToolBar dl.font_size a::after, .ToolBar dl.share dd > a::after {
	content:''; display:block; position:absolute; top:50%; left:50%;
	background:url("../images/icon_toolbar.png") no-repeat;
	}
.ToolBar .colm_left a, .ToolBar dl.font_size dt, .ToolBar dl.font_size dd, .ToolBar dl.share dt, .ToolBar dl.share dd { margin-top:5px; margin-bottom: 5px; }
.ToolBar a { display:block; text-decoration:none; position:relative; }

.ToolBar .colm_left { display: flex; }
.ToolBar .colm_left a { margin-right:15px; height: 40px; padding-left: 2px; padding-right: 18px; display: flex; align-items: center; }
.ToolBar .colm_left a:last-child { margin-right:0; }
.ToolBar .colm_left a:hover, .ToolBar .colm_left a:focus { background-color: var(--color2); color: #fff; }
.ToolBar .colm_left a span { position:relative; }
	.ToolBar .colm_left a.return span::after { background-position:0 0; }
	.ToolBar .colm_left a.print span::after { background-position:0 12.5%; }
.ToolBar .colm_left a.return:hover span::after, .ToolBar .colm_left a.return:focus span::after { background-position:100% 0; }
.ToolBar .colm_left a.print:hover span::after, .ToolBar .colm_left a.print:focus span::after { background-position:100% 12.5%; }

.ToolBar .colm_right, .ToolBar .colm_right dl { display: flex; }
.ToolBar .colm_right dt::after { content: '：'; }
.ToolBar dl.font_size dd { margin-right:7px; }
.ToolBar dl.font_size dd:last-of-type { margin-right:0; }
.ToolBar dl.font_size a { text-indent:-10000px; font-size: 0; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); }
    .ToolBar dl.font_size dd.font_small a::after { background-position:0 25%; }
    .ToolBar dl.font_size dd.font_medium a::after { background-position:0 37.5%; }
    .ToolBar dl.font_size dd.font_big a::after { background-position:0 50%; }
.ToolBar dl.font_size a:hover, .ToolBar dl.font_size a:focus { background-color: var(--color2); }
    .ToolBar dl.font_size dd.font_small a:hover::after, .ToolBar dl.font_size dd.font_small a:focus::after { background-position:100% 25%; }
	.ToolBar dl.font_size dd.font_medium a:hover::after, .ToolBar dl.font_size dd.font_medium a:focus::after { background-position:100% 37.5%; }
	.ToolBar dl.font_size dd.font_big a:hover::after, .ToolBar dl.font_size dd.font_big a:focus::after { background-position:100% 50%; }

.ToolBar dl.share dt { position:relative; }
.ToolBar dl.share dd { margin-right:7px; position:relative; }
.ToolBar dl.share dd:last-of-type { margin-right:0; }
.ToolBar dl.share a { cursor:pointer; text-indent:-10000px; font-size: 0; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); }
.ToolBar dl.share .noscript a { font-size: 1rem; }
	.ToolBar dl.share dd.facebook a::after { background-position:0 62.5%; }
	.ToolBar dl.share dd.twitter a::after { background-position:0 75%; }
	.ToolBar dl.share dd.line a::after { background-position:0 87.5%; }
.ToolBar dl.share dd.facebook a:hover, .ToolBar dl.share dd.facebook a:focus { background-color: #3b5998; }
.ToolBar dl.share dd.twitter a:hover, .ToolBar dl.share dd.twitter a:focus { background-color: #000; }
.ToolBar dl.share dd.line a:hover, .ToolBar dl.share dd.line a:focus { background-color: #01b901; }
.ToolBar dl.share dd.facebook a:hover::after, .ToolBar dl.share dd.facebook a:focus::after { background-position:100% 62.5%; }
.ToolBar dl.share dd.twitter a:hover::after, .ToolBar dl.share dd.twitter a:focus::after { background-position:100% 75%; }
.ToolBar dl.share dd.line a:hover::after, .ToolBar dl.share dd.line a:focus::after { background-position:100% 87.5%; }

.ToolBar dl.share .noscript a { display:inline; border-radius: 0; }

.ToolBar .colm_left a, .ToolBar dl.font_size a, .ToolBar dl.share a {
    border-radius:20px; background: #fef0d7;
    -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; 
}

.ToolBar .colm_left a, .ToolBar dl.font_size, .ToolBar dl.share { line-height:40px; }
.ToolBar .colm_left a span, .ToolBar dl.font_size a, .ToolBar dl.share a { width:40px; height:40px; }
.ToolBar .colm_left a span::after, .ToolBar dl.font_size a::after, .ToolBar dl.share dd > a::after { width: 36px; height: 36px; transform: translate(-50%, -50%); }

@media screen and (max-width: 479px) {
    .ToolBar .colm_left a span, .ToolBar dl.font_size a, .ToolBar dl.share a { width: 36px; height: 36px; }
	.ToolBar dl.font_size dt, .ToolBar dl.share dt { font-size: 0; }
}
@media screen and (max-width: 1023px) {
    .ToolBar .colm_left { display:none; }
    .ToolBar .colm_right { justify-content: space-between; }
    .ToolBar dl.share { padding-left: 8px; }
}
@media screen and (min-width: 1024px) {
    .ToolBar { display: flex; justify-content: space-between; }
    .ToolBar .colm_right dt { padding-left: 12px; }
    .ToolBar dl.font_size + dl.share { margin-left:12px; }
    .ToolBar .colm_left + .colm_right { margin-left:5px; }
}

/*----------------------------------------------------------------------*/
/* 列表搜尋 */
.ListSearch { margin-bottom:25px; padding-bottom:5px; position:relative; display:flex; flex-wrap:wrap; align-items:flex-end; }
.ListSearch .item { max-width:100%; margin:0 10px 10px 0; }
.ListSearch .item .label { line-height:35px; }
.ListSearch .btn button {
    height: 40px; line-height: 40px; margin-bottom: 20px; background-color: #1cafa4; color: #fff; padding: 0 14px; letter-spacing: .05em; text-align: center;
    -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease;
}
.ListSearch .btn button:hover, .ListSearch .btn button:focus { background-color:var(--main_color); box-shadow: 0 2px 8px rgba(0,0,0,.1); }
.ListSearch .keyword input[type="text"] { width:260px; border-radius:5px; }
.ListSearch select { border-radius:5px; color: #000; }
.ListSearch select, .ListSearch .btn button, .ListSearch input[type="text"] { font-size: 1.15rem; }

@media screen and (max-width: 539px) {
    .ListSearch { flex-direction:column; width:100%; align-items: flex-start; }
    .ListSearch .item { flex-direction:column; width:100%; margin: 5px 0; }
    .ListSearch .item .cont { width:100%; }
    .ListSearch .btn button { margin-bottom: 0; margin-top: 5px; }
    .ListSearch.FormElmt input[type="text"] { width:100%; }
    .ListSearch select { width: 100%; }
}

@media screen and (max-width: 1023px) {
    .ListSearch .item { line-height:40px; }
    .ListSearch .btn button { margin-bottom: 10px; }
}
@media screen and (min-width: 1024px) {
    .ListSearch { border-bottom:1px solid #ddd; }
    .ListSearch .item { margin-right: 20px; line-height:50px; }
    .ListSearch .btn { padding-top: 35px; }
}
	
/*----------------------------------------------------------------------*/
/* 分類下拉 */
.CatTitle { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; letter-spacing: 1.5px; border-bottom: 1px solid #d6dae8; margin-top: 40px; }
.CatTitle h3 { font-weight: 700; line-height:1.25em; font-size:1.5em; padding-right: 1em; letter-spacing: .02rem; }
.CatTitle .cat_select { display: flex; align-items: flex-end; flex-wrap: wrap; padding-top: 10px; letter-spacing: .05rem; margin-bottom: 10px; }
.CatTitle .cat_select .title { padding: 1em 1em 1em 0; display: block; }
.CatTitle .cat_select select, .CatTitle .cat_select .btn { font-size:1rem; }
.CatTitle .cat_select.FormElmt select { color: #000; }
.cat_select.FormElmt select { background-color:#fff; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; border:1px solid #d7d7d7; margin-bottom: 10px; margin-right: 20px; margin-top: 0; padding-left: .5rem; }
.cat_select.FormElmt select:focus { border:1px solid #aaa; background-color: #fffef3; }
.CatTitle .cat_select .btn button { font-size: 1em; color:#fff; background-color:#1cafa4; border-radius: 0px; padding:0 1em; letter-spacing: .05em; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
.CatTitle .cat_select .btn button:hover, .CatTitle .cat_select .btn button:focus { background-color:var(--main_color); box-shadow: 0 2px 8px rgba(0,0,0,.1); }

.CatTitle .cat_select .title, .cat_select.FormElmt select, .CatTitle .cat_select .btn, .CatTitle .cat_select.FormElmt .item .label, .CatTitle h3 { margin-bottom: 10px; }
.CatTitle .cat_select.FormElmt .item{ display: flex; justify-content: center; align-items: center; }
.CatTitle .cat_select.FormElmt .item label { font-size: 1rem; letter-spacing: 0; line-height: 35px; margin-right: 10px; }
.CatTitle .cat_select.FormElmt select, .CatTitle .cat_select .btn button { font-size: 1.15rem; height: 40px; line-height: 40px; }
.cat_select.FormElmt select { width: auto; }

@media screen and (max-width: 767px) {
    .CatTitle { flex-direction: column; align-items: flex-start; margin-top: 0;}
    .CatTitle .cat_select .title { width: 100%; padding: 5px 0; }
    .cat_select.FormElmt select, .CatTitle .cat_select .btn { height: 40px; line-height: 40px; }
    .cat_select.FormElmt select { width: 100%; max-width: 100%; }
    .CatTitle .cat_select, .CatTitle .cat_select.FormElmt .item { width: 100%; flex-direction: column; align-items: flex-start; }
    .cat_select.FormElmt .item{width: 100%;}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .CatTitle .cat_select { margin-top:0px; }
    .CatTitle { margin-top: 20px;}
}
@media screen and (min-width: 1024px) {
    .CatTitle h3 { font-size: 2.25em; }
    .CatTitle .cat_select { font-size: 1.25em; }
}

/*----------------------------------------------------------------------*/
/* 頁碼 */
#Pagination { clear:both; text-align:center; position: relative; padding: 10px 0 20px; }
#Pagination .pages { display: flex; justify-content: center; flex-wrap: wrap; }
#Pagination a {
    display:inline-block; width:35px; text-decoration:none; line-height:35px; color:#555; margin: 0 5px;
    border-radius: 20px; font-weight: 700;
}
#Pagination a:hover, #Pagination a:focus { background-color:#fef0d7; }
#Pagination a.focuz { background-color: #fef0d7; color:#555; border-radius: 20px; }
	#Pagination a.first, #Pagination a.prev, #Pagination a.next, #Pagination a.last { width:35px; padding:0; position: relative; font-size: 0; }
    #Pagination a.first:hover, #Pagination a.prev:hover, #Pagination a.next:hover, #Pagination a.last:hover { background-color: var(--main_color); color: #fff; }
    #Pagination a.first:focus, #Pagination a.prev:focus, #Pagination a.next:focus, #Pagination a.last:focus { background-color: var(--main_color); color: #fff; }

#Pagination a.first::before, #Pagination a.first::after, #Pagination a.prev::before, #Pagination a.next::before, #Pagination a.last::before, #Pagination a.last::after {
    content: ''; position: absolute; top: calc(50% - 4px);
    width: 6px; height: 6px; border-top: 2px solid #555; border-right: 2px solid #555;
}
#Pagination a.first:hover::before, #Pagination a.first:hover::after, #Pagination a.prev:hover::before, #Pagination a.next:hover::before, #Pagination a.last:hover::before, #Pagination a.last:hover::after {
    border-color: #fff;
}
#Pagination a.first:focus::before, #Pagination a.first:focus::after, #Pagination a.prev:focus::before, #Pagination a.next:focus::before, #Pagination a.last:focus::before, #Pagination a.last:focus::after {
    border-color: #fff;
}
#Pagination a.first::before, #Pagination a.first::after, #Pagination a.prev::before {
    -webkit-transform: rotate(-135deg); -moz-transform: rotate(-13deg); transform: rotate(-135deg);
}
#Pagination a.first::before { left: calc(50% + 2px); }
#Pagination a.first::after { left: calc(50% - 6px); }
#Pagination a.prev::before { left: calc(50% - 3px); }
#Pagination a.next::before, #Pagination a.last::before, #Pagination a.last::after { 
     -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);
}
#Pagination a.next::before { right: calc(50% - 3px); }
#Pagination a.last::before { right: calc(50% + 2px); }
#Pagination a.last::after { right: calc(50% - 6px); }

#Pagination .current { width:auto; background-color:transparent; cursor:default; }
	#Pagination .current:hover { color:#333; background-color:transparent; }
	
#Pagination .setting { display:block; clear:both; line-height:32px; color:#555; font-size:0.9375em; padding-top:14px; letter-spacing: .05em; }
#Pagination .setting select { padding:5px 0 5px 4px; height:32px; vertical-align:top; font-size: 1em; }
#Pagination .setting input { vertical-align:top; }
#Pagination .setting input[type="text"] { width:40px; height:32px; padding:0 .5em; font-size: 1em; }
#Pagination .setting select, #Pagination .setting input[type="text"] {
	border:1px solid #ddd; border-radius: 5px;
	-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
}
#Pagination .setting select:focus, #Pagination .setting input[type="text"]:focus { outline: none; border: 1px solid var(--main_color); }
#Pagination .setting input[type="button"] {
    height:32px; padding:0 .75em; margin-left:3px; color:#fff; font-size:1em; letter-spacing: .05em;
    border-radius: 0; line-height: 32px; background: #1cafa4;
}
#Pagination .setting input[type="button"]:hover, #Pagination .setting input[type="button"]:focus { background: var(--main_color); color: #fff; }

#Pagination a, #Pagination .setting select, #Pagination .setting input[type="text"], #Pagination .setting input[type="button"] { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }

/* 內頁頁碼 */
.inPagination { margin-top:30px; clear:both; text-align:center; font-size:1em; display:none; }
.inPagination .pages { display: flex; flex-wrap: wrap; justify-content: center; }
.inPagination a {
	display:inline-block; width:35px; line-height:35px; margin:0 4px 12px 4px; color:#555; text-decoration:none; font-weight: 700; 
	-webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;
	}
.inPagination a:hover, .inPagination a:focus { background-color:#eee; }
.inPagination a.focuz { background-color: #fef0d7; color:#555; }

@media screen and (max-width: 639px) {
    #Pagination { margin-bottom:10px; }
    #Pagination a { display:none; }
    #Pagination a.prev, #Pagination a.next, #Pagination .current { display:inline-block; margin:0 5px; }
    #Pagination .setting { display:none; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
    #Pagination { margin-bottom: 20px; }
    #Pagination a { display:none; }
    #Pagination a.first, #Pagination a.prev, #Pagination a.next, #Pagination a.last, #Pagination .current { display:inline-block; margin:0 5px; }
    #Pagination .setting { display:none; }
}
@media screen and (min-width: 1024px) {
    #Pagination .current { display:none; }
}
@media screen and (min-width: 1280px) {
    #Pagination .pages { font-size: 1.125em; }
    .inPagination a { width: 40px; line-height: 40px; }
}

/*----------------------------------------------------------------------*/
/* 檔案下載icon */
.file_ext { display:inline-block; position:relative; border-radius:4px; overflow:hidden; vertical-align:middle; }
.file_ext::before { 
	content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; 
	}
	.file_csv::before { background-color:#589c00; }
	.file_doc::before { background-color:#2372ba; }
	.file_img::before { background-color:#5b2d8d; }
	.file_mov::before { background-color:#c51700; }
	.file_other::before { background-color:#919191; }
	.file_pdf::before { background-color:#ea4c3a; }
	.file_ppt::before { background-color:#dd5b26; }
	.file_txt::before { background-color:#919191; }
	.file_xls::before { background-color:#08743b; }
	.file_xml::before { background-color:#157efb; }
	.file_zip::before { background-color:#e67e22; }
	.file_odt::before { background-color:#2372ba; }
	.file_ods::before { background-color:#08743b; }
	.file_odp::before { background-color:#dd5b26; }
.file_ext::after { 
    content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%;
    background-repeat:no-repeat; background-position:center center; background-size:cover; 
    }
	.file_csv::after { background-image:url("../images/file_ext/csv.png"); }
	.file_doc::after { background-image:url("../images/file_ext/doc.png"); }
	.file_img::after { background-image:url("../images/file_ext/img.png"); }
	.file_mov::after { background-image:url("../images/file_ext/mov.png"); }
	.file_other::after { background-image:url("../images/file_ext/other.png"); }
	.file_pdf::after { background-image:url("../images/file_ext/pdf.png"); }
	.file_ppt::after { background-image:url("../images/file_ext/ppt.png"); }
	.file_txt::after { background-image:url("../images/file_ext/txt.png"); }
	.file_xls::after { background-image:url("../images/file_ext/xls.png"); }
	.file_xml::after { background-image:url("../images/file_ext/xml.png"); }
	.file_zip::after { background-image:url("../images/file_ext/zip.png"); }
	.file_odt::after { background-image:url("../images/file_ext/odt.png"); }
	.file_ods::after { background-image:url("../images/file_ext/ods.png"); }
	.file_odp::after { background-image:url("../images/file_ext/odp.png"); }

.file_hashes { display:inline-block; position:relative; overflow:hidden; text-indent:-999px; vertical-align:middle; margin-left: 5px; margin-right: 5px; flex: 0 0 auto; }
.file_hashes a { display:block; width:24px; height:24px; border-radius:4px; position:relative; }
.file_hashes a:hover, .file_hashes a:focus { background-color: var(--color1); }
.file_hashes a::after { 
    content:''; display:block; position:absolute; top:50%; left:50%; width:18px; height:18px; margin:-9px 0 0 -9px; 
    background:url("../images/icon_file_hashes.png") 0 0 no-repeat; background-size:100%; 
    }
.file_hashes a:hover::after, .file_hashes a:focus::after { background-position:0 50%; }

/*----------------------------------------------------------------------*/
/* 文字列表 */
.ListTable { margin-top:20px; margin-bottom: 20px; position:relative; letter-spacing: .1em; }
.ListTable table { width:100%; }
.ListTable img { max-width: 100%; }
.ListTable + .ListTable { margin-top: 40px; }

.ListTable th { color:#fff; background-color:var(--main_color); padding:15px; }
.ListTable th.no { white-space: nowrap; }
.ListTable td.title { line-height:120%; font-weight: 700; }
.ListTable td.title a { display:block; text-decoration:none; }
.ListTable td.title a:hover, .ListTable td.title a:focus { color:var(--main_color); }
.ListTable td.date { color: #555; }

.ListTable td.title a.icon_key { display: inline-block; }
.ListTable td.download ul { display: flex; flex-wrap: wrap; }
.ListTable td.download ul li { margin: 5px; }
.ListTable td.download a { display: block; font-size: 0; text-indent: -10000px; width: 30px; height: 30px; }
.ListTable td.download .file_ext::before { width: 100%; height: 100%; }
.ListTable td.hash_value { word-break:break-all; text-align: left; }

@media screen and (max-width: 1023px) {
    table.rwdTable, .rwdTable tbody, .rwdTable tr, .rwdTable th, .rwdTable td { display:block; }
    .rwdTable tr:first-child { position:absolute; left:-10000px; top:-10000px; }
    .ListTable table { border-top: 1px solid var(--main_color); }
    .ListTable tr { padding:10px 15px; border-bottom: 1px solid var(--main_color); }
    .ListTable tr:nth-child(2n+3) { background-color:#f3f3f3; }
    .ListTable td { margin:8px 0; text-align:left; }
    .ListTable td.no { display:none; }
    .rwdTable td:before { font-weight:bold; content: attr(data-th)"："; }
    .rwdTable td.no:before, .rwdTable td.title:before, .rwdTable td.date:before, .rwdTable td.link:before, .rwdTable td.edit:before { display: none; }
    .ListTable td.title { font-size: 1.25em; }
}
@media screen and (min-width: 1024px) {
    .ListTable table { border-collapse: separate; border-spacing: 2px; }
    .ListTable th { font-size: 1.125em; padding:16px; position: relative; }
    .ListTable td { padding:16px; text-align:center; line-height:1.5em; vertical-align:middle; }
    .ListTable tr:nth-child(2n+3) { background-color:#f3f3f3; }
    .ListTable tr:first-child { border-bottom: none; }

    .ListTable th.date { width:7em; }
    .ListTable td.date { width:7em; }
    .ListTable th.cat { width:8em; }
    .ListTable td.cat { width:8em; }
    .ListTable td.title { text-align:left; }
    .ListTable td.link { text-align:left; }
    .ListTable td.download ul { justify-content: center; }
}
@media screen and (min-width: 1280px) {
    .ListTable { font-size: 1.25em; }
}
@media screen and (max-width: 639px) {
    .ListTable td.title { font-size: 1.125em; }
}

/*----------------------------------------------------------------------*/
/* 雜湊值驗證 */
h2.articleTitle { line-height:1.25em; letter-spacing: .1em; font-size: 1.5em; color: #000; margin-bottom: .5em; }
.file_value_wrap { max-width: 1290px; }
.file_value_wrap header { padding: 15px 0; }
.file_value_wrap .logo { width: 300px; max-width: 100%; margin-bottom: 1em; }
.file_value_wrap .editable_content p { margin-top: 1em; margin-bottom: 1em; }

.ListTable td.value { word-wrap: break-word; }
a.icon_key { width:20px; height:21px; margin-left:6px; font-size: 0; background: url(../images/icon_key.png) no-repeat center; display: inline-block; vertical-align: middle; transition: .3s; }
a.icon_key:hover, a.icon_key:focus { opacity: 0.7; }

/*----------------------------------------------------------------------*/
/* 按鈕樣式 */
a.btn_style { text-decoration: none; color: #fff; background-color: #0071b2; padding: 6px 12px; display: inline-block; white-space: nowrap; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
a.btn_style.gray_btn { background-color: #555; }

a.btn_style:hover, a.btn_style:focus { background-color: #fdc147; color: #055583; }

.ListTable + .btnBox { margin-bottom: 50px; }
.btnBox { display: flex; justify-content: center; }
.btnBox a { margin: 10px; }

a.btn_style.with_icon::before { display: inline-block; vertical-align: middle; margin-right: 0.4em; filter: invert(100%) sepia(100%) saturate(13%) hue-rotate(237deg) brightness(104%) contrast(104%); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; }
a.btn_style.with_icon:hover::before { filter: invert(13%) sepia(87%) saturate(3555%) hue-rotate(188deg) brightness(100%) contrast(96%); }
a.btn_style.download::before { content: ''; background: url(../images/icon_download.svg); width: 20px; height: 20px; }

/*----------------------------------------------------------------------*/
/* 網站導覽 */
.sitemap_instr .intro { line-height:2em; }
.sitemap_instr dl { margin-top:25px; }
.sitemap_instr dt { margin-bottom:15px; padding-left:10px; border-left:4px solid var(--main_color);  font-size:1.125rem; font-weight:bold; line-height:1.5em; }
.sitemap_instr dd { margin-left:2em; padding:0 0 12px 0; line-height:1.5em; position:relative; }
.sitemap_instr dd::after { 
	content:''; display:block; position:absolute; top:0.625em; left:-14px; width:6px ;height:6px; background-color:var(--color1); border-radius:50%;
	}
.sitemap_instr ul { margin-left:1.1em; padding:5px 0 5px 0; }
.sitemap_instr ul li { position:relative; }
.sitemap_instr ul li::after { 
	content:''; display:block; position:absolute; top:0.625em; left:-14px; width:6px ;height:6px; background-color:var(--color1); border-radius:50%;
	}
.sitemap_instr strong { color: var(--color1); font-weight:bold; }

.sitemap_title { margin-top:25px; margin-bottom:20px; color:#333; font-size:1.125rem; font-weight:700; line-height:1.5em; }
.sitemap_tree { border:1px solid #ffe6eb; background-color:#fff; padding-bottom:20px; color:#333; border-radius: 20px; }
.sitemap_tree li { line-height:1.8em; }
.sitemap_tree a { display:block; color:#333; text-decoration:none; }
.sitemap_tree a:hover, .sitemap_tree a:focus { color:var(--main_color); text-decoration:underline; }

/* 第1層 */
.sitemap_tree .home a { background-color:#ffe6eb; padding-left:10px; padding-right:10px; line-height:2.75em; font-size:1.125rem; text-align:center; color: var(--main_color); border-radius: 20px 20px 0 0; font-weight: bold; }
.sitemap_tree .home a:hover, .sitemap_tree .home a:focus { background-color: var(--main_color); color: #fff; text-decoration: none; }
.sitemap_tree > li:not(.home) { padding:0 30px; font-size:1.125rem; }
.sitemap_tree > li:not(.home) > a { padding:0.75em 0; border-bottom:1px solid #dedede; }
/* 第2層 */
.sitemap_tree > li > ol { margin-left:1.1em; margin-top:10px; }
.sitemap_tree > li > ol > li { font-size:1rem; }
.sitemap_tree > li > ol > li a { padding:5px 0; }
/* 第3層 */
.sitemap_tree > li > ol > li > ol { margin-left:2.2em; }
.sitemap_tree > li > ol > li > ol > li { font-size:0.9375rem; }
.sitemap_tree > li > ol > li > ol > li a { padding:5px 0; }
/* 第4層 */
.sitemap_tree > li > ol > li > ol > li > ol { margin-left:3.3em; }
.sitemap_tree > li > ol > li > ol > li > ol > li { font-size:0.9375rem; }
.sitemap_tree > li > ol > li > ol > li > ol > li a { padding:5px 0; }
/* 第5層 */
.sitemap_tree > li > ol > li > ol > li > ol > li > ol { margin-left:4.4em; }
.sitemap_tree > li > ol > li > ol > li > ol > li > ol > li { font-size:0.9375rem; color:#666; }
.sitemap_tree > li > ol > li > ol > li > ol > li > ol > li a { padding:5px 0; color:#666; }

/*----------------------------------------------------------------------*/
/* 單元頁 */
.SubMenuList li { margin-bottom:15px; }
.SubMenuList li a { 
	display:block; padding:10px 20px 10px 20px; color:#636363; line-height:150%; text-decoration:none; position:relative;
	background: -ms-linear-gradient(left,  #f0f0f0 0%,#d8d8d8 100%);
	background: linear-gradient(to right,  #f0f0f0 0%,#d8d8d8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#d8d8d8',GradientType=1 );
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	}
.SubMenuList li a::after { 
	content:''; display:block; position:absolute; top:20px; right:10px; width:6px; height:6px; border-top:2px solid #919191; border-right:2px solid #919191; 
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
	}
.SubMenuList li a:hover, .SubMenuList li a:focus { 
	color:#fff; 
	background: -ms-linear-gradient(left,  #004a89 0%,#00a7f4 100%);
	background: linear-gradient(to right,  #004a89 0%,#00a7f4 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004a89', endColorstr='#00a7f4',GradientType=1 );
	}
.SubMenuList li a:hover::after, .SubMenuList li a:focus::after { border-top:2px solid #fff; border-right:2px solid #fff; }

@media screen and (min-width: 1024px) {
    .SubMenuList ul { display: flex; flex-wrap: wrap; }
    .SubMenuList ul li { width: calc(50% - 15px); }
    .SubMenuList ul li:nth-child(2n) { margin-left: 30px; }
    .SubMenuList li a { font-size:1.125rem; }
}

/*----------------------------------------------------------------------*/
/* 圖文列表 - flex版 */
.ListPicText .item, .ListPicText .item > div, .ListPicText .img, .ListPicText .img > div, .ListPicText .cont, .ListPicText .btn { box-sizing:border-box; }

.ListPicText { margin-top:10px; }
.ListPicText > div { display: flex; justify-content: center; flex-wrap: wrap; }
.ListPicText .item { box-sizing:border-box; background: #fff; margin-bottom:40px; }
.ListPicText .item > div { overflow: hidden; height: 100%; margin-left: auto; margin-right: auto; border: 1px solid transparent; border-radius: 10px; }

.ListPicText .img { position:relative; overflow:hidden; border-radius: 10px;}
.ListPicText .img > div { padding-bottom:66.66%; background-repeat:no-repeat; background-position:center center; background-size:cover; transition:all 0.6s ease; }
.ListPicText .img a { display:block; width:100%; height:100%; position:absolute; top:0; left:0; text-indent:-999px; }

.ListPicText .date { 
	padding-bottom:5px; padding-top: 5px; position:relative; overflow:hidden; line-height: 1.5em; display: inline-flex; align-items: center; flex-wrap: wrap; vertical-align: top;
    font-size: 1.15rem; font-weight: 700; color: #1cafa4;   
	}
.ListPicText .date::before { content: ''; display: inline-block; width: 17px; height: 19px; background: url(../images/icon_date.png) no-repeat; margin-right: 0.5em; }
.ListPicText .cat {
    background-color: #e3e3e3; display: inline-flex; align-items: center; padding: 0 .5rem; border-radius: 4px; color: #999; font-weight: bold; font-size: .9375em;
    height: 1.8rem;  line-height: 1.8rem; position: relative; z-index:1; letter-spacing: .05rem;                 
}
.ListPicText .date + .cat { margin-left: 10px; margin-top: 6px; }

.ListPicText .title { margin-bottom:6px; overflow: hidden; }
.ListPicText .date + .title { margin-top: 6px; }
.ListPicText .cat + .title { margin-top: 10px; }
.ListPicText .title a { 
	text-decoration: none; position: relative; line-height:1.5em; font-weight: 700;
    background-image: linear-gradient(transparent 50%, #fff 50%); background-repeat: no-repeat; background-size: 50% 100%; transition: background-size 0.4s ease;
	}
.ListPicText .title a:hover, .ListPicText .title a:focus { color: var(--color1); background-image: linear-gradient(transparent 50%, #fffa6b 50%); background-size: 100% 100%; }
.ListPicText .desc { color: #666; line-height:2em; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; max-height:8em; -webkit-line-clamp:4; }
.ListPicText .btn { text-align: center; margin-top:10px; }
.ListPicText .btn a {
    display: inline-block; background-color:#333; color: #fff; font-weight: bold; padding: 10px 1.125em; font-size: 1.125em;
    -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
	-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease; 
}
.ListPicText .btn a:hover { background-color: #f46a00; }

/* list-view */
.ListPicText.list-view .img { float:left; width:360px; max-width:50%; box-sizing: border-box; }
.ListPicText.list-view .img > div { border-radius: 10px; }

/* 單欄 */
.ListPicText.single > div { flex-direction: column; }
.ListPicText.single .item { width: 100%; }

@media screen and (max-width: 639px) {
    /* 639px~480px時 一律以圖上文下雙欄顯示,479以下時，一律以圖上文下單欄顯示 */
    .ListPicText > div { margin-left:-10px; margin-right:-10px; }
    .ListPicText .item { padding-left:10px; padding-right:10px; margin-bottom:40px; }
    .ListPicText .title { font-size:1.125rem; }
    .ListPicText .desc { font-size:.9375em; max-height:8em; -webkit-line-clamp:4; }
    .ListPicText.list-view .img { float: none; width: 100%; max-width: 100%; }
    .ListPicText .item > div { max-width: 500px; }
    .ListPicText .btn a { font-size: 1em; }

    .ListPicText .cont { padding:15px 20px 20px; }
    .ListPicText .item { width:100%; max-width:420px; margin-left:auto; margin-right:auto; }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    .ListPicText > div { margin-left:-15px; margin-right:-15px; }
    .ListPicText .item { padding-left:15px; padding-right:15px; margin-bottom:35px; }
    .ListPicText .title { font-size:1.25rem; }
    .ListPicText .desc { font-size:.9375em; }

    /* 圖左文右 - list-view */
    .ListPicText.list-view .item { width: 100%; }
    .ListPicText.list-view .item > div { padding: 15px;	}
    .ListPicText.list-view .img { float:left; width:360px; max-width:48%; padding-right:15px; }
    .ListPicText.list-view .btn { text-align:right; }

    /* 圖左文右交錯 */
    .ListPicText.list-view.single.staggered .item:nth-child(2n+2) .img { float:right; padding-right:0; padding-left: 15px; }

    /* 圖上文下 - grid-view */
    .ListPicText.grid-view .cont { padding:15px; }
    .ListPicText.grid-view:not(.single) .item { width: 50%; }
}

@media screen and (min-width: 1024px) {
    .ListPicText { margin-top: 20px; }
    .ListPicText > div { margin-left:-20px; margin-right:-20px; }
    .ListPicText .item { padding-left:20px; padding-right:20px; margin-bottom:35px; }

    /* 圖左文右 - list-view */
    .ListPicText.list-view .btn { text-align:right; }

    /* 單欄 */
    .ListPicText.list-view.single.staggered .item:nth-child(2n+2) .img { float:right; }
    .ListPicText.single .img { padding:20px; }
    .ListPicText.grid-view.single .img { padding:0; }
    .ListPicText.single .cont { padding:20px; }
    .ListPicText.single .title { font-size:1.25rem; }

    /* 兩欄 */
    .ListPicText.bisection .item { width:50%; }
    .ListPicText.bisection .cont { padding:20px; }
    .ListPicText.bisection .title { font-size:1.25rem; }
    .ListPicText.bisection .desc { font-size:1rem; }
    .ListPicText.list-view.bisection .img { padding:20px; }
    .ListPicText.list-view.bisection .cont { padding:20px; }

    /* 三欄 */
    .ListPicText.trisection .item { width:33.3333%; }
    .ListPicText.trisection .cont { padding:20px; }
    .ListPicText.trisection .title { font-size:1.25rem; }
    .ListPicText.trisection .desc { font-size:1em; }
    .ListPicText.list-view.trisection .img { padding:15px; }
    .ListPicText.list-view.trisection .cont { padding:15px; }

    /* 四欄 */
    .ListPicText.quarters .item { width:25%; }
    .ListPicText.quarters .cont { padding:15px; }
    .ListPicText.quarters .title { font-size:1.125rem; }
    .ListPicText.quarters .desc { font-size:1rem; }
    .ListPicText.list-view.quarters .img { padding:15px; }
    .ListPicText.list-view.quarters .cont { padding:15px; }

    /* hover效果 */
    .ListPicText .item > div, .ListPicText .title a { 
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        transition: all 0.3s ease;
        }
    .ListPicText .item > div:hover {
        transform: translateY(-5px); border: 1px solid #eee;
        -moz-box-shadow: 1px 2px 5px rgba(0,0,0,.08);
        -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,.08);
        box-shadow: 1px 2px 5px rgba(0,0,0,.08);
    }
}
@media screen and (min-width: 1024px) and (max-width: 1439px) {
    .ListPicText.quarters .item { width:33.3333%; }
}

/*----------------------------------------------------------------------*/
/* 登入 */
.input_bar { margin-bottom: 25px; }
.login_form .icon { position:absolute; left:0; top:13px; text-align: center; width: 50px; }
.login_form .icon::before { font-family: "Font Awesome 5 Pro"; font-size:1.25rem; font-weight: 900; color: var(--color3); }
.login_form .icon.user::before { content: "\f007"; }
.login_form .icon.pw::before { content: "\f084"; }
.login_form .icon.check::before { content: "\f2f7"; }
.login_form label { font-size: 0; display: none; }
.login_form .note { padding: 4px; color: #666; }
.login_form .input_box { position: relative; display:inline-block; padding: 5px 10px 5px 60px; width:100%; box-sizing:border-box; font-size: 1.125em; background-color: #fff; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border: 1px solid rgba(170,170,170,.8); transition:all 0.3s ease; }
.login_form .input_box:hover { box-shadow:0 0px 10px rgba(0,0,0,.4); }
.login_form .input_box::after { content: ''; position: absolute; left: 50px; top: 15px; width: 1px; height: calc(100% - 30px); background-color: #d6dae8; }
.login_form input { border:none; padding:0; margin:0; font-size:1em; background-color:transparent; width:100%; outline:none; height: 40px; }

.login_form .randomcode .input_box { display: flex; align-items: center; }
.login_form .randomcode .input { flex: 1; }
.login_form .randomcode .img { margin: 5px 10px; width: 100px; }
.login_form .randomcode .img img { max-width: 100%; vertical-align: middle; }
.login_form .randomcode .btns { position:relative; display: flex; align-items: center; flex-wrap: wrap; }
.login_form .randomcode .btns button { margin-left: 1.125rem; font-size: .875rem; border-bottom: 1px solid #777; line-height: 1.5em; }
.login_form .randomcode .btns button::before { content:"\f01e"; font-family:'Font Awesome 5 Pro'; font-weight:400; position:absolute; left:0; top:.125em; z-index:1; color: #666; transition: all 0.3s ease; }
.login_form .randomcode .btns button:hover { border-color: var(--color2); color: var(--color2); }
.login_form .randomcode .btns button:hover::before { color: var(--color2); }

.SignBox.FormGroup { border-color: var(--color2); }
.SignBox.FormGroup .FormGroupTitle { background-color: var(--color2); }
.SignBox .text_box { text-align: center; height: calc(100% - 82px); display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 1.125em; margin-bottom: 20px; }
.SignBox .text_box .imgBox { margin-bottom: 20px; }
.SignBox .text_box .imgBox img { vertical-align: middle; }

span.field-validation-error > span { color: #d00; line-height: 1.25em; display: inline-block; margin-top: 8px; margin-left: 4px; position: relative; }
span.field-validation-error > span:before { content: "\f06a"; font-family:"Font Awesome 5 Pro"; font-weight: 900; margin-right: 5px; }

@media screen and (min-width: 1280px) {
	.login_form input { height: 60px; }
	.login_form .icon { top: 18px; width: 60px; }
	.login_form .input_box { padding: 0 10px 0 70px; }
	.login_form .input_box::after { left: 60px; }
	.LoginGroup .FormGroup { padding: 80px 70px 100px; display: flex; flex-direction: column; justify-content: space-between; }
}
@media screen and (min-width: 1024px) {
	.LoginGroup { display: flex; padding-top: 35px; }
	.LoginGroup > * { flex: 1; }
	.LoginGroup > :first-child { margin-right: 5.5%; }
	.LoginGroup .FormGroup .FormGroupTitle { left: 50%; transform: translateX(-50%); text-align: center; }
}
@media screen and (max-width: 639px) {
	.LoginGroup .FormGroup { margin: 40px 0; }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
	.LoginGroup .FormGroup { margin: 55px 0; }
}
@media screen and (max-width: 499px) {
	.login_form .randomcode .input_box { flex-wrap: wrap; }
	.login_form .randomcode .input { flex: auto; width: 100%; }
	.LoginGroup .btn_box { flex-direction: column; }
	.LoginGroup .btn_box > div { width: 100%; }
}

/*----------------------------------------------------------------------*/
/* 按鈕 */
.btn_box { display: flex; align-items: center; justify-content: center; }
.btn_box > div { padding: 6px; }
.btn_box a { text-decoration: none; display: block; text-align: center; width: 220px; position: relative; color: #fff; padding: 12px; font-size: 1.125em; font-weight: 700; line-height: 1.4444em; }
.btn_box a span { position: relative; z-index: 5; display: flex; align-items: center; justify-content: center; }
.btn_box a::before {
    content: ''; width: 100%; height: 100%; display: block;
    background: linear-gradient(to right, #0ba193 0%,#2ec8c0 100%);
    position: absolute; left: 0; top: 0; opacity: 1;
    -moz-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    -webkit-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
} 
.btn_box a::after {
    content: ''; width: 0%; height: 100%; display: block; background: #0ba193;
    position: absolute; left: 0; top: 0; opacity: 0;
    -webkit-transition: all .94s cubic-bezier(.2,.95,.57,.99);
    -moz-transition: all .4s cubic-bezier(.2,.95,.57,.99);
    -o-transition: all .4s cubic-bezier(.2,.95,.57,.99);
    transition: all .4s cubic-bezier(.2,.95,.57,.99);
}
.btn_box a:hover::before { box-shadow:0 0px 8px rgba(0,0,0,.6); }
.btn_box a:hover::after { opacity:1; width: 100%; }

.btn_box .grey a::before { background: linear-gradient(to right, #7f7f7f 0%, #aaaaaa 100%); }
.btn_box .grey a::after { background: #7f7f7f; }
.btn_box .gold a::before { background: linear-gradient(to right, #dc8f37 0%, #eec785 100%); }
.btn_box .gold a::after { background: #dc8f37; }

.LoginGroup .btn_box { margin-left: -6px; margin-right: -6px; }
.LoginGroup .btn_box > div { flex: 1; max-width: 220px; }
.LoginGroup .btn_box a { width: 100%; }

/*----------------------------------------------------------------------*/
/* 註冊 */
.avatar_upload { position: relative; width: 200px; height: 200px; border: 1px solid #aaa; background-color: #fff; padding: 8px; }
.avatar_edit { position: absolute; right: 0; bottom: 0; z-index: 9; font-size: 0; }
.avatar_edit input { display: none; }
.avatar_edit input + label { display: flex; justify-content: center; align-items: center; width: 48px; height: 48px; cursor: pointer; background-color: var(--color3); transition: all 0.3s ease; }
.avatar_edit input + label::before { content: "\f093"; font-family: "Font Awesome 5 Pro"; font-weight: 900; font-size: 1.5rem; color: #fff; }
.avatar_edit input + label:hover { background-color: var(--color1); }
.avatar_preview { position: relative; height: 100%; }
.avatar_preview .text { position: relative; z-index: 1; padding: 8px 10px; color: #007970; font-size: 1rem; }
.avatar_preview #imagePreview { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: contain; }

.identityBox .text { padding-top: 20px; font-weight: bold; }
.identityBox .text span.required { margin-left: 4px; }

@media screen and (max-width: 639px) {
	.identityType { line-height: 35px; margin-top: 10px; }
}

@media screen and (min-width: 640px) {
	.identityBox { display: flex; flex-wrap: wrap; }
    .identityBox .text { width: 100%; }
	.identityType { flex: 1; padding-left: 70px;  }
	.identityType .input_group { height: 100%; display: flex; flex-direction: column; justify-content: space-evenly; }
}

/*----------------------------------------------------------------------*/
/* 個資聲明 */
.privacy_cont { background-color: #fff; border-radius: 4px; border: 1px solid #aaa; line-height: 1.5em; margin-bottom: 10px; overflow: hidden; }
.privacy_cont .scroll { padding: 20px 40px; max-height: 480px; overflow-y: auto; }
.font_tc { text-align: center; }

.privacy_cont p, .privacy_cont ul, .privacy_cont ol { margin-top:.75em; margin-bottom:.75em; }
.privacy_cont ol { list-style-type:decimal; padding-left:2em; overflow:hidden; }
.privacy_cont ul { list-style-type:disc; padding-left:2em; overflow:hidden; }
	.privacy_cont ul[type="disc"] { list-style-type:disc; }
	.privacy_cont ul[type="circle"] { list-style-type:circle; }
	.privacy_cont ul[type="square"] { list-style-type:square; }
.privacy_cont li { margin-bottom:0.625em; }
.privacy_cont ol ol { list-style-type:lower-alpha; }
.privacy_cont ul ul { list-style-type:circle; }
.privacy_cont ul ul, .privacy_cont ul ol, .privacy_cont ol ul, .privacy_cont ol ol { margin-top:5px; margin-bottom:0; }
.privacy_cont ul li:last-child, .privacy_cont ol li:last-child { margin-bottom:0; }

@media screen and (min-width: 640px) {
    .FormGroup.privacy .FormTable > tbody > tr > th { padding: 16px 0; background-color: transparent; }
}
@media screen and (min-width: 1024px) {
    .FormGroup.privacy .FormTable > tbody > tr > th { width:145px; }
}

/*----------------------------------------------------------------------*/
/* 與會名單 - Lotte changed style */
.ParticipantContent{ padding-bottom: 0px; }
.countryGroup{ padding-top: 36px; padding-bottom: 36px; border-bottom: 1px solid  #d6dae8;}
.countryGroup:last-child{border-bottom: none;}
.countryTitle{ margin-bottom: 0px;}

/* 修改國旗為 放置img 方式 */
.countryTitle .flagAndName{ display: flex; align-items: center; justify-content: flex-start; font-size: 2.25rem;}
.countryTitle .flagAndName img{ width: 60px; height: auto; margin-right: 20px;}

/* 與會名單 國旗標題 - Lotte changed style */
.flagIcon.Cambodia:before{ background-position: 0% 0%;}
.flagIcon.India:before{ background-position: 0% 33.3%;}
.flagIcon.Indonesia:before{ background-position: 0% 66.6%;}
.flagIcon.Japan:before{ background-position: 0% 100%;}

.flagIcon.Korea:before{ background-position: 33.3% 0%;}
.flagIcon.Malaysia:before{ background-position: 33.3% 33.3%;}
.flagIcon.Mongolia:before{ background-position: 33.3% 66.6%;}
.flagIcon.Nepal:before{ background-position: 33.3% 100%;}

.flagIcon.PapuaNewGuinea:before{ background-position: 66.6% 0%;}
.flagIcon.Philippines:before{ background-position: 66.6% 33.3%;}
.flagIcon.SriLanka:before{ background-position: 66.6% 66.6%;}
.flagIcon.Taiwan:before{ background-position: 66.6% 100%;}

.flagIcon.Thailand:before{ background-position: 100%  0%;}
.flagIcon.Kyrgyzstan:before{ background-position: 100% 33.3%;}
.flagIcon.OtherCountries:before{ background-position: 100% 66.6%;}


/* 與會名單 機構 - Lotte changed style */
.institutionGroup{ margin-top: 0px; padding-top: 0px; }
.institutionGroup:nth-of-type(1) .institutionTitle{margin-top: 36px;}
.institutionTitle{ margin: 16px 0 36px 0; width: 100%; background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) calc(50% - 2px), rgba(28,175,164,1) calc(50% - 2px), rgba(28,175,164,1) calc(50% + 2px), rgba(255,255,255,1) calc(50% + 2px), rgba(255,255,255,1) 100%); } 
.institutionTitle > span{ display: inline-block; min-width: 334px; padding: 8px 16px; background-color: var(--color3); color: #fff; font-size: 1.5rem; line-height: 1.5; }
/* 顯示很長的姓名與職稱 -start */
.institutionList{ display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; padding-left: 16px;}
.institutionList .item > div{ background: #f4f4f4; height: 100%; display:flex;     margin: 0px auto;}
.institutionList .item .photo { margin-left: -16px; margin-top: -16px; z-index:2;  border-radius: 0px; }
.institutionList .item .photo > div { padding-bottom:120%; overflow:hidden; background-repeat:no-repeat; background-position:center center; background-size:cover; }
.institutionList .item .cont{ color: #333333; line-height: 1.2; height: 100%; }
.institutionList .item .name{ font-weight: bold; line-height: 1.1;}
.institutionList .item .delegate{ color: var(--color3); font-weight: bold;}
.institutionList .item .cont > *{ margin-bottom: 8px; overflow: hidden; }
.institutionList .item .delegate{ margin-bottom: 0; }
.institutionList .item .designation{ line-height: 1.1;}
.institutionList .item .cont-wrapper-forlongtext{   }
.institutionList .item .delegate, .institutionList .item .name, .institutionList .item .designation{    margin-bottom: .5rem;}
.institutionList .item .department{    color: #666;}
/* .institutionList .item > div{ margin: 20px auto 20px auto; } */
/* 顯示很長的姓名與職稱 -end */




@media screen and (min-width: 1281px){
    /* 顯示很長的姓名與職稱 -start */
    .institutionList .item{ width: calc(50% - 40px); padding: 30px 0;} 
    .institutionList .item .cont{  padding: 24px  24px ;  }
    /* 顯示很長的姓名與職稱 -end */
    .institutionList .item .photo{ width: 160px;}
    .institutionList .item .cont{ width: calc(100% - 144px);}
    .institutionList .item .designation, .institutionList .item .department, .institutionList .item .delegate{ font-size: 1.25em; }
    .institutionList .item .name{ font-size: 1.5em; }
    .institutionList .item > div{ min-height: 12.5em;}
    
}
@media screen and (max-width: 1280px){
    /* 顯示很長的姓名與職稱 -start */
    .institutionList .item{ width: calc(50% - 40px); padding: 20px 0;} 
    /* 顯示很長的姓名與職稱 -end */
    .institutionList .item .cont{  width: calc(100% - 104px); padding: 20px  20px ;  }
    .institutionList .item .photo{ width: 120px;}
    .institutionList .item .designation, .institutionList .item .department, .institutionList .item .delegate{ font-size: 1em; }
    .institutionList .item .name{ font-size: 1.25em; }    
    .institutionList .item > div{ min-height: 11em;}
}
@media screen and (max-width: 1023px){
    .countryGroup{ padding-top: 24px; padding-bottom: 24px;}
    .countryTitle > span{font-size: 1.5em;  line-height: 1.2;}
    .institutionTitle{font-size: 1.25em;  line-height: 1.2; }    
    /* 顯示很長的姓名與職稱 -start */
    .institutionList .item{width: 100%; padding: 20px 0;}
    /* 顯示很長的姓名與職稱 -end */
    .institutionList .item > div{position:static; min-height: 10em; display: flex;}
    .institutionList .item .photo{position: static; margin-left: -16px; margin-top: -16px;}
    .institutionList .item .cont{position: static;}        
}
@media screen and (max-width: 767px) {
    .institutionTitle > span{ min-width: auto; width:100%; font-size: 1.25rem;}
	.institutionGroup, .institutionTitle{ position:static;}
    .institutionTitle{ margin-top: 0px; margin-bottom: 26px;  width: 100%;}
    .institutionGroup:nth-of-type(1) .institutionTitle { margin-top: 26px; }
    .institutionList{padding-left: 0;}
    .institutionList .item > div{flex-direction: column; margin-top: 0; min-height: auto;}
    .institutionList .item .photo{ margin: 16px auto 0 auto;}
    .institutionList .item .cont{ width: 100%; text-align: center; padding: 16px;}
    .institutionList .item .department, .institutionList .item .delegate, .institutionList .item .designation{font-size: 1.125rem; -webkit-line-clamp: none; }
}
/*----------------------------------------------------------------------*/
/* 貴賓介紹與檔案下載 - Lotte changed style */
/* 貴賓介紹 */
.speakerContent{ padding-bottom: 0px; }
.speakerGroup{  padding-bottom: 36px; }
.speakerGroup:nth-of-type(1){ padding-top: 36px;}
.speakerTitle{ margin-bottom: 40px;}
.speakerTitle > span{ display: flex; align-items: center; justify-content: flex-start; font-size: 2.25rem;}
.speakerList {padding-left: 16px;}
/* 顯示很長的姓名與職稱 -start */
.speakerList .itemSpeaker{ width: 100%; display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; }
.speakerList .itemSpeaker > * {	width: 50%; }
.itemSpeaker .profileBox > div{  background: #f4f4f4; display:flex;}

.itemSpeaker .profileBox .photo { margin-left: -16px; margin-top: -16px; z-index:2; border-radius: 0px; }
.itemSpeaker .profileBox .photo > div { padding-bottom:120%; overflow:hidden; background-repeat:no-repeat; background-position:center center; background-size:cover; }
.itemSpeaker .profileBox .cont{ right: 0px; top: 0px;  color: #333333; line-height: 1.2; height: 100%; overflow: hidden;	display:flex; flex-direction: column; justify-content: space-between; align-items: flex-start;
}

.itemSpeaker .profileBox .upperRow .name{ font-weight: bold; line-height: 1.1;}
.itemSpeaker .profileBox .upperRow > *{ margin-bottom: 8px;  }
.itemSpeaker .profileBox .upperRow .designation{ line-height: 1.1;}
.itemSpeaker .profileBox .upperRow{  }
.itemSpeaker .profileBox .country{ margin-bottom: .75rem;}
.itemSpeaker .profileBox .department{color: #666;}
/* 顯示很長的姓名與職稱 -end */
/* 修改國旗為 放置img 方式 */
.itemSpeaker .profileBox .country .flagAndName{display: flex; align-items: center; justify-content: flex-start;}
.itemSpeaker .profileBox .country .flagAndName img{ width: 27px; height: auto; margin-right: 8px;}

.itemSpeaker .profileBox > div, .itemSpeaker .downloadBox{ margin: 20px auto 20px auto; }

/* 貴賓介紹-檔案下載 - Lotte changed style */
.itemSpeaker .downloadBox{ border: 1px solid #2ec8c0; border-left-width: 4px; padding: 16px 20px 0 20px; }
.itemSpeaker .downloadTitle > span{ color:var(--color3); font-size: 1.125em; display: flex; align-items: center; justify-content: flex-start; margin-bottom: 10px;}
.itemSpeaker .downloadTitle > span::before{ display: block; content: ''; width: 18px; height: 18px; background: url('../images/member_download_icon.svg') no-repeat center center; margin-right: 8px;}
.itemSpeaker .downloadEmpty{ margin-top: 30px;}

/* 貴賓介紹-檔案下載樣式 - Lotte changed style */
.itemSpeaker .downloadBox ul.downloadList li > div { max-width: 100%; position:relative; line-height:1.5em; margin: 5px 8px 5px 0; background-color: #f2f2f2; border: 1px solid #d3d3d3; padding: 0.375em .75em; border-radius: 10px; display: inline-flex; align-items: center; flex-wrap: nowrap;}
.itemSpeaker .downloadBox ul.downloadList li > div a { color:#333; text-decoration:none; word-wrap:break-word; }
.itemSpeaker .downloadBox ul.downloadList li > div a {-webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical;}
.itemSpeaker .downloadBox ul.downloadList li > div a:hover, ul.ext_list li a:focus { color: var(--main_color); }
.itemSpeaker .downloadBox ul.downloadList li > div span.file_ext { width:24px; height:24px; margin-left:6px; text-indent:-10000px; vertical-align: middle; flex: 0 0 auto;}
.itemSpeaker .downloadBox ul.downloadList li{ padding-left: 0; }

.itemSpeaker .downloadBox ul.downloadList li > div:hover { background-color: transparent; }
.itemSpeaker .downloadBox ul.downloadList li > div:hover a { text-decoration: underline; color: var(--color1); }

@media screen and (min-width: 1281px){
    .itemSpeaker .profileBox{ width: calc(50% - 40px); } 
     /* 顯示很長的姓名與職稱 -start */
    .itemSpeaker .profileBox .cont{  padding: 24px  24px 24px 24px;  }
     /* 顯示很長的姓名與職稱 -end */
    .itemSpeaker .profileBox .photo{ width: 160px;}
    .itemSpeaker .profileBox .cont{ width: calc(100% - 144px);}
    .itemSpeaker .profileBox .upperRow .designation, .itemSpeaker .profileBox .upperRow .department, .itemSpeaker .downloadBox ul.downloadList li > div a, .itemSpeaker .downloadEmpty{ font-size: 1.25em; }
    .itemSpeaker .profileBox .country{ font-size: 1rem; }
    .itemSpeaker .profileBox .upperRow .name{ font-size: 1.5em; }
    .itemSpeaker .profileBox > div{ min-height: 13em;}
}
@media screen and (max-width: 1280px){
    .itemSpeaker .profileBox{ width: calc(50% - 40px); } 
    .itemSpeaker .profileBox .cont{  width: calc(100% - 104px); padding: 24px  24px ; justify-content: flex-start; }
    .itemSpeaker .profileBox .photo{ width: 120px;}
    .itemSpeaker .profileBox .upperRow .designation, .itemSpeaker .profileBox .upperRow .department, .itemSpeaker .downloadBox ul.downloadList li > div a, .itemSpeaker .downloadEmpty{ font-size: 1em; }
    .itemSpeaker .profileBox .country{ font-size: 1rem; }
    .itemSpeaker .profileBox .upperRow .name{ font-size: 1.25em; }
     /* 顯示很長的姓名與職稱 -start */
    .itemSpeaker .profileBox .country{ margin-top: 0px;}
    /* 顯示很長的姓名與職稱 -end */
    .itemSpeaker .profileBox > div{ min-height: 13em;}    
}
@media screen and (max-width: 1023px){
    /* 顯示很長的姓名與職稱 -start */
    .itemSpeaker .profileBox .upperRow{  height: auto;  overflow: initial;  }
    /* 顯示很長的姓名與職稱 -end */
    .speakerGroup:nth-of-type(1){padding-top: 20px;}
    .speakerTitle > span{font-size: 1.5em;  line-height: 1.2; }
    .speakerList .itemSpeaker > *{ width: 100%; }
    .speakerList .itemSpeaker:not(:nth-last-of-type(1)){ margin-bottom: 50px;}
    .itemSpeaker .profileBox > div{margin: 0px;}
     /* 顯示很長的姓名與職稱 -start */
    .itemSpeaker .profileBox .country{ margin-top: 0px;}
    /* 顯示很長的姓名與職稱 -end */
    .itemSpeaker .downloadBox{ margin: 0;  border-width: 1px; border-bottom-width: 4px}
    .itemSpeaker .downloadBox{ padding: 16px 20px 16px 20px; }
    .itemSpeaker .profileBox > div{position:static; min-height: 10em; display: flex;}
    .itemSpeaker .profileBox .photo{position: static; margin-left: -16px; margin-top: -16px;}
    .itemSpeaker .profileBox .cont{position: static;}    
}
@media screen and (max-width: 767px) {
    .speakerGroup{  padding-bottom: 24px; }
    .speakerGroup:nth-of-type(1){ padding-top: 24px;}
    .speakerList .itemSpeaker:not(:nth-last-of-type(1)) { margin-bottom: 30px; }
    .speakerTitle{ margin-bottom: 30px;}
    .speakerList {padding-left: 0;}
    .itemSpeaker .profileBox > div{flex-direction: column; margin-top: 0; min-height: auto;}
    .itemSpeaker .profileBox .photo{ margin: 16px auto 0 auto;}
    .itemSpeaker .profileBox .cont{ width: 100%; align-items:center; text-align:center; padding: 16px;}  
    .itemSpeaker .profileBox .upperRow .designation, .itemSpeaker .profileBox .upperRow .department, .itemSpeaker .downloadBox ul.downloadList li > div a, .itemSpeaker .downloadEmpty{ font-size: 1em; }  
    .itemSpeaker .downloadBox ul.downloadList li > div a {-webkit-line-clamp: 3;}
}
/*----------------------------------------------------------------------*/
/* 活動花絮 子選單 - Lotte changed style */
.GallerySubmenu ul{ margin-top: 40px; background: #f4f4f4; border-radius: 8px; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
.GallerySubmenu ul > li{ display: flex; justify-content: center; align-items: center;}
.GallerySubmenu ul > li:not(:last-child)::after{ content:''; width: 1px; height: 1.5em; display: block; border-right: 1px solid #999999;}
.GallerySubmenu ul > li{ width: 20%;}
.GallerySubmenu ul > li > a{ display: block; color: #999999; font-size: 1.5em; background:transparent; border-radius: 4px; text-decoration: none; text-align: center; padding: .5rem 0; margin: .5em .5em; width: 100%; font-weight: bold;}
.GallerySubmenu ul > li > a:hover,.GallerySubmenu ul > li > a.selected{ color: #ffffff; background: linear-gradient(to right, #0ba193 0%, #2ec8c0 100%);}
@media screen and (max-width: 767px) {
    .GallerySubmenu ul{  margin-bottom: 20px; }
    .GallerySubmenu ul > li > a{  width: 3.4rem; font-size: 1em; margin: .5em auto; padding: .5rem;}
}
@media screen and (max-width: 360px) {
    .GallerySubmenu ul > li > a{ width: 100%; margin: .5em 2px;}
}

/* 活動花絮 圖片列表- Lotte changed style */
.ListGallery .item, .ListGallery .item > div, .ListGallery .imgbox, .ListGallery .imgbox > div, .ListGallery .cont, .ListGallery .btn { box-sizing:border-box; }
.ListGallery { margin-top:10px; }
.ListGallery > div { display: flex; justify-content: center; flex-wrap: wrap; }
.ListGallery .item { box-sizing:border-box; background: #fff; margin-bottom:40px; }
.ListGallery .item > div { overflow: hidden; margin-left: auto; margin-right: auto; border-radius: 10px; box-shadow: none; height: 0; position: relative;padding-bottom: 66.66%; border: 1px solid transparent; }
.ListGallery .imgbox{ width: 100%; height: 100%; position:absolute; z-index:0;}
.ListGallery .imgbox::before{ content:''; display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:1; background: rgba(0,121,112,0); transition: all .5s ease;}
.ListGallery .imgbox::after{ content:''; display:block; width:50px; height:50px; position:absolute; top: calc(50% - 25px); left:calc(50% - 25px); z-index:2; background: url('../images/member_gallery_zoomin.png') no-repeat center center; transform: scale(0);transition: all .5s ease; }
.ListGallery .imgbox img{ object-fit: cover; width: 100%; height: 100%;  transition: all .5s ease;}

@media screen and (max-width: 639px) {
    .ListGallery > div { margin-left:-10px; margin-right:-10px; }
    .ListGallery .item { padding-left:10px; padding-right:10px; margin-bottom:20px; }
    .ListGallery .item { width:100%; max-width:420px; margin-left:auto; margin-right:auto; }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    .ListGallery > div { margin-left:-15px; margin-right:-15px; }
    .ListGallery .item { padding-left:10px; padding-right:10px; margin-bottom:20px; }
    .ListGallery.grid-view:not(.single) .item { width: 50%; }
}

@media screen and (min-width: 1024px) {
    .ListGallery { margin-top: 20px; }
    .ListGallery > div { margin-left:-20px; margin-right:-20px; }
    .ListGallery .item { padding-left:10px; padding-right:10px; margin-bottom:20px; }
    @media screen and (max-width: 1199px) {
        .ListGallery > div { margin-left:-20px; margin-right:-20px; }
    }

    /* 三欄 */
    .ListGallery.trisection .item { width:33.3333%; }
    
    /* hover效果 */
    .ListGallery .imgbox:hover::before{ background: rgba(0,121,112,0.7); transition: all .5s ease; }
    .ListGallery .imgbox:hover::after{ transform: scale(1); transition: all .5s ease; }	
	.ListGallery .imgbox:hover img{ transform: scale(1.3); transition: all .5s ease; }
}

/*----------------------------------------------------------------------*/
/* 常見問答 - Lotte changed style */
.QnaList { margin-top:30px; margin-bottom:30px; }
.QnaList li { margin-bottom:30px; }
.QnaList li:last-child { margin-bottom:0; }

.QnaList .ques { 
	background-color:#eee; width:100%; padding-top:18px; padding-bottom:18px; padding-right:40px; padding-left:98px; border-radius:10px; overflow:hidden; cursor:pointer; position:relative; 
	}
.QnaList .ques::before { 
	content:"Q"; display:flex; align-items:center; justify-content:center;
	position:absolute; top:-5px; left:0; width:72px; height: calc(100% + 5px); background: linear-gradient(to right, #0ba193 0%, #2ec8c0 100%); box-sizing:border-box; border-radius:8px 0px 0px 8px; 
	font-weight:700; font-size:36px; color:#fff;    
	}
.QnaList .ques::after { 
	content:""; display:block; position:absolute; top:50%; right:16px; width:12px; height:12px; border-right:4px solid #4d4d4d; border-top:4px solid #4d4d4d; margin-top:-8px;
    transform:rotate(135deg); transition: all 0.3s ease;
	}
	.QnaList .slideDown .ques::after { transform:rotate(-45deg); }
.QnaList .ques span { display:block; }
.QnaList .ques .title { 
	text-align:left; font-weight:700; font-size:1.5rem; line-height:1.375em; color:#333333; letter-spacing:0.02em; 
	}

.QnaList .ans { display:none; padding-top:15px; padding-bottom:15px; padding-right:15px; padding-left:15px; position:relative; }
.QnaList .ans .editable_content { padding-left:0; padding-right:0; margin-top:0; margin-bottom:0; }
.QnaList .ans .editable_content a{ color: var(--color1); }
.QnaList .ans .editable_content a:hover, .QnaList .ans .editable_content a:focus{ text-decoration: none; }
.QnaList .ques:hover, .QnaList .ques:focus, .QnaList .slideDown .ques { background-color:#00908c; }
.QnaList .ques:hover .title, .QnaList .ques:focus .title, .QnaList .slideDown .ques .title { color:#fff; }
.QnaList .ques:hover::before, .QnaList .ques:focus::before, .QnaList .slideDown .ques::before { background: linear-gradient(to right, #0ba193 0%, #2ec8c0 100%);  }
.QnaList .ques:hover::after, .QnaList .ques:focus::after, .QnaList .slideDown .ques::after { border-color:#fff; }

@media screen and (max-width: 479px) {
.QnaList .ques .title { font-size:1.125rem; }
}
@media screen and (min-width: 480px) {
.QnaList .ques .title { font-size:1.5rem; }
}