/*2022.03.07*/

/*********************** 影音專區 start ***************************/
.YT{
	margin-bottom: 2.75em;
}
.YT .page-header{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.YT .page-header .arrow{
	font-size: 0.85em;
}
.YT .page-header .arrow span{
	cursor: pointer;
}
.YT .page-header .arrow span:hover{
	color: #fa5a5a;
}
.YT .page-header .arrow span+span{
	margin-left: 0.6em;
}
.YT .slick{
	margin:0;
	padding: 0;
	list-style: none;
}
.YT .slick li{
	position: relative;
}
.YT .slick li:before{
	content:"";
	display: block;
	padding-top:56.25%;
}
.YT .slick li iframe{
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
/*********************** 影音專區 end ***************************/


/*2018.07.06*/

/*總共3種格式.eot/.woff/.ttf*/
@font-face {  /*窄長粗體英文字型*/
 font-family: Swz721bc;
 src: url(../fonts/Swz721bc.eot);
 src: local(Swz721bc), 
        url(../fonts/Swz721bc.woff) format("woff"), 
        url(../fonts/Swz721bc.ttf) format("truetype"), 
        url(../fonts/Swz721bc.svg) format("svg");
}

body {
	margin:0 auto;
	min-width:320px;
	/*padding-top:85px; 配合固定式置頂nav*/
}
body, p, .form-control {
	font-family:微軟正黑體, Arial ;
	font-size:15px;	
    line-height:1.5;
	color:#333;
}
p {
	word-wrap: break-word; /*允許單詞內斷句*/
	word-break: normal; 
	text-align:justify; 
	/*text-justify:inter-ideograph; 用表意文本來排齊內容，效果測起來同inter-word*/
	/*text-justify:inter-word; 增加.減少單詞間的間隔*/
	/*text-justify:distribute; 類似報紙版面，除了在東亞語系中最後一行是不齊行的*/
	/*text-justify:auto; 瀏覽器決定齊行算法*/
	/*text-justify:none; 取消齊頭尾*/
	margin: 0 0 20px;
}

.tc {
	font-size:15px;
	line-height: 1.25;	
	color:#666;
}
ul.tc {
	line-height: 1.4; /*多行*/
}

.enFont {
	font-family: Swz721bc, Arial;
	/*letter-spacing:-0.25px;*/
	font-weight:normal;
}
.enFont1 {
	font-weight:normal; /*取消粗體*/
	letter-spacing:-1px;
}
.en h1 {
	font-size:32px; 
}
.en h5 {
	line-height:1.3;
	font-size: 18px;
	margin-top:10px;
}
.en h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
	text-align: left;
	line-height:1.4;
	margin-bottom:1.5em;
	font-weight:400;
}
.en p {
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
	line-height:1.5;
}
.en .icon-en img {
	margin:40px 0 30px;
}


/*每頁表頭大標*/
.page-header {
    margin:40px 0 40px;
	padding-bottom:10px;
	border-bottom:#000 solid 3px;
}
/*分類項目*/
.page-header ul.item li a.dropdown-toggle {
    font-size:15px;
}
/*分類項目-多個下拉More時*/
.page-header ul.dropdown-menu {
	left: auto;
	right:0;
	margin-top:12px;
}
/*首頁h4表頭大標*/
h4.page-header {
    margin:0 0 20px;
	padding-bottom:10px;
	border-bottom:#000 solid 3px;
}


.h1, .h2, .h3, .h4, .h5, .h6,
h1, h2, h3, h4, h5, h6 {
	margin-top:0;
	margin-bottom:0.75em;
}

h1, .h1 {
	font-size:27px; /*預設值36px*/
	font-weight:normal;
	letter-spacing:-1px;
	line-height: 1.2;
}
.container-fluid h1 {
	font-size:32px; 
}
h2, .h2 {
	font-size:25px; /*預設值30px*/
	font-weight:normal;
}
h3, .h3 {
	font-size:22px; /*預設值24px*/
	line-height: 1.25;
}
h4, .h4 {
	font-size: 20px; /*預設值18px*/
	line-height: 1.3;
}
h5, .h5 {  /*內文大標*/
	font-size: 17.25px; /*預設值14px*/
	line-height: 1.35;
}
h6, .h6 {
	font-size: 16px; /*預設值12px*/
	line-height: 1.25;
}
h6.titlebar {
	font-size: 17.5px; /*預設值12px*/
	line-height: 1.3;
	font-weight: bold;
	border-left:#333 solid 2px;
	padding-left:6px;
}
footer {
	line-height: 1.3;
}

hgroup.caption {
	padding:0 20px; /*內容和邊框的間隔*/
}

blockquote {
    padding: 10px 0 0 20px;
    margin: 0 0 20px;
    font-size: 15px;
	color:#888;
    border-left: 6px solid #eee;
}


/* ==================================================
   主色效果
================================================== */
.gradient-color {  /*漸層色需大字級才明顯*/
	color:#3fbae3; /*漸層色不支援IE時使用這行*/
	background: -webkit-gradient(linear, 100% 0, 0 0, from(#0085a6), to(#3fbae3));
	background: -webkit-linear-gradient(right, #0085a6, #3fbae3);
	background: -moz-linear-gradient(right, #0085a6, #3fbae3);
	background: -o-linear-gradient(right, #0085a6, #3fbae3);
	background: linear-gradient(right, #0085a6, #3fbae3);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;	
}
a {
	color:#000; 
	/*text-decoration: underline;  因為內文上稿不能強制沒底線*/
    text-decoration: none; /*預防就沒有底線才好套用*/
}
a:hover,
a:focus {
	color:#fa5a5a; /*紅色字*/
    text-decoration: none; /*預防就沒有底線才好套用*/
}
a.text-link {
	color:#cda541; /*金黃色*/
	text-decoration: none;
	font-size:17px;
}
a.text-link:hover,
a.text-link:focus {
	color:#fa5a5a; /*紅色字*/
	text-decoration: none;
}

/*ol.list li a,
ul.list li a {
	color:#333;
}
*/
p a {
	color:#cda541; /*金黃色*/
	text-decoration: underline;
}
p a:hover {
	text-decoration: underline;
}
a:hover, 
a:focus {
	text-decoration: none;
}


.mainstyle {
	color:#cda541; /*金黃色*/
}
.substyle {
	color: #00c3c3;  /*碧綠字*/
}
.thirdstyle {
	color:#eb7300;  /*橘色*/
}
.redstyle {
    color:#fa4646; /*紅色字*/
}
.gystyle {
    color: #bababa;  /*灰色*/
}
.bkstyle {
    color:#333 !important ; /*有些受到a連結變色問題*/
}
.colorBar {
	/*background-color: rgba(150,120,70, 0.75);  透明度*/
	background-color:#fa5a5a; /*主色文創紅*/
	color:#FFF;
	text-align:center;
	padding:5px 0;
	margin:20px 0 0;
}
.date {
	font-size: 13.5px;
	color: #bababa; /*灰色字*/
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	letter-spacing:0.25px;
	margin-bottom:10px;
}
mark {
	background-color: #fa5a5a; /*主色文創紅*/
	color:#FFF;
	font-size:12.5px;
	padding:6px 15px;
	display: inline-block;
}
a:hover mark {
	background-color: #ff6e6e; /*主色文創紅加亮*/
}


.lineHR {
	border-right: #ddd solid 1px;
}
.lineR {
	border-right:#ddd solid 1px;
	padding-right:15px;
	margin-right:15px;
}
hr {
    border-color:#ddd ;
	border-top: 1px solid #ddd;
}
hr.less {
    margin:10px 0;
}


/* 嵌套按钮頁數 */
.btn-group.page .active ,
.btn-group.page .active:hover,
.btn-group.page .active:focus {
    color: #fff;
	background-color: #00b4b4;  /*碧綠色*/
}

/* 嵌套按钮頁數 */
.pageselect .input-group-addon {
    /*width: 1%;*/
	width: auto;
}
.pageselect.input-group {
	/*margin:10px auto 40px; 居中*/
	margin:10px 0 40px;
	float: right;
}
.pageselect .form-control {
	color:#fff;
	background-color:#333;
	border-radius: 3px; 
	padding: 6px 20px;
}
.pageselect .input-group-addon {
	font-size: 15px;
	color:#bababa;
	padding: 6px 20px;
	background-color:transparent;
	border-radius: 3px; 
}




/* ==================================================
   footer
================================================== */
#footer {
    color: #fff;
    background-image: url('../images/footer-bg.jpg');
    background-size: cover;
    -webkit-background-size: cover;
	background-position:50% 0%; /*左右 上下*/
    background-repeat: no-repeat;
    font-weight: normal;
}
#footer a {
    color: #fff;
	text-decoration:none;
}
#footer a:hover {
    color: rgba(255,255,255, 0.75);  /*透明度*/
}
#footer a:hover img {
    opacity:0.75;
	filter:alpha(opacity=75);  /* 針對ie使用 */ 
}

#footer .footer-title {
    color: #fc6c6c;
    border-color: #fc6c6c;
}

#footer .footer-description,
#footer .footer-serviceList {
    color: #fff;
}
#footer .footer-bottom {
    color: #fff;
    border-color: #565151;
}

