@charset "utf-8";

:root {
	
	--color-one: #022C61; /*blue*/
	
	--color-two: #D32D10; /*red*/
	
	--color-three: #0A6C90; /*peace blue*/
	
	--color-accent: #0A6C90; /*強調色*/

}



/* a鏈結字 */
a { color:#333;}
a:hover,
a:focus {
	color:var(--color-accent);
	text-decoration:none;
}


/*------------------------------------------------------------------------------------------- */
/*----- #page */
.page{
	margin:60px 0;
	font-size:14px;
	text-align:center;
	color:#7F7F7F;
}
.page a , .page span{
	display:inline-block;
	min-width:40px;
	height:40px;
	border-radius:5px;
	border:1px solid #999;
	line-height:40px;
	color:#666;
	background:#fff;
	text-align:center;
	padding:0 5px;
	margin:3px;
}
.page span{ background:var(--color-three); color:#fff; border-color:var(--color-three); }
.page a:hover{ border-color:var(--color-three); color:var(--color-three); }






/*------------------------------------------------------------------------------------------- */
/*----- #scrolltop */
.scrolltop{
	position:fixed;
	z-index:99;
    right:15px;
    bottom:50px;
    display:block;
    cursor:pointer;
	background:var(--color-two);

    border:3px solid rgba(255,255,255,0.6);
    border-radius:33px;
    padding:10px 5px;
	opacity:0;
}
.scrolltop img {
    animation:scroll-act1 3s infinite;
}
.scrolltop.show{ opacity:1; }

@keyframes scroll-act1{
	0% {
		opacity:0;
		-webkit-transform:translateY(12px);
		-ms-transform:translateY(12px);
		transform:translateY(12px);
	}
	50% {
		opacity:1;
		-webkit-transform:translateY(0px) scale(1);
		-ms-transform:translateY(0px) scale(1);
		transform:translateY(0px) scale(1);
	}
	
	100% {
		opacity:0;
		-webkit-transform:translateY(-10px) scale(1);
		-ms-transform:translateY(-10px) scale(1);
		transform:translateY(-10px) scale(1);
	}
}





/*------------------------------------------------------------------------------------------- */
/*----- #header：頁首 */
.header_top{
	display:none;
	padding:15px 0 5px 0;
}
.header_top .header_row{
	align-items:center;
}
.header_top .header-left,
.header_top .header-right{
	width:50%;
}
@media (min-width:992px){
	.header_top{
		display:block;
	}
}

.header_center{
	padding:10px 10px;
}
.header_center .container{
	width:100%;
	padding:0;
}
@media (min-width:1200px){
    .header_center .container{ width:90%; padding:0 20px; }
}
@media (min-width:1450px){
    .header_center .container{ width:80%; }
}
@media (min-width:1920px){
    .header_center .container{ width:75%; }
}

.header_center .header_row{
	align-items:center;
}
.header_center .header-left{
	width:120px;
}
.header_center .header-center{
	flex:1 1 auto;
	width:1%; min-width:0;
	margin:0 0.5rem;
}
.header_center .header-right{
	width:36px;
}
@media (min-width:992px){
	.header_center{
		padding:10px 0;
	}
	.header_center .header-left{
		width:250px;
	}
	.header_center .header-center{
		display:none;
	}
	.header_center .header-right{
		flex:1 1 auto;
		width:1%; min-width:0;
	}
}





/*------------------------------------------------------------------------------------------- */
/*----- #logo */
.logo{
	max-width:250px;	
	transition: max-width 0.5s;
}





/*------------------------------------------------------------------------------------------- */
/*----- #header.is-scroll */
.header{
	position: -webkit-sticky;
	position: sticky;
	z-index:10;
	top:0;
	background:#fff;
	transition:box-shadow 0.3s ease-in-out;
}
.header.is-scroll{
	box-shadow: 0 5px 10px rgba(0,0,0,0.1);
}
				
@media (min-width:992px){
	.header.is-scroll .header_top{
		display:none;
	}	
	
	/*.header.is-scroll .header_center{
		display:none;
	}*/
	.header.is-scroll .header_center .header-center{
		display:block;
	}
	.header.is-scroll .header_center .header-right{
		display:none;
	}
	.header.is-scroll .logo{
		max-width:120px;	
	}
	
	.header.is-scroll .menu li{
		margin:0;
	}
	.header.is-scroll .menu li a{
		font-size:1rem;
		padding:5px 2px;
		margin:0;
	}
	.header.is-scroll .menu li a:before{
		display:none;
	}
}





/*------------------------------------------------------------------------------------------- */
/*----- #standard-date */
.standard-date{
	font-size:0.875rem; font-weight:600;
	color:#808181;
}





/*------------------------------------------------------------------------------------------- */
/*----- #searchbar：搜尋(一欄位一搜尋按鈕) */
.top-searchbar{
	text-align:right;
}

.top-search{
	display:inline-block;
	border:1px solid #ccc;
	border-radius:20px;
	padding:0 10px;
}

.top-search form{
    display:flex; flex-wrap:wrap;
	align-items:center;
    width:100%;
}

.top-searchbar .search-input{
	display:block;
	
	flex:1 1 auto;
    width:1%;
    min-width:0;
	
	background:#fff;
    border:1px solid #fff;
	border-radius:3px;
	overflow:hidden;
	padding: 0.2rem 1rem;
}

.top-searchbar .search-btn{
	width:30px; height:30px;
	background:#fff;
	border-radius:3px;
	border-width:0px;
	margin-left:6px;
	
}
.top-searchbar .search-btn .iconsvg{
	width:100%; height:100%;
}
.top-searchbar .search-btn .iconsvg:before{
	background-color:#666;
	
	-webkit-mask-size: 70% 70%;
    mask-size: 70% 70%;
}
.top-searchbar .search-btn:hover .iconsvg:before{
	background-color:red;
}


.header_top .top-search{
	width:350px;
}








/*------------------------------------------------------------------------------------------- */
/*----- #navbar_topmenu */
.navbar_topmenu{
	display:none;
}
@media (min-width:992px){
	.navbar_topmenu{
		display:flex;
		justify-content:flex-end;
	}
}
.navbar_topmenu > li{
	margin-left:2rem;
}
.navbar_topmenu > li:first-child{
	margin-left:0;
}

.subfunc{
}
.subfunc .iconsvg,
.subfunc-text{
	display:inline-block; vertical-align:middle;
}
.subfunc .iconsvg{
	width:20px; height:20px;
}
.subfunc .iconsvg:before{
	background-color:#666;
}
.subfunc-text{
	color:#333;
}

.subfunc a:hover .iconsvg:before{
	background-color:var(--color-accent);
}
.subfunc a:hover .subfunc-text{
	color:var(--color-accent);
}





/*------------------------------------------------------------------------------------------- */
/*----- #dropdown 下拉式選單 */
.dropdown{
	position: relative;
	display: inline-block;
}
.dropdown_trigger{
	display: block;
	background: #666;
	border: 1px solid #eee;
	color: #fff;
	border-radius: 6px;
	line-height: 1;
	padding: 0.5rem 1rem;
	text-align: center;
}
.dropdown_trigger-text{
	position: relative;
	display: inline-block;
	font-size: 0.875rem; font-weight: 600; line-height: 1;
	padding-right: 12px;
}
.dropdown_trigger-text:before{
	position: absolute; top: 50%; right: 0; content: "";
	width: 0; height: 0;
	margin-top: -2px;
	
	border-width: 4px 4px 0 4px;
	border-style: solid;
	border-color: transparent;
	
	border-top-color: #fff;
}

.dropdown_trigger:focus{
	background: #666;
	border-color: #eee;
	color: #fff;
}

.dropdown_trigger:hover{
	background:#000;
	border-color: #ccc;
	color: #fff;
}

.dropdown_trigger.is-open{
	background-color: var(--color-accent);
	border-color: var(--color-accent);
	color: #fff;
}
.dropdown_trigger.is-open .dropdown_trigger-text:before{
	border-width: 0 4px 4px 4px;
	border-top-color: transprent;
	
	border-bottom-color: #fff;
}

.dropdown_content{
	display: none;
	position: absolute; z-index: 4; top: 100%; right: 0;
	width: 150%;
	background: #fff;
	border-radius: 5px;
	box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
}
.dropdown_content.is-open{
	display: block;
}

.dropdown_menu{
	padding:0 5px;
}
.dropdown_menu li{}
.dropdown_menu li a{
	display: block;
	width: 100%;
	border-bottom: 1px solid #ccc;
	font-size: 0.875rem; font-weight: 600; line-height: 1;
	color: #333;
	padding: 1rem 2px;
	text-align: center;
}
.dropdown_menu > li:last-child a{ border-bottom-width: 0; }

.dropdown_menu li a:hover{
	color: red;
}






/*------------------------------------------------------------------------------------------- */
/* ===== navbar_toggler header：側邊隱藏區塊-觸發鈕 ===== */
.navbar_toggler{
	position:relative;
	z-index:2;
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content:center;
	
	width:34px;
    background:#fff;
	margin:0 0 0 auto;
    padding:5px;
	
	/*取消連結的醒目點選標示*/
	-webkit-tap-highlight-color: transparent;
}
.navbar_toggler .navbar_toggler-icon,
.navbar_toggler .navbar_toggler-text{
	display:block;
	line-height:1;
}
.navbar_toggler .navbar_toggler-icon{
	width:24px; height:24px;
}
.navbar_toggler .sign_hamburger:before, 
.navbar_toggler .sign_hamburger:after , 
.navbar_toggler .sign_hamburger-line{
	height:3px;
	margin-top:-1px;
}

@media (min-width:992px){
	.navbar_toggler{
		display:none;
	}
}
.navbar_toggler .navbar_toggler-text{
	display:none;
}







/*------------------------------------------------------------------------------------------- */
/*---- #水平menu組 */
.menubar{
	position:relative;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
}
.menubar .container{
	width:100%;
	padding:0;
}
@media (min-width:1200px){
    .menubar .container{ width:90%; padding:0 20px; }
}
@media (min-width:1450px){
    .menubar .container{ width:80%; }
}
@media (min-width:1920px){
    .menubar .container{ width:75%; }
}

.menubar_inner{
	position:relative;
	/* padding-right:30px; */
}

.menubar:before{
	position:absolute; z-index:3; top:0; right:0; content:"";
	width:60px; height:100%;

	background:linear-gradient(left,transparent , #fff 20% );
	background:-moz-linear-gradient(left,transparent , #fff 20% );
	background:-webkit-linear-gradient(left,transparent , #fff 20% );
	background:-o-linear-gradient(left,transparent , #fff 20% );
	background:-ms-linear-gradient(left,transparent , #fff 20% );
}




/*===== 水平menu */
.hznav{
	overflow: hidden;
	padding: 0 10px 0 10px;
}
@media (min-width:992px){
	.hznav{
		display:none;
	}
}

.hznav-wrap{
	display: flex;
	overflow-x: hidden;
}
.hznav-inner{
	flex: 1 0 auto;
}

.hznav_ul {
	display:flex; flex-wrap:wrap;
	align-items:center;
}
.hznav_ul li {
    margin: 0 10px;
}
.hznav_ul li:last-child {
    margin-right:80px;
}
.hznav_ul li a{
	position:relative;
	display:block;
	color: #333;
	padding:10px 5px;
}
.hznav_ul li a:before{
	position:absolute; bottom:0; left:0; content:"";
	width:100%; height:2px;
	background:red;
	opacity:0;
}
.hznav_ul li.active a{
	color: red;
}
.hznav_ul li.active a:before{
	opacity:1;
}


/*===== menu_panel */
.menu_panel_trigger{
	position:absolute; z-index:5; top:7px; right:10px;
	width:30px; height:30px;
	background:#fff;
	border:1px solid #ccc;
	border-radius:3px;
}
.menu_panel_trigger:before{
	position:absolute; z-index:3; top:50%; left:50%; content:"";
	width:10px; height:10px;
	margin-top:-6px; margin-left:-5px;
	
	border-width:0 2px 2px 0;
	border-style:solid solid solid solid;
	border-color:transparent #333 #333 transparent;
	
	transform:rotate(45deg);
	transition: margin-top 0.4s,
				transform 0.4s;
}
.menu_panel_trigger.is-open:before{
	margin-top:-2px;
	transform:rotate(225deg);
	transition: margin-top 0.4s,
				transform 0.4s;
}
@media (min-width:992px){
	.menu_panel_trigger{
		display:none;
	}
}

.menu_panel{
	position:absolute; z-index:2; top:0; left:0;
	width:100%; height:auto;
	background:#fff;
	padding:0 10px;
	
	box-shadow: 0 3px 10px 0 rgb(108 108 108 / 10%);
	
	opacity:0;
	pointer-events:none;
	visibility:hidden;
	transform:translateY(-5px);
 
	/* transition: opacity 0.3s, 
				visibility 0.3s,
				transform 0.3s; */
}
.menu_panel.is-open{
	opacity:1;
	pointer-events:auto;
	visibility:visible;
	transform:translateY(0);
	
	transition: opacity 0.7s, 
				visibility 0.7s,
				transform 0.7s;
}
@media (min-width:992px){
	.menu_panel{
		display:block;
		position:relative; top:auto; left:auto;
		padding:0;
		box-shadow:none;
		
		opacity:1;
		pointer-events:auto;
		visibility:visible;
		transform:translateY(0);
	}
}
.menu_panel_header{
	border-bottom:1px solid #ccc;
	color: #333;
	padding:10px 5px;
}
@media (min-width:992px){
	.menu_panel_header{
		display:none;
	}
}

.menu{
	display:flex; flex-wrap:wrap;
	align-items:center;
}
.menu > li{
	width:25%;
}
.menu > li a{
	position:relative;
	display:block;
	border-bottom:1px solid #ccc;
	font-weight:600;
	color: #333;
	padding:14px 5px;
	text-align:center;
	
	transition:transform 0.6s ease-in-out;
}
.menu > li a:hover{
	color: var(--color-two);
}
.menu > li.active a{
	color: red;
	cursor:default;
}
@media (min-width:992px){
	.menu li{
		width:10%;
	}
	.menu > li a:before {
		position: absolute; bottom: 0; left: 0; content: "";
		width: 0; height: 3px;
		margin-top: -10px;
		background: var(--color-two);
		
		-webkit-transition: width 0.3s ease;
		transition: width 0.3s ease;
	}
	.menu > li a:hover:before {
		width: 100%;
	}
	.menu > li.active a:before {
		width:0;
	}
	.menu li a{
		border-bottom-width:0;
		font-size:1rem; 
		padding:5px 5px;
		margin:5px 0;
	}
	
}
@media (min-width:1450px){
	.menu li a{
		font-size:1.25rem; 
	}
}







/*------------------------------------------------------------------------------------------- */
/*---- #language 語系-列表式 */
.language_list{
	display:flex; flex-wrap:wrap;
	align-items:center;
	justify-content:center;
	padding:0.8rem 0;
}
.language_list > li{
	border-right:1px solid #ccc;
}
.language_list > li:last-child{
	border-right-width:0;
}


.language_list li a{ 
	font-size:0.875rem; font-weight:600;
	color:#333;
	padding:4px 10px;
}
.language_list li a:hover{
	color:red;
}
.language_list li a.active{
	/*background:#fff;*/
	color:#000;
	cursor:default;
}






/*------------------------------------------------------------------------------------------- */
/*---- #navbar_offside_func */
.navbar_offside_func li{
	width:50%;
	/*border-bottom:1px solid #ccc;*/
}
/*.navbar_offside_func li:first-child{
	border-top:1px solid #ccc;
}*/
.navbar_offside_func .subfunc a{
	padding:10px 5px;
}
.navbar_offside_func .subfunc .iconsvg{
	width:24px; height:24px;
}





/*------------------------------------------------------------------------------------------- */
/*---- #offside：小螢幕-選單 */
.offside{
	position:fixed; z-index:1000; top:0; left:0;
	width:100%; height:100vh;
	
	overflow:hidden;
	
	opacity:0;
	pointer-events:none;
	visibility:hidden;

	transform:translateX(200px);
	
	transition:opacity 0s, 
			   visibility 0s,
			   transform 0.2s;
}
.offside.is-open{ 
	opacity:1;
	pointer-events:auto;
	visibility:visible;

	transform:translateX(0);
	
	transition: opacity 0.7s, 
				visibility 1s,
				transform 0.4s;
}

@media (min-width:992px){
	.offside{ display:none; }
}
.offside_inner{
	width:calc( 100% - 90px ); height:100vh;

	background:#fff;
	
	margin-left:auto;
	padding-bottom:90px;
	
	box-shadow: -5px 0 4px rgba(0, 0, 0, 0.24);
	
	overflow-y:auto;
	overflow-x:hidden;
}


.offside_header{
    position: relative;
	padding:1rem 1rem 0 1rem;
	background:#eee;
}

.offside_body,
.offside_footer{
	padding:10px 1rem;
	/*margin-top:2rem;*/
}

.offside_footer{
	/*border-top:2px solid #ccc;*/
	/*padding-top:1rem;*/
	margin-top:1rem;
}

.offside_header .language_list{
	/*border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;*/
	margin-top:1rem;
}

.offside_footer .navbar_offside_func li{
	padding:0 5px;
}





/*------------------------------------------------------------------------------------------- */
/*---- #menu_offside 側邊區塊選單 */
.menu_offside{}

.menu_offside li{
	border-width: 0 0 1px 0;
	border-style:solid;
	border-color:rgba(0,0,0,0.2);
}
.menu_offside li a{
	position:relative;
	display:block;
	
	color:#333;
	
	font-size:1rem; 
	padding:0.9rem 80px 0.9rem 10px;
	text-decoration:none;
}

.menu_offside .menu-subtext{
	display:none;
}

/* ===== menu_offside [at 第一層] ===== */
.menu_offside > li{
	/*border-color:rgba(255,255,255,0.2);*/
}
.menu_offside > li > a{
	font-size:1.1rem; font-weight:600;
}
/*.menu_offside > li:last-child{
	border-bottom-width:0;
}*/
/*.menu_offside > li > a{
	color:#fff;
}*/


/* ===== menu_offside [is 打開下層選單之提醒] ===== */
.menu_offside li a:before{
	position:absolute; top:50%; left:-5px; content:"";
	width:6px; height:6px;
	margin-top:-3px;
	
	background:red;
	
	border-radius:2px;
	transform:rotate(45deg);
	opacity:0;
}
.menu_offside li a.is-current{
	background:#fff;
	
	color:red;
}
.menu_offside li a.is-current:before{
	opacity:1;
}


/* ===== menu_offside menu-subbtn  [is 有下層之提示圖樣] ===== */
.menu-subbtn{
	display:block;
	position:absolute; z-index:1; top:0; right:0;
	width:50px; height:100%;
	border-left:1px solid rgba(0,0,0,0.1);
	cursor:pointer;
}
.menu-subbtn:before,
.menu-subbtn:after{
    position:absolute; z-index:2; right:50%; top:50%; content:"";
	width:2px; height:10px;
    margin-right:-1px; margin-top:-5px;
	background:#333;
	border-radius:2px;
	outline:0;
	transform-origin:center;
	transition:transform 0.4s ease-in-out;
}
.menu-subbtn:before{ transform:rotate(90deg); }


/* ===== menu_offside [is 有下層之提示圖樣- 第一層] ===== */
/*.menu_offside > li > a .menu-subbtn{
	border-left-color:rgba(255,255,255,0.2);
}*/
.menu_offside > li > a .menu-subbtn:before,
.menu_offside > li > a .menu-subbtn:after{
	background:#666;
}

.menu_offside > li > a .menu-subbtn.is-open{
	border-left-color:rgba(0,0,0,0.2);
}
.menu_offside > li > a .menu-subbtn.is-open:before,
.menu_offside > li > a .menu-subbtn.is-open:after,
.menu-subbtn.is-open:before,
.menu-subbtn.is-open:after{
	background:red;
}
.menu-subbtn.is-open:before{ transform:rotate(45deg); }
.menu-subbtn.is-open:after{ transform:rotate(-45deg); }	


/* ===== menu_offside [is 第二層之後的層級收縮] ===== */
.menu_offside ul{
	display:none;
	position:relative; top:0; left:0;
	width:100%;
	border-top:1px solid rgba(0,0,0,0.2);
	padding-left:15px;
	background:#fff;
}
.menu_offside ul.is-visible{ display:block; }

.menu_offside ul li:last-child{
	border-bottom-width:0;
}






/*------------------------------------------------------------------------------------------- */
/*----- #offside_close：側邊隱藏區塊-關閉鈕 */
.offside_close{
	position:fixed; z-index:1102; top:0; left:0;
	
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content:center;
	
	width:90px; height:100%;
	
	/*取消連結的醒目點選標示*/
	-webkit-tap-highlight-color: transparent;
}
.offside_close .sign_close{
	margin:0 auto 4px auto;
}
.offside_close .sign_close:before ,
.offside_close .sign_close:after{
	background:#fff;
}
.offside_close-text{
	width:100%;
	color:#fff;
	font-size:0.875rem; font-weight:600; letter-spacing:3px;
	margin-left:3px;
	text-align:center;
}















/* ======================================
	08. 頁尾footer設定
=================================================================================================================== */

.footer{ margin-top:45px; }

.footer-top-area{ background:#EEEEEE; padding:20px 0; }
.footer-bottom-area{ background:#333333; padding:12px 0; }



.social-list{
	display:flex; flex-wrap:wrap; justify-content:center;
	margin:30px 0 30px 0;
}
.social-list li{  margin:0px 10px; }
.social-list li a{  display:block; } 
.social-list .iconsvg{
	width:30px; height:30px;
}
.social-list .iconsvg:before{
	background-color:var(--color-three);
}
.social-list li a:hover .iconsvg:before{
	background-color:var(--color-accent);
}


.footer-info-list{ margin:10px 0; text-align:center; }
.footer-info-list li{
	display:flex; flex-wrap:wrap;
	align-items:center; justify-content:center;
}
.footer-inofo{
	display:block; vertical-align:middle;
	font-size:17px; font-weight:600;
	margin:4px 10px;
}

.rssbox{
	display:flex; flex-wrap:wrap;
	align-items:center;
}
.rssbox span{
	display:block;
	font-weight:600;
	margin:1px;
}
.rssbox span img{
	display:block; max-width:100%; height:auto;
}



@media (min-width:992px){
	.footer-bt-flex{  display:flex; flex-wrap:wrap; align-items:center; }
	.footer-bt-flex > .flex-left{ width:50%; }
	.footer-bt-flex > .flex-right{ width:50%; }
}

.people-count{
	text-align:center;
	margin:5px 0;
}
@media (min-width:992px){
	.people-count{
		text-align:left;
		margin:0;
	}
}
.people-count span{ display:inline-block; vertical-align:middle; }
.people-count span img{ display:block; }



.web-designer{
	font-size:14px;
	text-align:center;
	margin:5px 0;
}
@media (min-width:992px){
	.web-designer{
		text-align:right;
		margin:0;
	}
}
.web-designer , .web-designer a{ color:#fff; }
.web-designer a:hover{ color:#C21E02; }







/*------------------------------------------------------------------------------------------- #slickbase */
/*---- #slickbase 輪播基礎 */

/* ===== slickbase [base]：為解決因圖片過多，load時會出現圖片爆框問題 ===== */
.slickbase{
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease;
    -webkit-transition: opacity 1s ease;
}

.slickbase.finally-loaded {
    visibility: visible;
    opacity: 1;
    transition: opacity 1s ease;
    -webkit-transition: opacity 1s ease;
}


.slickbase{
	opacity:0;
	visibility:hidden;
	transition:opacity 1s ease-in-out;
	-webkit-transition:opacity 1s ease-in-out;
}
.slickbase.slick-initialized{ visibility:visible; opacity:1; }




/* ===== slickbase [is slick 項目] ===== */
.slickbase{ overflow:hidden; }
.slickbase .slick-slide{
	position:relative;
	overflow:hidden;
}


/* ===== slickarrow [base]：slick 基礎設定-底下圓圈 ===== */
.slickarrow .slick-prev, 
.slickarrow .slick-next{
	position:absolute; z-index:11; top:0;
	display:block;
	width:50px; height:100%;
	background:rgba(255,255,255,0.1);
	border:none;
	color:transparent;
	font-size:0;
	cursor:pointer;
	transition:opacity 0.7s ease , transform 0.7s ease;
}
.slickarrow .slick-prev{ left:0; transform:translateX(-70px); }
.slickarrow .slick-next{ right:0; transform:translateX(70px); }

.slickarrow .slick-prev:before, 
.slickarrow .slick-next:before{
	position:absolute; top:50%; left:50%; content:"";
	width:10px; height:10px;
	border:4px solid #fff;
	margin-top:-6px; margin-left:-6px;
	transform:rotate(45deg);
}
.slickarrow .slick-prev:before{ border-top-width:0; border-right-width:0; }
.slickarrow .slick-next:before{ border-left-width:0; border-bottom-width:0; }

.slickarrow:hover .slick-prev, 
.slickarrow:hover .slick-next{
	transform:translateX(0);
}
.slickarrow:hover .slick-prev:hover, 
.slickarrow:hover .slick-next:hover{
	background:rgba(255,255,255,0.5);
}
.slickarrow:hover .slick-prev:hover:before, 
.slickarrow:hover .slick-next:hover:before{
	border-color:var(--color-accent);
}



/* ===== slickdots [base]：slick 基礎設定-底下圓圈 ===== */
.slickdots .slick-dots{
	position:absolute; z-index:3; bottom:5px; left:0; 
	display:flex; flex-wrap:wrap; justify-content:center;
	width:100%;
	background:transparent;
	padding:5px;
}
.slickdots .slick-dots li{
	font-size:0;
	margin:0 4px;
}
.slickdots .slick-dots li button{
	width:10px;
	height:10px;
	background:transparent;
	border:2px solid #fff;
	border-radius:50%;
	font-size:0;
	cursor:pointer;
}
.slickdots .slick-dots li button:hover{
	background:var(--color-accent);
}
.slickdots .slick-dots li.slick-active button{
	background:#fff;
	
	opacity:1;
}



.slide-banner{
	margin-bottom:3rem;
}
.slide-banner .item-fitimg:before{
    padding-bottom: 60%;
}
.slide-banner .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}



.banner-text{
	position:absolute; z-index:5; bottom:0; left:0;
	width:100%;
	font-size:20px; font-weight:600;
	color:rgba(255,255,255,0.6);
	padding:20px 15px 30px 15px;
	
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
@media (min-width:640px){
	.banner-text{
		font-size:20px;
	}
}

.banner-text:before{
	position:absolute; z-index:-1; bottom:0; left:0; content:"";
    width:100%; height:100%;
  
    background:linear-gradient(top,transparent , rgba(0,0,0,1) );
    background:-moz-linear-gradient(top,transparent , rgba(0,0,0,1) );
    background:-webkit-linear-gradient(top,transparent , rgba(0,0,0,1) );
    background:-o-linear-gradient(top,transparent , rgba(0,0,0,1) );
    background:-ms-linear-gradient(top,transparent , rgba(0,0,0,1) );
}


.slide-banner a:hover .banner-text{ color:rgba(255,255,255,1);}








/* ======================================
	10. 全頁面共同設定
=================================================================================================================== */

/*全頁左右分隔*/
@media (min-width:992px){
	.page-row{
		display:flex; flex-wrap:wrap;
	}
	.page-row > .page-left{
		flex:1 1 auto;
		width:1%; min-width:0;
	}
	.page-row > .page-right{
		width:300px;
		margin-left:45px;
	}
}

@media (min-width:768px){
	.inner-row{
		display:flex; flex-wrap:wrap;
	}
	.inner-row > .inner-left{
		flex:1 1 auto;
		width:1%; min-width:0;
	}
	.inner-row > .inner-right{
		width:350px;
		margin-left:30px;
	}
}



.main{ margin:2rem 0; }


/*側邊攔-廣告*/
.ad-list{ /* max-width:300px; margin:0 auto; */ }
/*.ad-list.two-cols-list > li{ width:100%; }*/

/*.ad-list > li{ margin-bottom:15px; }*/

.ad-list{
	margin-top:-10px;
}
.ad-list > li{
	margin-top:10px;
}


.ad-photo .photo{
	margin-bottom:5px;
	border:1px solid #eee;
}

.ad-photo .item-fitimg:before{
	display:none;
}
.ad-photo .fitimg{
	display:block;
	position: relative; top:auto; left:auto;
	width: 100%;
	height: auto;

}



.ad-video{
    position:relative;
    width:100%; height:0;
    padding-bottom:70%;
}
.ad-video iframe {
    position:absolute; top:0; left:0;
    width:100%; height:100%;
}


.page-headline-flex{
	border-bottom:1px solid #ccc;
	margin-bottom:30px;
	padding-bottom:5px;
}
@media (min-width:992px){
	.page-headline-flex{
		display:flex; flex-wrap:wrap;
		align-items:center;
		padding-bottom:15px;
	}
	.page-headline-flex .flex-left{ width:50%; }
	.page-headline-flex .flex-right{ width:50%; }
}



/*內頁-大標基本設定*/
.page-headline-bar{ }

.category-heading{ margin-bottom:20px; }
.category-heading .title{
	display:inline-block; vertical-align:middle;
	font-size:1.5rem; font-weight:600;
	color:var(--color-three);
}

.page-headline-bar .category-heading{ margin-bottom:0; }


.heading-linkbtn{
	display:inline-block;
	vertical-align:middle;
	background:var(--color-two);
	border-radius:3px;
	color:#fff;
	font-size:0.875rem; font-weight:600;
	padding:0.1rem 0.3rem;
	margin-left:1rem;
}
.heading-linkbtn:hover{
	background:var(--color-accent);
	color:#fff;
}




/*導覽路徑*/
.breadcrumbs{ text-align:right; margin:5px 0 5px 0; }
.breadcrumbs , .breadcrumbs a{ color:#666; line-height:1.4; }
.breadcrumbs a:hover{ color:#C21E02; }
.breadcrumbs span{ position:relative; margin:0 2px; font-size:14px; }
.breadcrumbs span:last-child{ font-weight:600; color:#000; }

.breadcrumbs span:before{ content:"/"; margin-right:5px; font-size:0.8em; font-weight:100; color:#666; }
.breadcrumbs span:first-child:before{ display:none; }




/*編輯器區塊*/
.editor{ color:#333; /*margin:10px 0;*/ }
/*.editor img{ max-width:100%; height:auto; }
.editor iframe{ max-width:100%;}*/




.view-heading{ margin-bottom:30px; }
.view-heading .title{ font-size:30px; color:#000; font-weight:600; line-height:1.3; }





/*------------------------------------------------------------------------------------------- #marquee */
/*---- #marquee */
.marqueebar{
	position:relative; z-index:3;
	margin:0.5rem 0 0 0;
}
.marquee_inner{
	position:relative;
	overflow:hidden;
}

.marquee_main{
	margin-left:40px;
}

.marquee-tag{
	position:absolute; top:5px; left:0;
}
.marquee-tag_desktop{ display:none; }
.marquee-tag_mobile{ display:block; }
@media (min-width:992px){
	.marqueebar{
		margin-top:1rem;
	}
	.marquee_main{
		margin-left:110px;
	}

	.marquee-tag{
		position:absolute; top:5px; left:0;
	}
	.marquee-tag_desktop{ display:block; }
	.marquee-tag_mobile{ display:none; }
}

.marquee-tag_desktop{
	width:100px;
	height:34px;
	background:url(../images/web-06.png) no-repeat center;
	background-size:contain;
	color:#fff;
	padding:4px 0 4px 10px;
	font-size:16px;
	font-weight:600;
}

.marquee-tag_mobile{
	width:30px; height:30px;
	background:#d64937;
	border-radius:50%;
	margin-top:3px;
}
.marquee-tag_mobile .iconsvg:before{
	background-color:#fff;
	
	-webkit-mask-size:80% 80%;
    mask-size:80% 80%;
}


.marquee-slide{
	height:38px;
	overflow:hidden;
}

.marquee-slide li{ margin:5px 0; }

.marquee{}

.marquee a{
	display:block;
	color:#d64937;
}
.marquee-text{
	display:block;
	font-size:1.125rem; font-weight:600;
	line-height:36px;
	
	overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.marquee a:hover{
	color:#0A6C90;
}
@media (min-width:992px){
	.marquee-text{
		font-size:1.25rem;
	}
}






/*------------------------------------------------------------------------------------------- #category-area */
/*---- #category 分類 */
.category_box{
	position:relative;
	display:none;
	margin:0.5rem 0;
}

@media (min-width:992px){
	.category_box{
		display:block;
	}
	.page-headline-flex + .category_box{ margin-top:-1rem; margin-bottom:2rem; }
}

.category_list{
	text-align:center;
}
.category_list li{
	display:inline-block;
	text-align:center;
	margin:0.5rem 4px;
}
.category_list li a{
	position:relative;
	display:block;
	color:#333;
	font-size:1.125rem; font-weight:600;
	padding:0.5rem 1rem;
	text-align:center;
}
.category_list li a:before{
	position:absolute; top:50%; left:-7px; content:"";
	width:2px; height:12px;
	margin-top:-6px;
	background:#666;
}
.category_list li:last-child a:after{
	position:absolute; top:50%; right:-7px; content:"";
	width:2px; height:12px;
	margin-top:-6px;
	background:#666;
}

.category_list li a:hover{
	color:red;
}
.category_list li.active a{
	color:red;
}







/*影片*/
.video{ position:relative; text-align:center; margin:30px 0; }
.video iframe{ max-width:100%;}


/*詳細頁-下載列*/
.downfile-link-bar{ text-align:center; }
.downfile-link-bar .downfile-btn{ border:1px solid #6E4414; border-radius:18px; }
.downfile-link-bar .downfile-btn a{ display:inline-block; padding:5px 12px; }

.downfile-link-bar .downfile-btn:hover{ border-color:#9A1E23; }




/*返回按鈕列*/
.pageback-line{ }
.navigation-btn{
	display:inline-block;
	padding:8px 3px;
	line-height:1;
	transition:transform 0.2s ease;
	font-size:14px;
}
.navigation-btn .icon , .navigation-btn .title{ display:inline-block; vertical-align:middle; line-height:1; margin:0 2px; }
.navigation-btn .icon{
	width:24px;
	height:24px;
	padding:3px;
	border-radius:50%;
	background:#666;
	overflow:hidden;
}
.navigation-btn .icon img{ display:block; max-width:100%; height:auto; }
.navigation-btn .title{ color:#666; font-weight:600; font-size:16px; }
.navigation-btn:hover .icon{ background:#0A6C90; }
.navigation-btn:hover .title{ color:#0A6C90; } 




/*詳細頁-最後一列-回表列*/
.last-widget-navigation{ padding-top:15px; margin-top:40px; border-top:1px solid #ccc; }
.widget-navigation-flex{ display:flex; flex-wrap:wrap; align-items:center; }
.widget-navigation-flex .flex-left{ width:50%; }
.widget-navigation-flex .flex-right{ width:50%; }


.last-widget-navigation .download-line{ text-align:right; }










/* ======================================
	11. 首頁
=================================================================================================================== */

/*影音新聞*/
.tabContent > div { display:none; }

.tabContent .active { display:block; }

.video-tab{
	margin-bottom:40px;
	max-width:768px;
}
.video-tab .tabHeader{
	margin-top:10px;
}
.video-tab .tabContent{
}

.tabHeader{
	display:none;
}
@media (min-width:992px){
	.tabHeader{
		display:block;
	}
}
.tabHeader ul{
	display:flex;
	flex-wrap:wrap;
	margin-left:-5px;
	margin-right:-5px;
}
.tabHeader ul li{
	width:33.3333333333%;
	padding-right:5px;
	padding-left:5px;
}



/* 影片選取項目 */
.card-video-select{
	cursor:pointer;
}

.card-video-select .card-photo .item-fitimg:before{
	padding-bottom:50%;
}
.card-video-select .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}


.card-video-select .card-name{
	font-size:14px; font-weight:100;
	margin-top:5px;

	/*限2行*/
	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	white-space:normal;
}

.card-video-select:hover .card-name{ color:#0A6C90 }



/* 影片show項目 */
.card-video-show{
	background:#000;
}
.card-video-show .card-video{
	position:relative;
    width:100%; height:0;
	padding-bottom:55%;
}
.card-video-show .card-video iframe{
    position:absolute; top:0; left:0;
    width:100%; height:100%;
	margin:0;
	border:0;
}

.card-video-show .card-name{
	position:relative;
	/*background:#000;*/
	color:#fff;
	padding:15px;
	padding-left:70px;
	
	/*限單行*/
	overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.card-video-show .card-name:before{
	position:absolute; z-index:1; top:50%; left:15px; content:"";
	width:10px; height:10px;
	margin-top:-5px;
	border-width:1px 1px 0 0;
	border-style:solid;
	border-color:#fff;
	transform:rotate(45deg);
}
.card-video-show .card-name:after{
	position:absolute; z-index:1; top:0; left:50px; content:"";
	width:1px; height:100%;
	background:rgba(255,255,255,0.3);
}











.news_wrap,
.subnews_wrap{
	margin-bottom:40px;
}

.newsbox,
.subnewsbox{
	min-height:200px;
	border:1px solid #ccc;
}

.newsbox-inner{
	padding:20px;
}

.newsbox-top{
	margin-bottom:1.5rem;
}

/*.news-area.people{ margin-bottom:10px; }

.news-inner{
	min-height:200px;
	border:1px solid #ccc;
}*/







/*.category-heading.mark{ margin-bottom:30px; }
.category-heading.mark .title{ border-bottom:2px solid #e30808; }*/

.idx-heading-bar{ margin-bottom:20px; }

@media (min-width:992px){
	.idx-heading-flex{ display:flex; flex-wrap:wrap; align-items:center; }
	.idx-heading-flex > .flex-left{ width:50%; }
	.idx-heading-flex > .flex-right{ width:50%; }
}

.idx-heading-flex .category-heading{ margin-bottom:0; }



.idx-morebar{ position:relative; text-align:right; margin-top:10px; }
.idx-morebar:before{
	position:absolute; z-index:0; top:50%; left:0;
	width:100%; height:1px;
	content:"";
	background:#999;
}

.btn-idx-more{
	position:relative; z-index:5;
	display:inline-block; background:#fff;
	padding:5px;
}
.btn-idx-more a{
	display:flex; flex-wrap:wrap;
	align-items:center;
	line-height:1; padding:5px;
}
.btn-idx-more a .text{
	display:block;
	margin:0 1px;
	line-height:1;
	color:var(--color-two);
	font-size:16px;
	font-weight:600;
}
.btn-idx-more .iconsvg{
	width:14px; height:14px;
	margin-left:2px;
}
.btn-idx-more .iconsvg:before{
	background-color:var(--color-two);
}


.btn-idx-more a:hover .text{
	color:var(--color-one);
}
.btn-idx-more a:hover .iconsvg:before{
	background-color:var(--color-one);
}







.shadow-post-item{ position:relative; }
.shadow-post-item a{ display:block; }

.shadow-post-item .photo .item-fitimg:before{
	padding-bottom:70%;
}
.shadow-post-item .photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}


.shadow-post-item .name{ position:absolute; bottom:0; left:0; width:100%; }
.shadow-post-item .name:before{
	position:absolute;
	z-index:0;
	bottom:0;
	left:0;
	width:100%;
	height:100px;
	content:"";
	background:linear-gradient(top,transparent , rgba(0,0,0,1) );
	background:-moz-linear-gradient(top,transparent , rgba(0,0,0,1) );
	background:-webkit-linear-gradient(top,transparent , rgba(0,0,0,1) );
	background:-o-linear-gradient(top,transparent , rgba(0,0,0,1) );
	background:-ms-linear-gradient(top,transparent , rgba(0,0,0,1) );
}
.shadow-post-item .name .title{
	position:relative;
	z-index:2;
	display:block;
	color:#fff;
	padding:15px;
	font-size:1.125rem;
	font-weight:600;
	opacity:0.9;
	
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.shadow-post-item .name.small .title{ font-size:1rem; padding:7px; }
.shadow-post-item a:hover .name .title{ opacity:1; }

@media (min-width:992px){
	.shadow-post-item .name .title{
		font-size:1.25rem;
	}
}



.post-rank-list{}
.post-rank-list li{ position:relative; border-bottom:1px solid #ccc; padding-left:22px; }
.post-rank-list li:last-child{ border-bottom-width:0px; }
.post-rank-list li:before{
	position:absolute;
	top:50%;
	left:13px;
	width:6px;
	height:6px;
	content:"";
	margin-top:-3px;
	background:#333;
	border-radius:50%;
}
.post-rank-list li a{
	display:block;
	padding:10px 5px;
	color:#333;
	font-size:1rem; font-weight:600;
	
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.post-rank-list li a:hover{ color:#0A6C90; }




.article-item{ /*padding:5px 10px;*/ }

.article-flex > .flex-left{ margin-bottom:10px; }
@media (min-width:992px){
	.article-flex{
		display:flex; flex-wrap:wrap;
		align-items:center;
	}
	.article-flex > .flex-left{
		width:30%;
		margin-right:15px; margin-bottom:0;
	}
	.article-flex > .flex-right{
		width:calc( 100% - 30% - 15px);
	}
}

.article-item .photo{
	margin-bottom:0.5rem;
}
.article-item .photo .item-fitimg:before{
	padding-bottom:70%;
}
.article-item .photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}

.date-time{
	display:flex; flex-wrap:wrap;
	align-items:center;
}
.date-time .iconsvg{
	width:15px; height:15px;
	margin-right:2px;
}
.date-time .iconsvg:before{ background-color:#666; }
.date-time .title{
	display:inline-block; vertical-align:middle;
	font-size:13px; line-height:1;
	color:#666;
	margin-right:3px;
}


.article-item .date-time{
	justify-content:flex-end;
	margin-bottom:8px;
}



.article-item .name{ margin-bottom:5px; }
.article-item .name .title{
	display:block;
	color:#333;
	font-weight:600;
	font-size:1.25rem;
	line-height:1.4;	
	/*overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;*/
	max-height:53px;
	overflow:hidden;
}
.article-item .name a:hover .title{ color:#0A6C90; }

.article-item .editor{
	font-size:14px;
	color:#666;
	height:40px;
	overflow:hidden;
}


.article-item .name.all{ margin-bottom:10px; }
.article-item .name.all .title{
	/*overflow:visible;
	text-overflow:clip;
	white-space:normal;*/
	/*font-weight:100;*/
	max-height:53px;
	overflow:hidden;
}
.page-article-list .article-item .photo{ margin-bottom:15px; }
/*.news-list .article-item .photo{ margin-bottom:15px; }*/


.article-item .editor + .date-time{ margin-top:30px; }



.subnews-list{
	margin-top:-15px;
}
.subnews-list li{
	margin-top:15px;
}
.sub-article-item{ /*padding:5px 10px;*/ }
.sub-article-item .article-flex{ display:flex; flex-wrap:wrap; align-items:center; }
.sub-article-item .article-flex > .flex-left{ width:50px; margin-right:15px; }
.sub-article-item .article-flex > .flex-right{ width:calc( 100% - 50px - 15px); }

.sub-article-item .photo{ border-radius:50%; overflow:hidden; }
.sub-article-item .photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}

.sub-article-item .name{ margin-bottom:5px; }
.sub-article-item .name .title{
	display:block;
	height:50px;
	font-size:1rem; font-weight:600;
	overflow:hidden;
}
.sub-article-item .name a:hover .title{ color:#0A6C90;  }




















/* ======================================
	12. 關於我們
=================================================================================================================== */




	
	




/* ======================================
	13. 最新消息
=================================================================================================================== */

/*更多文章區塊*/
.more-article-area{ margin:60px 0; }

.more-heading{
	margin-bottom:45px;
	border-bottom:5px solid #C73119;
}
.more-heading .title{ color:#C73119; font-size:24px; font-weight:600; }



.view-article-item{
}

.view-article-flex{ display:flex; flex-wrap:wrap; }
.view-article-flex .flex-left{
	width:100px;
	margin-right:10px;
	margin-bottom:15px;
}
.view-article-flex .flex-right{
	flex:1 1 auto;
	width:1%; min-width:0;
}


/* 廣告特別設定 */
.view-article-item.adbox-set{
	margin-bottom:1rem;
}
.view-article-item.adbox-set .view-article-flex .flex-left{
	width:100%;
	margin-right:0;
	margin-bottom:15px;
}
.view-article-item.adbox-set .view-article-flex .flex-right{
	width:100%;
	flex:none;
}



@media (min-width:640px){
	.view-article-flex .flex-left{
		width:150px;
		margin-right:30px;
		margin-bottom:0;
	}
}
@media (min-width:768px){
	.view-article-flex .flex-left{ width:200px; }
}

@media (min-width:992px){
	.view-article-flex .flex-left{
		width:100%;
		margin-right:0;
		margin-bottom:5px;
	}
	.view-article-flex .flex-right{
		width:100%;
		flex:none;
	}
}


.view-article-item .item-video {
    position:relative;
    width:100%; height:0;
    padding-bottom:70%;
}
.view-article-item .item-video iframe {
    position:absolute; top:0; left:0;
    width:100%; height:100%;
}

.view-article-item .item-photo{ border:1px solid #ccc; }

.view-article-item .item-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}
.view-article-item .item-photo .item-fitimg:before{
	padding-bottom:70%;
}

.view-article-item .item-name{}
.view-article-item .item-name .title{
	color:#333;
    font-weight:600;
    font-size:1rem;
}
.view-article-item .item-name .title:hover{ color:#0A6C90; }

.view-article-item .item-intro{
	max-height:50px;
	overflow:hidden;
	margin-bottom:15px;
	color:#666;
	font-size:17px;
	
	display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}

.view-article-item .date-time{ line-height:1; margin-top:5px; }
.view-article-item .date-time .icon,
.view-article-item .date-time .title{
	display:inline-block; vertical-align:middle;
	line-height:1;
	margin-right:3px;
}
.view-article-item .date-time .icon{ width:13px; }
.view-article-item .date-time .icon img{ display:block; max-width:100%; height:auto;  }
.view-article-item .date-time .title{ color:#666; font-size:12px; }










/* ======================================
	14. 文章
=================================================================================================================== */




/* ======================================
	15. 相關連結
=================================================================================================================== */
.link-list{ /*position:relative; z-index:6;*/ }

.link-item{ background:#fff; border:1px solid #ccc; /*box-shadow:1px 1px 10px #d9d9d9; */}
.link-item a{ display:block; padding:15px 15px 5px 15px; }

.link-item .name{
	position:relative;
	font-weight:600;
	color:#000;
	margin-top:15px;
	line-height:1.5;
	padding-top:5px;
	
	text-align:center;
	padding-right:0;
	
	min-height:40px;
	max-height:52px;
	overflow:hidden;
	
	transition:padding-right 0.5s ease;
	-webkit-transition:padding-right 0.5s ease;
	-moz-transition:padding-right 0.5s ease;
	-o-transition:padding-right 0.5s ease;
}

.link-item .go-tag{
	display:none;
	position:absolute;
	top:0;
	right:-35px;
	display:block;
	width:32px;
	height:32px;
	text-align:center;
	line-height:32px;
	font-size:12px;
	border-radius:50%;
	background:#C21E02;
	color:#fff;

	transition:right 0.5s ease;
	-webkit-transition:right 0.5s ease;
	-moz-transition:right 0.5s ease;
	-o-transition:right 0.5s ease;
}
.link-item .go-tag:before{
	position:absolute;
	top:50%;
	right:-7px;
	display:block;
	width:0;
	height:0;
	content:"";
	margin-top:-5px;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	border-left:5px solid #C21E02;
}

.link-item a:hover .name{ padding-right:45px; color:#C21E02; }
.link-item a:hover .go-tag{ right:7px; }

@media (min-width:992px){
	.link-item .name{
		text-align:left;
	padding-right:40px;
	}

	.link-item .go-tag{ display:block; }
}

	




/* ======================================
	16. 線上記者名單
=================================================================================================================== */








/*------------------------------------------------------------------------------------------- #form */
/*---- #formbox 表單 */

.formbox{
}

.formset{
	position:relative; z-index:2;
}

.form-describe{
	color:#333;
	font-size:1rem; font-weight:600;
	text-align:right;
	margin-bottom:1rem;
}

.data_required{
	vertical-align:text-top;
	font-size:0.875em;
	color:red;
	
	/*text-shadow:black 0.1em 0.1em 0.2em;*/
}


.formlist{
	display:flex; flex-wrap:wrap;
}
.formlist > li{
	width:100%;
	margin-bottom:1.4rem;
}
.formlist > li:last-child{
	margin-bottom:0;
}


.input_group-left{
	margin-bottom:10px;
}
@media (min-width:992px){
	.input_group{
		display:flex; flex-wrap:wrap;
		/*align-items:center;*/
	}
	.input_group-left{
		padding-top:5px;
		margin-bottom:0;
	}
	.input_group-right{
		position:relative;
		flex:1 1 auto;
		width:1%;
		min-width:0;
	}
	
}


.form-icon,
.form-require,
.form-title{
	display:inline-block; vertical-align:middle;
}
.form-require{
	width:7px;
	margin-right:3px;
}

.form-title{
	position:relative;
	font-size:1rem; font-weight:600;
	color:var(--color-dark);
	padding-right:18px;
	
	/*text-shadow:black 0.1em 0.1em 0.2em;*/
}
@media (min-width:992px){
	.form-title{
		width:120px;
		margin-right:10px;
		
		/*文字左右對齊*/
		text-align:justify;
		text-align-last:justify;
		text-justify:inter-word;
	}
}
.form-title:after{
	position:absolute; top:0; right:0; content:"：";
	color:var(--color-dark);
}

.input_group-text{
	padding:0.375rem 0.2rem;
	font-size:1rem; font-weight:600; line-height:1.5;
	color:#666;
}
@media (min-width:992px){
	.input_group-text{
		padding-top:0.4rem;
	}
}



/*欄位說明文字*/
.form-remind{
	width:1000%;
	color:#fff;
	font-size:0.875rem;
	margin-top:5px;
}


.form-control,
.form-select{
    background-color:#fff;
    border:1px solid #ccc;
	border-radius:3px;
	overflow:hidden;
    /*border-radius:0;*/
}

textarea.form-control{
	border-radius:3px;
}


/*單選按鈕*/
.form-checklist{
	display:flex; flex-wrap:wrap;
	padding-top:6px;
}
.form-checklist li{
	margin-right:1rem;
}
.form-checklist li:last-child{
	margin-right:0;
}
.form-check{
	font-weight:600;
}



/*表單-驗證碼列*/
.form-verifybox{
}
.form-verifybox a{ font-size:0.875rem; font-weight:600; }
.form-verifybox input{
	background-color:#F9F9F9;
    border:1px solid #999;
	border-radius:3px;
	padding:5px;
	overflow:hidden;
}


/*表單-按鈕列*/
.form-btnbar{
	text-align:center;
	margin-top:1rem;
}
.formbtn{
	background:#002D61;
	border:1px solid #fff;
	border-radius:10rem;
	color:#fff;
	font-size:1rem; font-weight:600; line-height:1;
	padding:0.6rem 2rem;
	/*box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);*/
}
.formbtn:hover{
	background:red;
	color:#fff;
	box-shadow:2px 2px 10px rgba(0, 0, 0, 0.5);
}
/*-----  base end =-----*/



/* ===== formbox inquire [in idx & contact]：填表諮詢 ===== */
.formlist_inquire .form-icon{
	display:none;
}

@media (min-width:992px){
	.formlist_inquire > li{
		width:50%;
		padding-left:10px;
	}
	.formlist_inquire .formline_subject,
	.formlist_inquire .formline_message,
	.formlist_inquire .formline_verifycode,
	.formlist_inquire .formline_submit{
		width:100%;
	}
	
	.formlist_inquire .formline_submit{
		padding-left:0;
	}
}






/* ======================================
	18. 聯絡我們
=================================================================================================================== */

.contact-info-list li{
	position:relative;
	margin-bottom:15px;
	line-height:1.3;
	color:#666;
	word-break:break-all;
}
@media (min-width:992px){
	.contact-info-list{ display:flex; flex-wrap:wrap; }
	.contact-info-list li{
		width:50%;
		padding-right:15px;	
	}
}

.contact-info{
	display:flex; flex-wrap:wrap;
	font-size:1rem; font-weight:600;
}
.contact-info .title{
	position:relative; display:block;
	width:100px;
	color:#0A6C90;
	padding-right:15px;
	
	/*文字左右對齊*/
	text-align:justify;
	text-align-last:justify;
	text-justify:inter-word;
}
.contact-info .title:after{
	position:absolute; top:0; right:0; content:"：";
}

.contact-info .editor{
	flex:1 1 auto;
	width:1%; min-width:0;
	
	padding-left:10px;
}









/* ======================================
	19. 熱門活動
=================================================================================================================== */
.activity-box{
	position:relative;
	display:block;
	margin-bottom:15px;
	border:1px solid #ccc;
}

.activity-box .info-flex-bar{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	border-top:1px solid #ccc;
	padding:4px 10px 6px 10px;
}
.activity-box .info-flex-bar li{ width:50%; }

.activity-box .time-note{ display:inline-block; line-height:1; }
.activity-box .time-note span{ display:inline-block; vertical-align:middle; line-height:1; color:#666; font-size:14px; }
.activity-box .time-note span.icon{ margin-right:5px; }
.activity-box .time-note span.icon img{ display:block; max-width:18px; height:auto; }

.activity-box .subname{
	text-align:right;
	color:#999;
	font-size:12px;
	font-weight:600;
	
	/*overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;*/
}

.activity-box .photo{ max-width:350px; margin:0 auto 15px auto; padding:10px; }
.activity-box .photo .item-fitimg:before{
	padding-bottom:70%;
}
.activity-box .photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}



.activity-box .name{ margin:15px 0 10px 0; text-align:center; padding:0 10px; }
.activity-box .name .title{
	display:block;
	color:#333;
	font-weight:600;
	font-size:18px;
	max-height:52px;
	overflow:hidden;
}
.activity-box .name a:hover .title{ color:#0A6C90; }

.activity-info-list{ padding:10px; }
.activity-info-list li{ margin-bottom:10px; }

/*.activity-box .info-item{ font-size:12px; color:#666; line-height:1.5; }*/


.activity-box .info-item_event{
	display:flex; flex-wrap:wrap;
	align-items:flex-start;
	
    font-size:0.75rem; font-weight:600;
	color:#666;
	text-align:left;
}
.activity-box .info-item_event .info-item-title{
	display:block;
	width:40px;
	border:1px solid #ccc;
	border-radius:5px;
	color:rgba(0,0,0, 0.7);
	padding:1px;
	text-align:center;
}
.activity-box .info-item_event .info-item-text{
	display:block;
	flex:1 1 auto;
    width:1%; min-width:0;
	padding:2px 0 3px 3px;
}

.activity-box .day_sat,
.activity-box .day_sun{
	display:inline-block;
	width:20px; height:20px;
	background:rgba(255,255,255,1);
	border-radius:50%;
	font-size:0.75rem; line-height:20px;
	text-align:center;
}
.activity-box .info-item_event .day_sat{
	color:green;
}
.activity-box .info-item_event .day_sun{
	color:red;
}








/* ======================================
	20. 購物商城
=================================================================================================================== */

.store-link-area{
	/* border-bottom:1px solid #ccc; */
	padding:0 20px;
	margin-bottom:75px;
}

.store-link-item{
	border:1px solid #eee; border-radius:15px;
	overflow:hidden;
	transition:transform 0.5s ease , box-shadow 0.5s ease;
}
.store-link-item img{ display:block; max-width:100%; height:auto; }

.store-link-item:hover{ transform:scale(1.1); box-shadow:5px 5px 10px rgba(0,0,0,0.2); }





.store-item{ border:1px solid #ccc; padding:10px; }

.store-item .photo{ /*border:1pc solid #eee;*/ }

.store-item .separate-line{ height:2px; width:40px; background-color:#0A6C90; margin:10px auto; }

.store-item .name{ margin:20px 0 10px 0; text-align:center; padding:0 10px; }
.store-item .name .title{
	display:block;
	color:#333;
	font-weight:600;
	font-size:18px;
	max-height:52px;
	overflow:hidden;
}
.store-item .name a:hover .title{ color:#0A6C90; }



.store-item .slogan-item{ font-size:14px; color:#666; line-height:1.6; text-align:center; }






/* ======================================
	21. 商品
=================================================================================================================== */

.sidebarbox{ margin-bottom:30px; }

/*.product-list.two-cols-list > li{ width:100%; }*/

.product-item{ margin-bottom:10px; }
.product-item .photo{ margin-bottom:5px; border:1px solid #eee; }
.product-item .item-fitimg:before{
	display:none;
}
.product-item .fitimg{
	display:block;
	position: relative; top:auto; left:auto;
	width: 100%;
	height: auto;

}

/* .product-item .photo .item-fitimg:before{
	padding-bottom:70%;
}
.product-item .photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
} */

.product-item .name{ margin-bottom:5px; }
.product-item .name .title{
	display:block;
	color:#333;
	font-weight:600;
	font-size:1rem;
	line-height:1.4;	
	
	/*overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;*/
	
	/*max-height:53px;
	overflow:hidden;*/
}
.product-item .name a:hover .title{ color:#0A6C90; }

.product-item .editor{
	font-size:14px;
	color:#666;
	
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}





























/*###### cmn02-項目*/

/*共同設定*/
.item-card .photobox , .item-card .videobox { background:#f4f4f4; margin-bottom:10px; }
.item-card .photobox a{ display:block; }

/* 項目 影片 */
.item-card .videobox {
    position:relative;
    width:100%; height:0;
    padding-bottom:70%;
}
.item-card .videobox iframe {
    position:absolute; top:0; left:0;
    width:100%; height:100%;
}


.item-card .namebar{ margin:10px 0; line-height:1.5; }
.item-card .namebar .text{
	font-size:18px;
	font-weight:600;
}
.item-card .namebar.limit .text{
	height:82px;
	
	overflow:hidden;
	display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
}

.item-card .namebar a:hover .text{
	color:#0A6C90;
}


/* 項目 資訊 */
.item-card .infometa-list{}
.item-card .infometa-list li{ margin:8px 0; }

.item-card .infometa{ display:flex; flex-wrap:wrap; align-items:center; /*line-height:1.3;*/ margin:3px 0; }
.item-card .infometa .iconfont , .item-card .infometa .text{
	display:block;
	margin:0 1px;
	line-height:1.1;
	color:#999;
	font-size:14px;
}
.item-card .infometa .iconfont{ font-size:15px; }


/* 項目 文字說明 */
.item-card .descripbox{
	max-height:76px;
	font-size:14px;
	color:#666;
	margin-bottom:20px;

	display:-webkit-box;
	text-overflow:ellipsis;
	overflow:hidden;
	
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
	white-space:normal;
}



/*-------------------------------------------------------------------------------------------------------------------------------*/
/*========== module23. 人物介紹 ==========*/

.people-card{ border:1px solid #ccc; }
.people-card .card-inner{ padding:15px; }

.people-card .photobox{ margin-bottom:0; }

.people-card .namebar{ margin-bottom:0; }

.people-card .infometa{ margin:7px 0; }
.people-card .infometa.cate{ justify-content:flex-end; text-align:right; }

.people-card .infometa.slogan{ margin-top:0; margin-bottom:15px; }
.people-card .infometa.slogan .text{
	display:inline-block;
	
	background:#999;
	font-size:14px;
	color:#fff;
	padding:4px 7px;
}

.people-card .infometa.company{ justify-content:flex-end; text-align:right; }
.people-card .infometa.location{ justify-content:flex-end; text-align:right; }










/*-------------------------------------------------------------------------------------------------------------------------------*/
/*========== 地圖新聞 ==========*/
.mapnews-map{ margin-bottom:3rem; }
#map-canvas{
	width:100%;
	min-height:400px;
}

.mapnews-list{
	margin-bottom:6rem;
}

.card-mapnews{
	box-shadow:none;
	border-radius:0;
	padding:0 0.5rem 1rem 0.5rem;
	margin-bottom:1rem;
	border-bottom:1px solid #ccc;
}
.card-mapnews .card-row{
	display:flex;
    flex-wrap:wrap;
	align-items:center;
}
.card-mapnews .card-left{
	width:50px;
}
.card-mapnews .card-center{
	flex:1 1 auto;
	width:1%; min-width:0;
	
	margin:0 1rem;
}
.card-mapnews .card-right{
	width:70px;
}
@media (min-width:992px){
	.card-mapnews .card-left{
		width:70px;
	}
}


.card-mapnews .card-photo{
	border:1px solid #ccc;
	border-radius:50%;
	overflow:hidden;
}
.card-mapnews .card-photo .fitimg{
	-webkit-object-fit: cover;
	   -moz-object-fit: cover;
		    object-fit: cover;
}


.card-mapnews .card-name{
	margin:0.2rem 0;
	font-size:1rem; font-weight:600;
}

/*.card-mapnews .info-location{
	text-align:right;
}*/
.card-mapnews .info-location span{
	display:inline-block; vertical-align:middle;
	margin-right:7px;
	color:#666;
    font-size:0.75rem; font-weight:600;
}


.card-mapnews .card-date-item{
    display:flex; flex-wrap:wrap;
	align-items:center; justify-content:flex-end;
	
	text-align:right;
}
.card-mapnews .card-date-item .card-date{
    display:block;
	color:#999;
    font-size:0.75rem; font-weight:600; /*letter-spacing:2px;*/
	line-height:1;
    padding:3px 0;
}
.card-mapnews .card-date.year{}
.card-mapnews .card-date.year:after{ content:"/"; }

.card-mapnews .card-date.month{}

.card-mapnews .card-date.day{
    width:100%;
	color:#666;
    font-size:1.6rem; font-weight:600;
}







.mapnews-searchbar{
	margin-bottom:3rem;
}
.mapnews-search .form-select{
	width:100%;
	margin:10px 0;
	cursor:pointer;
}

.mapnews-search .mapnews-btn{
	width:100%;
	background:var(--color-one);
	border:1px solid var(--color-one);
	border-radius:0.25rem;
	color:#fff;
	cursor:pointer;
	padding:0.3rem 0.5rem;
	margin:10px 0;
}
.mapnews-search .mapnews-btn:hover{
	background:var(--color-two);
	border-color:var(--color-two);
	color:#fff;
}
@media (min-width:480px){
	.mapnews-searchbar{
		display:flex; flex-wrap:wrap;
		align-items:center; justify-content:center;
	}
	.mapnews-search form{
		display:flex; flex-wrap:wrap;
		align-items:center;
	}
	.mapnews-search .form-select{
		width:200px;
		margin:10px;
	}
	.mapnews-search .mapnews-btn{
		width:100px;
		margin:10px;
	}
}

.mapnews-search .mapnews-link{
	display:block;
	background:var(--color-one);
	border:1px solid var(--color-one);
	border-radius:0.25rem;
	color:#fff;
	cursor:pointer;
	padding:0.3rem 1.5rem;
	margin:10px 0;
}
.mapnews-search .mapnews-link:hover{
	background:var(--color-two);
	border-color:var(--color-two);
	color:#fff;
}







/*------------------------------------------------------------------------------------------- */
/*----- 搜尋 */
/*.searchbar{
}
.searchbar .search{
    display:flex; flex-wrap:wrap;
	align-items:center;
    width:100%;
}

.searchbar .search-input{
	display:block;
	
	flex:1 1 auto;
    width:1%;
    min-width:0;
	
	background-color:#fff;
    border:1px solid #ccc;
	border-radius:3px;
	font-size:0.875rem;
	overflow:hidden;
	padding: 0.375rem 2.25rem 0.375rem 0.75rem;
}

.searchbar .search-btn{
	display:block;
	height:32px;
	border-radius:3px;
	background:#40ABBD;
	border:1px solid #40ABBD;
	color:#fff;
	font-weight:600;
	margin-left:6px;
	padding:0 10px;
}
.searchbar .search-btn:hover{
	background:#EA5259; 
	border-color:#EA5259;
	color:#fff;
	box-shadow:0 1px 2px rgba(0,0,0,0.5);
}



.searchbar .searchbar_select .search{
	justify-content:right;
}
.searchbar .search-select{
	flex:1 1 auto;
    width:1%;
    min-width:0;
	
	max-width:300px;
	cursor:pointer;
}*/



.toolarea{
	margin-bottom: 2rem;
}
.tool-remind{
	font-size:0.875rem; font-weight:600;
	text-align:right;
	margin-bottom:10px;
}

.toolarea-inner{
	background:rgba(255,255,255,0.6);
	border-radius: 5px;
	padding:15px 30px;
}


.tool-link{
	display:block;
	background:var(--color-one);
	border:1px solid var(--color-one);
	border-radius:0.25rem;
	color:#fff;
	cursor:pointer;
	padding:0.3rem 1.5rem;
	margin:10px 0;
	text-align:center;
}
.tool-link:hover{
	background:var(--color-two);
	border-color:var(--color-two);
	color:#fff;
}