/* Set mobile first style */
#footer {
    padding-bottom: 0;
}
#footer #footer-top {
    padding-top: 50px;
    padding-bottom: 50px;
}
#footer .footer-title {
    margin-bottom: 20px;
    padding-left: 10px;
    font-size: 21px;
    line-height: 20px;
    border-left: 2px solid;
    height: 20px;
}

#footer .footer-description,
#footer .footer-serviceList,
#footer .footer-contactInfo {
    font-size: 15px;
    line-height: 1.65;
}
#footer .footer-serviceList {
    margin-left: -3px;
    margin-right: -3px;
    margin-bottom: 32px;
    /* max-width: 300px; */
}
#footer .footer-serviceList > div[class*=col-] {
    padding-left: 2px;
    padding-right: 2px;
}

#footer .footer-serviceList .serviceList-item > span {
    margin-top: 10px;
    display: block;
    text-align: center;
}
.footer-contactInfo {
    list-style-type: none;
    margin-left: -40px;
}
.footer-contactInfo > li {
    margin-bottom: 4px;
}
#footer .footer-bottom {
    display: block;
    border-top: 1px solid #565151;
    padding: 20px 0;
    font-size: 12px;
    line-height:22px;
}
#footer .footer-sponser-logo {
    margin-top: 15px;
    padding-top: 15px;
}
#footer .footer-sponser-logo .col-xs-4 {
	padding-right: 5px;
    padding-left: 5px;
}

@media (max-width: 767px) {  /*xs*/
    #footer .footer-serviceList {
        padding: 0 15px;
		max-width:245px; /*三個icon總寬*/
    }
}


/* Set media style */
@media(min-width: 768px) {
    #footer .footer-title{
        font-size: 18px;
    }
    #footer #footer-about {
        margin-bottom: 24px;
    }
    #footer .footer-serviceList {
        margin-left: -15px;
        margin-right: -15px;
        margin-bottom: 0;
        padding: 0 15px;
    }
    #footer .footer-sponser-logo {
        border-top: 1px solid #565151;
    }
	#footer .footer-description {
		line-height: 1.5;
	}	
}


@media (min-width: 768px) and (max-width: 991px) {  /*sm*/
    #footer .footer-serviceList {
		padding-right:70px !important;
    }
	#footer .footer-serviceList > div[class*=col-] {
		padding-right:20px;
	}	
}

@media(min-width: 992px) {
    #footer #footer-top{
        padding-bottom: 24px;
    }
    #footer #footer-about{
        margin-bottom: 0;
    }
	#footer .footer-serviceList > div[class*=col-] {
		padding-left:8px;
		padding-right:8px;
	}		
}

@media(min-width: 1200px) {
    #footer #footer-about{
        margin-bottom: 0;
        padding-right: 36px;
    }
   #footer .footer-serviceList{
        padding-right: 35px;
    }
	#footer .footer-serviceList > div[class*=col-] {
		padding-left:5px;
		padding-right:5px;
	}	
}

@media(min-width: 1400px) {
    #footer .footer-serviceList{
        padding-right:45px;
    }	
}



/* ==================================================
   自定效果
================================================== */
xxx.bgGradient {
	background-color:#50c8f0;/*漸層色不支援IE時使用這行*/
	background: -moz-linear-gradient(left, #50c8f0 30%, #32c8b1 75%, #4dc585 100%); 
	background: -webkit-linear-gradient(left, #50c8f0 30%, #32c8b1 75%, #4dc585 100%);
	background: linear-gradient(to right, #50c8f0 30%, #32c8b1 75%, #4dc585 100%); 
	/*background: -webkit-gradient(linear, 100% 0, 0 0, from(#4dc585), to(#32aae1)); 只能二色左至右*/
	background: -o-linear-gradient(left, #50c8f0, #32c8b1, #4dc585);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#50c8f0', endColorstr='#4dc585',GradientType=0 ); 	
}

/*Search使用*/
xxx.bgGradient2 {
	background-color:#50c8f0;/*漸層色不支援IE時使用這行*/
	background: -moz-linear-gradient(left, #00b4b4 30%, #2380a0 100%); 
	background: -webkit-linear-gradient(left, #00b4b4 30%, #2380a0 100%);
	background: linear-gradient(to right, #00b4b4 30%, #2380a0 100%); 
	background: -o-linear-gradient(left, #00b4b4, #2380a0);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b4b4', endColorstr='#2380a0',GradientType=0 ); 	
}


/* ==================================================
   歷屆成果 showroom
================================================== */ 
.showroom {
	margin-bottom:50px;
}
.showroom ul {
	margin-top:20px;
}
.showroom ul li {
	width:175px;
	float:left;
	margin-right:30px;
	margin-bottom:5px;
}
.showroom ul li .imgArea {
	border:#ededed solid 1px;
	box-shadow: 0 1px 1px rgba(0,0,0,.15);
	margin-bottom:13px;
}
.showroom ul li .imgArea img {
	margin:5px auto;
	height:95px;
}
.showroom ul li p {
	line-height:1.25;
}
.showroom ul li a:hover p {
	color:#fa5a5a; /*紅色字*/
}
.showroom ul li a:hover .imgArea {
	box-shadow: 0 1px 6px rgba(0,0,0,.3);
}

@media (max-width: 375px) {  /*xs*/
	.showroom ul li {
		width:125px;
		margin-right:22px;
	}
	.showroom ul li .imgArea img {
		height:75px;
	}
}

@media (min-width: 376px) and (max-width: 767px) {  /*xs*/
	.showroom ul li {
		width:140px;
		margin-right:15px;
	}
	.showroom ul li .imgArea img {
		height:85px;
	}	
}

@media (max-width: 550px) {  /*xs*/
	.nth.showroom ul li:nth-child(2n+1) { /*限變數規定2個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}	
}

@media (min-width: 551px) and (max-width: 991px) {  /*大xs,sm*/
	.nth.showroom ul li:nth-child(3n+1) { /*限變數規定3個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}	
}

@media (min-width:992px) and (max-width:1199px) {  /*md*/
	.showroom ul li {
		width:180px;
		margin-right:30px;
	}
	.nth.showroom ul li:nth-child(4n+1) { /*限變數規定4個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}
}

@media (min-width:1200px) {  /*lg*/
	.nth.showroom ul li:nth-child(5n+1) { /*限變數規定5個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}	
}

@media (min-width:1400px) {  /*lg*/
	.showroom ul li {
		width:190px;
		margin-right:43px;
	}
}


/* ==================================================
   dl dt dd效果
================================================== */
/*特別指定最新消息頁裡*/
.info dl dt.forNews {
	width:100% !important;
	margin:0 0 10px;
	padding-bottom:10px;
	text-align: left;
}

/*活動展會內頁*/
table.info p,
table.info td {
	text-align:left !important;
	margin-bottom:0 !important;
}
table.info th {
	width:35px;
	vertical-align:top;
}
table.info th .glyphicon {
	font-size:23px;
	padding-bottom:15px;
}
table.info th .glyphicon-usd,
table.info th .glyphicon-stop {
	font-size:25px;
	margin-left:-3px;
}
table.info td {
	padding-bottom:15px;
}
table.info td.date  {
	color: #fa5a5a;
	line-height: 1.25;
	font-size:130%;
	font-weight:bold;
	font-family: "微軟正黑體", Arial;
}


/* ==================================================
   大底圖效果
================================================== */
/*電子報*/
.kvPaper {
    background-image: url(../images/kvPaper.jpg);
	background-position:50% 0%; /*左右 上下*/
	background-size: cover;
	box-sizing:border-box;
	padding:2.5em 0;
}
/*最新消息
.kvNews {
    background-image: url(../images/kvNews.jpg);
	background-position:50% 0%;
	background-size: cover;
	box-sizing:border-box;
	padding:2em 0;
}
*/




/* ==================================================
   nth變數換行效果
================================================== */
@media (max-width: 767px) {  /*xs*/
}

@media (min-width: 768px) and (max-width: 991px) {  /*sm*/
	.nth .col-sm-6:nth-child(2n+1) { /*限變數規定2個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}
	.nth1 .col-sm-6:nth-child(2n+1) { /*限變數規定2個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}	
}

@media (min-width:992px) and (max-width:1199px) {  /*md*/
	.nth .col-sm-6:nth-child(2n+1) { /*限變數規定2個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}
	.nth1 .col-sm-6:nth-child(2n+1) { /*限變數規定2個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}	
}

@media (min-width:1200px) {  /*lg*/
	.nth .col-lg-4:nth-child(3n+1) { /*限變數規定3個為組,下一個則重新起頭另排一行*/
	 clear:both;
	}
}



 /* ==================================================
   效果
================================================== */
ol.list li,
ul.list li {
    margin-bottom:3em;
}

/*列表*/
.listArea h5 {
	color: #00c3c3;  /*碧綠字*/
	font-weight:bold;
	margin-top:9px;
    margin-bottom:6px;
}
.listArea a:hover h5 {
	color: #000; 
}
.listArea p {
	margin:3px 0;
	text-align: left;
}
.listArea p mark {
	background-color:#e1e1c8; /*淡底色*/
	font-size:13px;
	padding:0px 5px 2px;
	display: inline-block;
	margin-right:5px;
	letter-spacing:-0.5px;
}
.listArea footer {
	color: #bababa;  /*灰色字*/
	margin-top:3px;
	margin-bottom:5px;
}
.listArea .col-sm-6 {
	margin-bottom:10px;
}




/* ==================================================
   首頁大圖輪播
================================================== */
.carousel-control {
	height:100%; /*解決程式版本左右arrow沒有上下居中bug*/
}
.carousel-control.left .glyphicon {
    left: -15%;
}
.carousel-control.right .glyphicon {
    right: -15%;
}
#carousel-example-captions .glyphicon {
    top: 48% !important;
}

.carousel-control.left .glyphicon,
.carousel-control.right .glyphicon {
    top: 48% !important;
}

@media (min-width: 1200px) {  /*lg*/
	.carousel-control.left .glyphicon {
		left: -30%;
	}
	.carousel-control.right .glyphicon {
		right: -30%;
	}
}


/* ==================================================
   sns 社群分享
================================================== */
ul.sns {
	margin-top:2em;
}
ul.sns>li {
    padding-right: 2px;
    padding-left: 2px;
}
	
a.btn-social,
.btn-social {
    font-size:16px;
	border-radius: 50%;
    color: #ffffff !important;
    display: inline-block !important;
	width:43px;
	height:43px;
    line-height:2.5;
    text-align: center;
    text-decoration: none;
    transition: background-color .3s;
    webkit-transition: background-color .3s;
	background-color: rgba(0,0,0, 0.35);  /*透明度*/
}
.fa-envelope {
    font-size:19px !important;
	line-height:0.4 !important;
}
/*.btn-social .fa,
.btn-social i {
    backface-visibility: hidden;
    moz-backface-visibility: hidden;
    ms-transform: scale(1);
    o-transform: scale(1);
    transform: scale(1);
    webkit-transform: scale(1);
    transition: all .25s;
    webkit-backface-visibility: hidden;
    webkit-transition: all .25s;
}*/
.btn-social:hover,
.btn-social:focus {
    color: #fff;
    outline: none;
    text-decoration: none;
}
/*.btn-social:hover .fa,
.btn-social:focus .fa,
.btn-social:hover i,
.btn-social:focus i {
    ms-transform: scale(0.8);
    o-transform: scale(0.8);
    transform: scale(0.8);
    webkit-transform: scale(0.8);
}*/

 /*line圖*/
.btn-line img {
	width:28px;
	height:auto;
    /*transition: all .15s;
    webkit-transition: all .15s;*/
	margin-bottom:2px;
}
/*.btn-line:hover img {
    ms-transform: scale(0.9);
    o-transform: scale(0.9);
    transform: scale(0.9);
    webkit-transform: scale(0.9);
}*/


/*常用社群icon*/
.btn-facebook:hover {
    background-color: #4c70ba;
}
.btn-twitter:hover {
    background-color: #83c3f3;
}
.btn-google-plus:hover {
    background-color: #e47365;
}
.btn-email:hover {
	background-color: #fa5a5a;
}
.btn-line:hover {
    background-color: #03c302;
}