﻿@charset "utf-8";
.ic_bg{
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;}
	
._blue{ color:#093184}
._red{ color:#be2a5f}	
.sec_box{padding:70px 0; position:relative}	
@media screen and (max-width:990px) {
	.sec_box{padding:60px 0}	
}
@media screen and (max-width:768px) {
	.sec_box{padding:50px 0}	
}
@media screen and (max-width:480px) {
	.sec_box{padding:40px 0}	
}
@media screen and (max-width:380px) {
	.sec_box{padding:30px 0}	
}

.more_b{
	height:46px;
	padding:0 46px 0 26px;
	border-radius:25px;
	line-height:46px;
	color:#fff !important;
	background-color:#169cb2;
	font-size:1.63em;
	font-weight:normal;
	position:absolute;
	left:50%;
	display:inline-block;
	bottom:20px;
	transform:translate(-50%,0)
}	
#news_2 .more_b:hover, #news_2 .more_b:focus, #news_2 a:hover .more_b, #news_2 a:focus .more_b{background-color:#be2a5f}			
.more_b:after{
	content:'+';
    display:block;
    font-size:175%;
    font-weight:100;
    position:absolute;
    line-height:41px;
    top:0;
    right:17px;}	
@media screen and (max-width:990px) {
	.more_b{
		height:30px;
		padding:0 30px 0 15px;
		border-radius:18px;
		line-height:30px;
		font-size:1.4em;
	}
	.more_b:after {
		font-size:150%;
		line-height:25px;
		right:9px;
	}		
}


/*more btn 漸層 color*/	
.more_b.g_1{
	/* Permalink - use to edit and share this gradient:https://colorzilla.com/gradient-editor/#f08d1d+0,f4d653+100 */
	background:rgb(240,141,29); /* Old browsers */
	background:-moz-linear-gradient(left,  rgba(240,141,29,1) 0%, rgba(244,214,83,1) 100%); /* FF3.6-15 */
	background:-webkit-linear-gradient(left,  rgba(240,141,29,1) 0%,rgba(244,214,83,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to right,  rgba(240,141,29,1) 0%,rgba(244,214,83,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f08d1d', endColorstr='#f4d653',GradientType=1 ); /* IE6-9 */
}
.more_b.g_2{
	/* Permalink - use to edit and share this gradient:https://colorzilla.com/gradient-editor/#004fd7+0,2ccee0+100&0.7+0,1+100 */
	background:-moz-linear-gradient(left,  rgba(0,79,215,0.7) 0%, rgba(44,206,224,1) 100%); /* FF3.6-15 */
	background:-webkit-linear-gradient(left,  rgba(0,79,215,0.7) 0%,rgba(44,206,224,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to right,  rgba(0,79,215,0.7) 0%,rgba(44,206,224,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3004fd7', endColorstr='#2ccee0',GradientType=1 ); /* IE6-9 */
}	
.more_b.g_3{
	/* Permalink - use to edit and share this gradient:https://colorzilla.com/gradient-editor/#6dc1be+0,c0d506+100 */
	background:rgb(109,193,190); /* Old browsers */
	background:-moz-linear-gradient(left,  rgba(109,193,190,1) 0%, rgba(192,213,6,1) 100%); /* FF3.6-15 */
	background:-webkit-linear-gradient(left,  rgba(109,193,190,1) 0%,rgba(192,213,6,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to right,  rgba(109,193,190,1) 0%,rgba(192,213,6,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#6dc1be', endColorstr='#c0d506',GradientType=1 ); /* IE6-9 */
	}	
.more_b.g_4{
	/* Permalink - use to edit and share this gradient:https://colorzilla.com/gradient-editor/#aa1c42+0,e95d89+100&0.8+0,0.8+100 */
	background:-moz-linear-gradient(left,  rgba(170,28,66,0.8) 0%, rgba(233,93,137,0.8) 100%); /* FF3.6-15 */
	background:-webkit-linear-gradient(left,  rgba(170,28,66,0.8) 0%,rgba(233,93,137,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to right,  rgba(170,28,66,0.8) 0%,rgba(233,93,137,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccaa1c42', endColorstr='#cce95d89',GradientType=1 ); /* IE6-9 */
}	
	
	
/*分眾導覽*/
dd.eventFileList ul{
	display:block;
	list-style:none;
	display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
dd.eventFileList ul li{
	display:block;
	float:left;
	width:calc(33.33% - 16px);
	box-sizing:border-box;
	margin:8px;
}
dd.eventFileList ul li a{
	display:block;
	color:#666666;
	text-align:center
}	
dd.eventFileList ul li a strong{
	font-size:1.8em;
	font-weight:bold;
	margin:10px 0;
	display:block;
}	
dd.eventFileList ul li a:hover strong,
dd.eventFileList ul li a:focus strong {
	color:#507890;
}		
dd.eventFileList ul li a p{
	font-size:1.4em; display:none;
}			
dd.eventFileList ul li a .ico{
	width:110px;
	height:110px;
	/* Permalink - use to edit and share this gradient:https://colorzilla.com/gradient-editor/#4096ee+0,0a3285+100 */
	background:rgb(64,150,238); /* Old browsers */
	background:-moz-linear-gradient(top,  rgba(64,150,238,1) 0%, rgba(10,50,133,1) 100%); /* FF3.6-15 */
	background:-webkit-linear-gradient(top,  rgba(64,150,238,1) 0%,rgba(10,50,133,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to bottom,  rgba(64,150,238,1) 0%,rgba(10,50,133,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#4096ee', endColorstr='#0a3285',GradientType=0 ); /* IE6-9 */
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
 	border-radius:50%;
	margin:0 auto;
	transition:all 0.4s;
	position:relative;
}	
dd.eventFileList ul li a .ico:after{
	content:'';
	display:block;
	width:100%;
	height:100%;
	background-position:center;
	background-repeat:no-repeat;
	background-size:100%;
	position:absolute;
	z-index:1;
	transition:all 0.4s;
	border-radius:50%;
}		
dd.eventFileList ul li a:hover .ico:after,
dd.eventFileList ul li a:focus .ico:after{
	transform:rotate(-15deg);
 	background-color:#be2a5f !important
}		
dd.eventFileList ul li a .ico:after.no-pic{
	background-image:url(../images/list-nopic-s.jpg);}	
	
dd.eventFileList ul.box_1 li a .ico.ico_1:after{
	background-image:url(../images/service/S1-1.svg);
	*background-image:url(../images/service/S1-1.png);
}
dd.eventFileList ul.box_1 li a .ico.ico_2:after{
	background-image:url(../images/service/S1-2.svg);
	*background-image:url(../images/service/S1-2.png);}
	
dd.eventFileList ul.box_2 li a .ico.ico_1:after{
	background-image:url(../images/service/S2-1.svg);
	*background-image:url(../images/service/S2-1.png);}
	
dd.eventFileList ul.box_3 li a .ico.ico_1:after{
	background-image:url(../images/service/S3-1.svg);
	*background-image:url(../images/service/S3-1.png);}				
dd.eventFileList ul.box_3 li a .ico.ico_2:after{
	background-image:url(../images/service/S3-2.svg);
	*background-image:url(../images/service/S3-2.png);}
dd.eventFileList ul.box_3 li a .ico.ico_3:after{
	background-image:url(../images/service/S3-3.svg);
	*background-image:url(../images/service/S3-3.png);}
dd.eventFileList ul.box_3 li a .ico.ico_4:after{
	background-image:url(../images/service/S3-4.svg);
	*background-image:url(../images/service/S3-4.png);}
dd.eventFileList ul.box_3 li a .ico.ico_5:after{
	background-image:url(../images/service/S3-5.svg);
	*background-image:url(../images/service/S3-5.png);}
dd.eventFileList ul.box_3 li a .ico.ico_6:after{
	background-image:url(../images/service/S3-6.svg);
	*background-image:url(../images/service/S3-6.png);}
	
dd.eventFileList ul.box_4 li a .ico.ico_1:after{
	background-image:url(../images/service/S4-1.svg);
	*background-image:url(../images/service/S4-1.png);}	
dd.eventFileList ul.box_4 li a .ico.ico_2:after{
	background-image:url(../images/service/S4-2.svg);
	*background-image:url(../images/service/S4-2.png);}	
dd.eventFileList ul.box_4 li a .ico.ico_3:after{
	background-image:url(../images/service/S4-3.svg);
	*background-image:url(../images/service/S4-3.png);}								
dd.eventFileList ul.box_4 li a .ico.ico_4:after{
	background-image:url(../images/service/S4-4.svg);
	*background-image:url(../images/service/S4-4.png);}
dd.eventFileList ul.box_4 li a .ico.ico_5:after{
	background-image:url(../images/service/S4-5.svg);
	*background-image:url(../images/service/S4-5.png);}	 		
					
@media screen and (max-width:990px) {
	dd.eventFileList ul li a .ico { width:80px;  height:80px;}	
	dd.eventFileList ul li a {font-size:90%}	
}

/* searchCriteria */
.com-search{
	display:block;
	margin:25px auto;
	padding:12px;
}
.searchCriteria {
	width:100%;
	margin:0 auto;
	padding:0;
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
		    box-sizing:border-box;
}
.searchCriteria .search-icon{
	display:block;
	position:absolute;
	left:18px;
	top:13px;
}
.searchCriteria .tbox{
	float:left;
	width:18%;
	margin:0;
	padding:0;
	position:relative;
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
			box-sizing:border-box;	   
	-webkit-transition:all 0.4s ease;
	   -moz-transition:all 0.4s ease;
	     -o-transition:all 0.4s ease;
	transition:all 0.4s ease;
	border-right:none;
	border-left:1px solid #cccccc;
	border-top:1px solid #cccccc;
	border-bottom:1px solid #cccccc;				
	background-color:#fff;
}
.searchCriteria .sbox{
	float:right;
	width:46%;
	padding:0;
	margin:0;
	position:relative;
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
			box-sizing:border-box;	   
	-webkit-transition:all 0.4s ease;
	   -moz-transition:all 0.4s ease;
	     -o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
.searchCriteria .listBar {
	width:calc(100% - 4px);
	height:58px;
	line-height:1.2;
	font-family:"微軟正黑體", Arial, Helvetica, sans-serif;
	color:#5b5b5b;
	font-size:2.0em;
	font-weight:bold;	
	cursor:pointer;
	text-indent:0.01px;
	padding:0 25px 0 60px;
	margin:2px;
	-webkit-appearance:none;  
	-moz-appearance:none;  
	-ms-appearance:none;  
	appearance:none;
	background-color:transparent;
	border:none;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	background-image:url(../images/select-bg.svg);
	background-size:32px auto ;
    background-repeat:no-repeat;
    background-position:right center;
	background-color:#fff;
}
.searchCriteria .listBar option {
	color:#333;
	border:none;
}
.searchCriteria .abox{
	width:calc(100% - 4px);
	line-height:1.2;
	position:relative;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	padding:0 134px 0 0;
}
.searchCriteria .abox .lbox{
	width:100%;
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	background-color:#fff;
	border:1px solid #ccc;
}
.searchCriteria .abox .rbox{
	position:absolute;
	right:-4px;
	top:-3px;
	width:134px;
	float:right;
	margin:2px 0;
}
.searchCriteria .search-query {
	width:calc(100% - 60px) !important;
	line-height:1.2;
	color:#5b5b5b;
	font-family:"微軟正黑體", Arial, Helvetica, sans-serif;
	font-size:2.0em;
	font-weight:bold;
	border:none;
	background:none;
	padding-left:60px;
	border-right:none;
	margin:2px 0;
	height:56px;
}
.searchCriteria .search-btn {
	width:134px;
	height:62px;
	border:none;
	cursor:pointer;
	padding-left:25px;
	margin-top:1px;
	color:#fff;
	font-size:2.0em;
	background-color:#008571;
	font-family:"微軟正黑體", Arial, Helvetica, sans-serif;
	text-align:center;
	position:relative;
}
.searchCriteria .search-btn:hover,
.searchCriteria .search-btn:focus{ 
	background-color:#050b25;
}
.searchCriteria .search-btn > span{
	position:absolute;
	left:25px;
	top:21px;
	background:url(../images/searchCriteria-btn.svg);
	background-repeat:no-repeat;
	background-position:left center;
	display:inline-block;
	width:22px;
	height:22px;
}
@media screen and (max-width:1150px) {
	.searchCriteria .tbox{width:33.33333%;}
	.searchCriteria .search-icon{top:8px;}
	.searchCriteria .sbox{width:100%; margin-top:12px;}
	.searchCriteria .listBar{height:50px;}
	.searchCriteria .search-query{height:48px;}
	.searchCriteria .search-btn{height:56px;}
	.searchCriteria .search-btn > span{top:18px;}
}
@media screen and (max-width:660px) {
	.searchCriteria .search-icon{left:2px;}
	.searchCriteria .listBar{padding:0px 25px 0 40px;}
	.searchCriteria .search-query{
		width:calc(100% - 40px) !important;
		padding-left:40px;
	}
}
@media screen and (max-width:550px) {
	.searchCriteria .search-icon{display:none;}
	.searchCriteria .listBar{padding:0px 25px 0 10px;}
	.searchCriteria .search-query{
		width:calc(100% - 12px) !important;
		padding-left:12px;
	}
	.searchCriteria .abox {padding:0 134px 0 0px;}
}
@media screen and (max-width:425px) {
	.com-search{margin:16px auto;}
	.searchCriteria .listBar{
		background-size:23px auto;
		font-size:1.8em;
		height:32px;
	}
	.searchCriteria .search-query{font-size:1.8em; height:30px;}
	.searchCriteria .abox{padding:0 90px 0 0px;}
	.searchCriteria .search-btn{
		height:38px;
		width:90px;
		padding-left:0;
		font-size:1.8em;
	}
	.searchCriteria .search-btn > span{display:none;}
	.searchCriteria .abox .rbox{width:90px;}
}
@media screen and (max-width:375px) {
	.searchCriteria .listBar{background-size:20px auto;}
	.searchCriteria .listBar{padding:0px 25px 0 5px;}
	.searchCriteria .search-query{padding:0px 25px 0 10px;}
}


/** 主視覺 banner **/
#banner {
	position:relative;
	width:100%;
	margin:0 auto;
} 
#banner .listshow {
	float:left;
	width:100%;
}
#banner .listshow a {
	float:left;
	width:100%;
	height:0;
	padding-bottom:40%;
	display:inline-block;	
}
#banner .listshow a .img{
	width:100%;
	position:absolute;
	height:100%;
	left:0; top:0;
	z-index:0;
	background-position:center ;
	background-size:cover;
}
#banner .listshow a .t_box{
	display:block;
    position:absolute;
    width:100%;
    max-width:1300px;
	padding:0 50px;
    line-height:1.2;
    opacity:0;
    left:48%;
    top:2%;
    transform:translate(-25%,50%);
    transition:all 1S;
    transition-delay:1s;
    text-align:left;
	box-sizing:border-box;
	z-index:2
}	
#banner .listshow a .t_box.down{
	top:auto;
	bottom:calc(13.5% + 60px)
}	
#banner .listshow a .t_box strong{
	font-size:9em;
    font-family:"微软雅黑","Microsoft YaHei","微軟正黑體","Microsoft JhengHei";
    font-weight:bold;
    text-shadow:2px 2px 3px rgba(0,0,0,.75);
	display:block;
}	
#banner .listshow a .t_box p{
	font-size:4.5em;
	font-family:"微軟正黑體","Microsoft JhengHei";
    font-weight:bold;
	color:#333;
	display:block;
	margin-top:10px;
}	
#banner .listshow a .t_box .more{
	display:inline-block;
	padding:8px 50px 8px 35px;
	line-height:1;
	border:1px solid #333;
	font-size:2.4em;
	margin-top:20px;
	color:#333;
	border-radius:20px;
	position:relative;
}
#banner .listshow a .t_box .more::before{
	content:"";
	display:block;
	position:absolute;
	width:16px;
	height:2px;
	top:20px;
	right:18px;
	background-color:#333;
}
#banner .listshow a .t_box .more::after{
	content:"";
	display:block;
	position:absolute;
	width:2px;
	height:16px;
	top:13px;
	right:25px;
	background-color:#333;
}	
#banner .listshow a:hover .t_box .more,
#banner .listshow a:focus .t_box .more,
#banner .listshow a .t_box .more:hover,
#banner .listshow a .t_box .more:focus{
	background-color:rgba(0,0,0,0.6);
}		
@media screen and (max-width:1000px) {
	#banner:before{ height:7vmin}	
	#banner .listshow a  .t_box strong{font-size:6em;}	
	#banner .listshow a .t_box p{font-size:3em;}	
	#banner .listshow a .t_box{padding:0 50px;}	
}
@media screen and (max-width:768px) {
	#banner .listshow a .t_box .more{
		display:inline-block;
		font-size:1.8em;
		margin-top:13px;
		background-color:rgba(0,0,0,.2);
	 } 	
	 #banner .listshow a .t_box .more::before{top:16px;}
	 #banner .listshow a .t_box .more::after{top:10px;}
}
@media screen and (max-width:480px) {	
	#banner .listshow a .t_box{padding:0 15px;}
}	
#banner .listshow .slick-active a .t_box{
	transform:translate(-50%,50%);
	opacity:1
}	
#banner .listshow a:focus {
	filter:alpha(opacity=50);
	opacity:0.5;
}
#banner .listshow img {
	float:left;
	width:100%;
	height:auto;
}
#banner .listshow .slick-prev,
#banner .listshow .slick-next {
	position:absolute;
	display:block;
	font-size:0;
	width:35px;
    height:45px;
	border-radius:50%;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;	
	z-index:2;
	background-size:contain;
    -webkit-transition:all 0.8s;
    transition:all 0.8s;
	opacity:0;
 }  
#banner .listshow .slick-prev:before,
#banner .listshow .slick-next:before {
	display:none;
}
#banner .listshow .slick-prev {
	background:url(../images/prev.png) no-repeat 50% 50%;
	opacity:0
}
#banner .listshow .slick-prev:hover, 
#banner .listshow .slick-prev:focus,
#banner .listshow a:hover .slick-prev, 
#banner .listshow a:focus .slick-prev,
#banner:hover .listshow .slick-prev{
	opacity:1;
	left:10px}

#banner .listshow .slick-next {
	background:url(../images/next.png) no-repeat 50% 50%;
	opacity:0
}
#banner .listshow .slick-next:hover, 
#banner .listshow .slick-next:focus,
#banner .listshow a:hover .slick-next, 
#banner .listshow a:focus .slick-next,
#banner:hover .listshow .slick-next{
	opacity:1;
	right:10px
}	
#banner .listshow .slick-prev:hover, 
#banner .listshow .slick-prev:focus,
#banner .listshow .slick-next:hover, 
#banner .listshow .slick-next:focus{	
	background-color:rgba(0,0,0,0.5);
}
@media screen and (max-width:990px) {
	#banner .listshow .slick-prev:hover, #banner .listshow .slick-prev:focus, #banner .listshow a:hover .slick-prev, #banner .listshow a:focus .slick-prev, #banner:hover .listshow .slick-prev{
		left:5px;}
	#banner .listshow .slick-next:hover, 
	#banner .listshow .slick-next:focus,
	#banner .listshow a:hover .slick-next, 
	#banner .listshow a:focus .slick-next,
	#banner:hover .listshow .slick-next{
		right:5px}			
}
@media screen and (max-width:640px) {
	#banner .listshow .slick-prev,
	#banner .listshow .slick-next {
		width:25px;
		height:35px;
 	}
	#banner .listshow a .t_box strong{
		font-size:5em;
	}
	#banner .listshow a .t_box p{
		font-size:2.5em;
		text-shadow:0 0 10px #fff;
	}
}
@media screen and (max-width:480px) {
	#banner .listshow .slick-prev,
	#banner .listshow .slick-next{
		display:none !important
	}
	#banner .listshow a .t_box.down{bottom:18%}	
	#banner .listshow a .t_box{
		top:0;
		left:55%;
	}
	#banner .listshow .slick-active a .t_box{
		transform:translate(-50%,35%);
	}
	#banner .listshow a .t_box .more{
		font-size:1.6em;
		margin-top:8px;
	}
}
@media screen and (max-width:375px) {
	#banner .listshow a .t_box strong{
		font-size:3em;
	}
	#banner .listshow a .t_box p{
		font-size:2em;
	}
	#banner .listshow a .t_box .more{
		font-size:1.2em;
		padding:4px 25px;
	}
	#banner .listshow a .t_box .more::before,
	#banner .listshow a .t_box .more::after{
		display:none;
	}
}

@media screen and (min-width:481px) {
	#banner .listshow .slick-prev,
	#banner .listshow .slick-next {
		top:calc(50% - 20px)
	} 
}
@media screen and (min-width:991px) {
	#banner {margin:0 auto;} 
}


.F_L{ float:left;}
.F_R{ float:right}
.R_more{ display:inline-block; width:38px; height:38px; border-radius:50%; text-indent:-9999em; background-size:contain; background-image:url(../images/home_more_icon_on.png); background-position:center; background-repeat:no-repeat; background-color:#8ad5dd;}
.R_more.fff{ background-color:#fff; background-image:url(../images/home_more_icon.png);}
.R_more:hover, .R_more:focus{ background-color:#999 !important; background-image:url(../images/home_more_icon_on.png) !important;} 
.R_more.grey{color:#fff; width:50px; height:50px;border-radius:0; background-color:#fff; background-image:url(../images/home_more_icon_grey.png);}
.R_more.grey:hover{ background-color:#999 !important; background-image:url(../images/home_more_icon_grey_on.png) !important;} 


/*main*/
#main h2{ font-size:2.5em; display:block; margin-bottom:25px;}
#main h2 img{ vertical-align:bottom;   height:auto; margin-right:8px;}
#main h2 strong{
	font-size:2.1rem;
	color:#757575;
	display:inline-block;
 	font-weight:bold;
	letter-spacing:10px;
	font-family:"微软雅黑";
	vertical-align:bottom;
	letter-spacing:0em; text-align:left;
}
#main h2.fff strong{ 
	color:#fff;
}
#main h2.fff strong.ts{ 
	text-shadow:-1px 0 5px rgba(0, 0, 0, .7), 0 1px 5px rgba(0, 0, 0, .7);	
}	
#about{ padding:40px 0 30px 0}	
#about .left{
	float:left;
	width:36%
}	
#about .right{
	/* float:right; */
	width:calc(100% - 45% - 40px);
	margin:0 auto;
	padding-top:15px; 
	position:relative; 
	z-index:2
}		
#about .Q_ico dl{
	float:left;
	width:calc(33.3333% - 20px);
	padding:10px; text-align:center;}
	
#about .Q_ico dl dt .icon{
	width:80%; height:0; padding-bottom:80%; border-radius:50%; display:inline-block; 
	/* Permalink - use to edit and share this gradient:https://colorzilla.com/gradient-editor/#39b54a+0,8ad5dd+60 */
	background:rgb(57,181,74); /* Old browsers */
	background:-moz-linear-gradient(top,  rgba(57,181,74,1) 0%, rgba(138,213,221,1) 60%); /* FF3.6-15 */
	background:-webkit-linear-gradient(top,  rgba(57,181,74,1) 0%,rgba(138,213,221,1) 60%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to bottom,  rgba(57,181,74,1) 0%,rgba(138,213,221,1) 60%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#39b54a', endColorstr='#8ad5dd',GradientType=0 ); /* IE6-9 */
	position:relative; margin-bottom:10px; transition:all 0.5s 
}
#about .Q_ico dl dt a:hover .icon, #about .Q_ico dl dt a:focus .icon{/* Permalink - use to edit and share this gradient:https://colorzilla.com/gradient-editor/#009920+0,05bdc6+100 */
	background:rgb(0,153,32); /* Old browsers */
	background:-moz-linear-gradient(top,  rgba(0,153,32,1) 0%, rgba(5,189,198,1) 100%); /* FF3.6-15 */
	background:-webkit-linear-gradient(top,  rgba(0,153,32,1) 0%,rgba(5,189,198,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to bottom,  rgba(0,153,32,1) 0%,rgba(5,189,198,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#009920', endColorstr='#05bdc6',GradientType=0 ); /* IE6-9 */ transform:rotate(360deg); box-shadow:none !important;
}
#about .Q_ico dl dt a strong{
	font-size:2.4em; color:#000; font-weight:bold; display:block; margin-bottom:20px;}
	
#about .Q_ico dl dt a:hover strong, #about .Q_ico dl dt a:focus strong{ color:#D53F3F}	

.r_sd{box-shadow:5px 2.5px 0px rgba(0,0,0,0.1); border-radius:50%}

#about .Q_ico dl dt .icon:after{
	content:''; display:block; background-position:center; background-repeat:no-repeat; background-size:contain; position:absolute; left:0; top:0;
	width:100%; height:100%;}	
		
#about .Q_ico dl dt .icon.i_1:after{ background-image:url(../images/home-about-ico-1.png);}
#about .Q_ico dl dt .icon.i_2:after{ background-image:url(../images/home-about-ico-2.png);}
#about .Q_ico dl dt .icon.i_3:after{ background-image:url(../images/home-about-ico-3.png);}
#about .Q_ico dl dt .icon.i_4:after{ background-image:url(../images/home-about-ico-4.png);}

#about .Q_ico dl dd{ 
	position:relative; display:block; padding:8px; text-align:center; color:#fff; font-size:1.6em; font-weight:bold; border-radius:15px; background-color:#000; 	
}
#about .Q_ico dl dd:before{
	content:'';
    display:block;
    position:absolute;
    left:50%;
    top:-10px;
    width:0;
    height:0;
    margin-left:-15px;
    border-style:solid;
    border-width:0 10px 14px 10px;
    border-color:transparent transparent #000 transparent;
    z-index:2;
	}
	
#about .Q_ico dl:nth-child(1) dd{
	background-color:#d4420c;}
	
#about .Q_ico dl:nth-child(1) dd:before{
	border-color:transparent transparent #d4420c transparent;}		
	
@keyframes calc_txt{
    0% { background-color:#000}
   50% { background-color:#d4420c}
  100% { background-color:#000}
}

@-webkit-keyframes calc_txt{
    0% { background-color:#000}
   50% { background-color:#d4420c}
  100% { background-color:#000}
}
 /*
#about .Q_ico dl:nth-child(2) dd:hover{
	background-color:#d4420c !important; }
#about .Q_ico dl:nth-child(2) dd:hover:before{
	border-color:transparent transparent #d4420c transparent; }	
*/	
		
#about .Q_ico dl:nth-child(2) dd a:hover,
#about .Q_ico dl:nth-child(2) dd a:focus{color:#fff !important}
#about .Q_ico dl dd a{ 
	display:block; padding:8px 0; text-align:center; color:#fff; border-bottom:1px dashed #fff; text-decoration:none; font-size:1.6em; font-weight:bold;}
#about .Q_ico dl dd a:hover, #about .Q_ico dl dd a:focus{ color:#FF0}
#about .Q_ico dl dd a:after{
	content:'+'; display:inline-block; line-height:1; margin-top:-5px; vertical-align:middle; margin-left:4px; font-size:110%; font-weight:100;}
	
#about .Q_ico dl:nth-child(1) dd a:after,
#about .Q_ico dl:nth-child(2) dd a:after,
#about .Q_ico dl:nth-child(3) dd a:after{
	content:'➜';}		
	
#about .Q_ico dl dd a:last-child{ border-bottom:0;}	
#about .left .ifo{
	font-size:1.6em; color:#4d4d4d; line-height:2; margin-bottom:15px; text-align:justify;}

#about .left .more{
	display:inline-block; line-height:32px; font-size:1.95em; font-weight:bold; color:#fff; background-color:#8ad5dd; padding:0 18px;
	border-radius:20px;}
	
#about .left .more:focus, #about .left .more:hover{ background-color:#999}	
	
#about .left .more:after{
	content:'+';
    display:inline-block;
    vertical-align:middle;
    margin-left:5px;
    line-height:1;
    margin-top:-6px;}		
		
	
@media screen and (max-width:1400px) {
#about .Q_ico dl dt a strong{font-size:1.8em;}	
#main h2 strong{ font-size:3vw}	
#main h2 img{ height:6vw; width:auto; margin-right:0}
}
@media screen and (max-width:1000px) {
#about .Q_ico dl dd{ padding:0 4px;}		
#main h2{
	font-size:3.5em;
	margin-bottom:20px;}
#main h2.B_line:after{
	bottom:-17px;
	height:3px;}
#about .left, #about .right{
	width:100%; margin-bottom:30px;}	
		
	}
@media screen and (max-width:768px) {
#about .Q_ico dl dd a { font-size:1.4em;}	
#main h2{
	font-size:3em;}	
 	
#main h2 img { height:10vw; }
#main h2 strong { font-size:4vw;
}
#about .Q_ico dl dt a strong {
    font-size:1.6em; line-height:1.3
}
		
}
@media screen and (max-width:425px) {
	#about{
		padding:20px 0;
	}
#main h2 img {
    height:15vw;
}	
#main h2 strong { font-size:6vw;
}
#about .Q_ico dl {
    width:calc(50% - 30px);
    padding:15px;
}

#about .left{
    width:100%;
    margin-bottom:30px;
    padding:0 15px;
    box-sizing:border-box;
}
#Result .case_show{
	width:100%;
    margin-left:0;}
}
#Videos .R_more{
	width:35px;
	height:35px;
}


/*About*/	
#About{
	/*padding:60px 0;*/
	background:url(../images/about_bg.jpg) center no-repeat;
	background-size:cover;
}	
#About .container{
	position:relative;
	box-sizing:border-box;
	text-align:left;
	padding:0 12px;
}
@media screen and (min-width:991px) {
	#About .container{
		padding-left:21.05vw;}	
	#About .container:before{
		content:'';
		font-size:0;
		display:block;
		width:18vw;
		height:18vw;
		*background:url(../images/about__logo.png) center no-repeat;
		background:url(../images/about__logo.svg) center no-repeat;
		background-size:contain;
		opacity:0.5;
		position:absolute;
		left:0;
		top:50%;
		margin-top:-9vw;
		z-index:1;}		
}
			
#About h2{
	display:block;
	color:#2c81a3;
	font-size:5em;
	font-weight:normal;
	box-sizing:border-box;
	padding-left:65px;
	line-height:1;
	*background:url(../images/about_TIT_ICON.png) left center no-repeat;
	background:url(../images/about_TIT_ICON.svg) left center no-repeat;
	background-size:50px;
	margin-bottom:25px;
	text-align:left;}
	
#About .infos{
	box-sizing:border-box;
	background-color:#fff;
	padding:28px;
	position:relative;}
	
#About .infos:before, #About .infos:after{
	content:'';
	display:block;
	width:56px; height:56px;
	position:absolute;
	z-index:0;}
	
#About .infos:before{
	border-left:10px solid #2c81a3;
	border-bottom:10px solid #2c81a3;
	left:-10px;
	bottom:-10px;}
	
#About .infos:after{
	border-right:10px solid #2c81a3;
	border-top:10px solid #2c81a3;
	right:-10px;
	top:-10px;}			
	
#About .infos p{
	font-size:1.7em;
	line-height:1.76;
	color:#000;}
		
#About .more{
	display:block;
	width:60px;
	height:60px;
	position:absolute;
	right:0;
	bottom:0;
	*background:url(../images/about-more.png) right bottom no-repeat;
	background:url(../images/about-more.svg) right bottom no-repeat;
	background-size:contain;
	font-size:0;}
	
#About .more:hover, #About .more:focus{
	*background:url(../images/about-more-on.png) right bottom no-repeat;
	background:url(../images/about-more-on.svg) right bottom no-repeat;
	background-size:contain;
	}	

@media screen and (max-width:768px) {
	#about .right{ margin-bottom:-20px;}	
}		
@media screen and (max-width:550px) {
	#About{
		padding:50px 0;
		background:url(../images/about_bg-s.jpg) center no-repeat;
		background-size:cover;}	
	#About h2 {
		font-size:3em;
		padding-left:40px;
		background-size:contain;
		margin-bottom:30px;
		letter-spacing:5px;
		padding-bottom:3px;
	}
	#About .infos:before, #About .infos:after{
		width:40px;
		height:40px;}	
}

	
/*Result*/
#Result{ position:relative; background-color:#f7f8f9; padding:80px 0;} 
#Result h2.fff strong{color:#666666;}
#Result .com-search{background:#ccedec;}
#Result h2{ margin-bottom:0; }    				
.se_tit{ position:relative; z-index:2;margin-bottom:10px;}	
#Result .se_tit .R_more{ position:absolute; right:0; bottom:0; z-index:10}

.result_content{list-style:none;}
.result_content .top{
	display:inline-block;
	width:100%;
	position:relative;
	margin-bottom:20px;
}
.result_content .top .t-word{
	float:left;
	width:22%;	
}
.result_content .top .t-word p{
	font-size:1.8em;
	padding:8px 28px 0px 60px;
	font-weight:bold;
	color:#000;
	line-height:1.2;
}
.result_content .top .t-word p.ph{
	display:none;
}
.result_content .top .t-word p::before{
	content:"";
	display:block;
	height:50px;
	width:50px;
	background-image:url(../images/result-icon.png);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	position:absolute;
	top:0;
	left:0;
}
.result_content .top .t-menu{
	display:block;
	float:right;
	width:calc(78% - 5px);
	white-space:nowrap;
	position:relative;
}
.result_content .top .t-menu::after{
	content:"";
	display:none;
	position:absolute;
	right:50%;
	bottom:-55%;
	transform:translateY(-50%);
	width:0;
	height:0;
	border-style:solid;
	border-width:8px 8px 8px 8px;
	border-color:#666666 transparent transparent transparent ;
}
.result_content .top .t-menu ul{
	overflow-x:overlay;
}
.result_content .top .t-menu ul::-webkit-scrollbar {
	height:8px;
}
.result_content .top .t-menu ul::-webkit-scrollbar-track-piece {
	background:#dadada;
}
.result_content .top .t-menu ul::-webkit-scrollbar-thumb {
	background-color:#909090;
}
.result_content .top .t-menu li{
	display:inline-block;
	text-align:center;
}
.result_content .top .t-menu li a{
	display:inline-block;
	vertical-align:middle;
	font-size:2.0em;
	font-family:"微软雅黑","Microsoft YaHei","Microsoft JhengHei";
	font-weight:bold;
	color:#2A7070;
	background:#ccedec;
	padding:20px 0;
	margin-right:1px;
	width:336px;
	position:relative;
}
.result_content .top .t-menu li a::before{
	content:"";
	display:none;
	width:20px;
	height:20px;
	border-radius:50%;
	background:#fff;
	position:absolute;
	top:20px;
	right:40px;
}
.result_content .top .t-menu li a::after{
	content:"";
	display:none;
	width:5px;
	height:5px;
	border-left:3px solid #008571;
	border-bottom:3px solid #008571;
	transform:rotate(-45deg);
	position:absolute;
	top:25px;
	right:46px;
}
.result_content .top .t-menu li a:hover,
.result_content .top .t-menu li a:focus{
	background:#008571;
	color:#fff;
}
.result_content .top .t-menu li a:hover::before,
.result_content .top .t-menu li a:hover::after{
	display:block;
}
.result_content .top .t-menu li.on a{
	background:#008571;
	color:#fff;
}
.result_content .top .t-menu li.on a::before,
.result_content .top .t-menu li.on a::after{
	display:block;
}


.result_content .bottom{
	display:inline-block;
	width:100%;
	position:relative;
}
.result_content .bottom .b-menu{
	float:left;
	width:22%;
	margin-right:5px;
	position:relative;
	
	background:#ccedec;
	white-space:nowrap;
}
.result_content .bottom .b-menu::after{
	content:"";
	display:none;
	position:absolute;
	right:50%;
	bottom:-100%;
	transform:translateY(-50%);
	width:0;
	height:0;
	border-style:solid;
	border-width:8px 8px 8px 8px;
	border-color:#666666 transparent transparent transparent ;
}
.result_content .bottom .b-menu ul{
	overflow-y:overlay;
	height:320px;
}
.result_content .bottom .b-menu li{
	list-style:none;
}
.result_content .bottom .b-menu li a{
	display:block;
	vertical-align:middle;
	font-size:2.0em;
	font-family:"微软雅黑","Microsoft YaHei","Microsoft JhengHei";
	font-weight:bold;
	color:#2A7070;
	background:#ccedec;
	padding:24px;
	position:relative;
}
.result_content .bottom .b-menu li a::before{
	content:"";
	display:none;
	width:20px;
	height:20px;
	border-radius:50%;
	background:#fff;
	position:absolute;
	top:25px;
	right:20px;
}
.result_content .bottom .b-menu li a::after{
	content:"";
	display:none;
	width:5px;
	height:5px;
	border-left:3px solid #008571;
	border-bottom:3px solid #008571;
	transform:rotate(-135deg);

	position:absolute;
	top:31px;
	right:27px;
}
.result_content .bottom .b-menu li a:hover,
.result_content .bottom .b-menu li a:focus{
	background:#008571;
	color:#fff;
}
.result_content .bottom .b-menu li a:hover::before,
.result_content .bottom .b-menu li a:hover::after,
.result_content .bottom .b-menu li a:focus::before,
.result_content .bottom .b-menu li a:focus::after{
	display:block;
}
.result_content .bottom .b-menu li.on a{
	background:#008571;
	color:#fff;
}
.result_content .bottom .b-menu li.on a::before,
.result_content .bottom .b-menu li.on a::after{
	display:block;
}
.result_content .bottom .b-content{
	float:left;
	width:77%;
	text-align:left;
	padding:2%;
	box-sizing:border-box;
}
.result_content .bottom .b-content a{
	display:inline-block;
}
.result_content .bottom .b-content .ResTitle{
	color:#000;
	font-weight:bold;
	font-size:2.8em;
	margin-bottom:0.5em;
}
.results-bg{
	position:absolute;
	bottom:0;
	right:20px;
	width:235px;
	height:auto;
	transition:all 0.3s;
}

/* ph mode */
.result_content.ph{
	display:none;
}
.result_content.ph .top{
	margin-bottom:10px;
}
.result_content.ph .t-word {
	margin-bottom:10px;
}
.result_content.ph .t-word p{
	font-size:1.8em;
	font-weight:bold;
    color:#000;
    line-height:1.2;
	position:relative;
	padding:8px 0px 8px 50px ;
} 
.result_content.ph .t-word p::before{
	content:"";
    display:block;
	height:50px;
	width:30px;
	background-image:url(../images/result-icon.png);
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    position:absolute;
	left:0;
	top:-8px;
}
.result_content.ph .top .t-menu {
    font-family:"微软雅黑","Microsoft YaHei","Microsoft JhengHei";
	font-size:1.6em;
    font-weight:bold;
    padding:10px;
    border:0;
    background-color:#008571;
    color:#fff;
	background-image:url(../images/result-icon-ph.png);
	background-repeat:no-repeat;
	background-size:32px auto;
	background-position:right center;
	margin-bottom:0;
}
.result_content.ph .top .t-menu option{
	background:#fff;
	color:#2A7070;
	text-align:center;
}
.result_content.ph .bottom .b-menu {
	font-family:"微软雅黑","Microsoft YaHei","Microsoft JhengHei";
	font-size:1.6em;
    font-weight:bold;
    padding:10px;
    border:0;
    background-color:#e6e6e6;
    color:#666666;
	background-image:url(../images/result-icon-grey-ph.png);
	background-repeat:no-repeat;
	background-size:32px auto;
	background-position:right center;
	margin:0;
}
.result_content.ph .bottom .b-menu option{
	background:#fff;
	color:#666666;
}
.result_content.ph .bottom .b-content{
	margin-top:36px;
}
.result_content.ph .bottom .b-content::before{
	content:"";
    display:block;
    position:absolute;
    right:50%;
    top:32%;
    transform:translateY(-50%);
    width:0;
    height:0;
    border-style:solid;
    border-width:8px 8px 8px 8px;
    border-color:#666666 transparent transparent transparent;
}

@media screen and (max-width:1640px) {
	.results-bg{
		width:150px;
	}
}
@media screen and (max-width:1420px) {
	.result_content .top .t-word p{
		padding-right:10px;
	}
}
@media screen and (max-width:1340px) {
	.result_content .top .t-word p::before{
		width:40px;
		top:5px;
	}
	.result_content .top .t-word p {
		padding-left:45px;
	}
}
@media screen and (max-width:1270px) {
	.result_content .top .t-word p::before{
		top:15px;
	}
}
@media screen and (max-width:1024px) {
	.result_content .top .t-word p::before{
		display:none;
	}
	.result_content .top .t-word p {
		padding-left:5px;
	}
	.result_content .top .t-menu li a{
		font-size:1.8em;
		width:260px;
	}
	.result_content .top .t-menu li a::before{
		top:18px;
		right:12px;
	}
	.result_content .top .t-menu li a::after{
		top:23px;
		right:18px;
	}
	.result_content .bottom .b-menu li a{
		font-size:1.8em;
		padding:20px;
	}
	.result_content .bottom .b-menu {
		width:20%;
		margin-right:26px;
	}
	.result_content .bottom .b-menu li a::before{
		top:21px;
	}
	.result_content .bottom .b-menu li a::after{
		top:27px;
	}
}
@media screen and (max-width:990px) {
	#Result{
		padding:40px 0;
	}
	.result_content .top{
		margin-bottom:20px;
	}
	.result_content .top .t-word{
		width:100%;
		margin-bottom:15px;
	}
	.result_content .top .t-word p{
		display:none;
	}
	.result_content .top .t-word p.ph{
		display:block;
		padding:8px 0px 8px 50px;
	}
	.result_content .top .t-word p::before{
		display:block;
		width:40px;
		top:-8px;
	}
	.result_content .top .t-menu{
		width:100%;
		margin-bottom:20px;
	}
	.result_content .bottom .b-menu{
		background:none;
		text-align:center;
		width:100%;
		margin-bottom:20px;
	}
	.result_content .bottom .b-menu ul{
		height:auto;
	}
	.result_content .bottom .b-menu li{
		display:inline-block;
	}
	.result_content .bottom .b-menu li a{
		font-size:1.8em;
		color:#666666;		
		background:#e6e6e6;
		padding:12px 50px 12px 50px;
		margin-right:1px;
	}
	.result_content .bottom .b-menu li a:hover,
	.result_content .bottom .b-menu li a:focus{
		color:#fff;
		background:#858585;
	}
	.result_content .bottom .b-menu li a:hover::before,
	.result_content .bottom .b-menu li a:hover::after{
		display:none;
	}
	.result_content .bottom .b-menu li.on a{
		color:#fff;
		background:#858585;
	}
	.result_content .bottom .b-menu li.on a::before,
	.result_content .bottom .b-menu li.on a::after{
		display:none;
	}
	.result_content .bottom .b-content{
		width:100%;
		margin-top:25px;
		padding:0;
	}
	.result_content .bottom .b-content .ResTitle{
		font-size:2.5em;
	}
	.result_content .top .t-menu::after,
	.result_content .bottom .b-menu::after{
		display:block;
	}
	.results-bg{
		display:none;
	}
}
@media screen and (max-width:425px) { 
	#Result{
		padding:30px 0;
	}
	#Result .case_show{
		width:100%; margin-top:20px;
		margin-left:0;
	}
	#about .right {
		margin-bottom:-3px; 
		padding-top:0; 
		padding-bottom:0px;
	}
	.result_content.ph .t-word p::before{
		width:30px;
	}
	.result_content{
		display:none;
	}
	.result_content.ph{
		display:block;
		margin-bottom:10px;
	}
	.R_more {
		width:30px;
		height:30px;
	}	
	.result_content.ph .t-word{
		margin-bottom:0;
	}
}

/*News*/
#News{padding:40px 0 80px 0;}
#News h2{ margin-bottom:0; display:inline-block; vertical-align:bottom}
#News .se_tit .R_more{ vertical-align:bottom; margin-left:8px;}	
#News .se_tit .tbc{ display:table-cell}	
#News .se_tit {
    position:relative;
    z-index:1;
}
#News .f_box{
	position:relative; 
	z-index:1;
}
#News .f_box.news_box{
	max-width:100%; 
	box-sizing:border-box;
	display:flex;
	flex-direction:row;
}	
#News .f_box.movie_box{
	width:500px; 
	max-width:calc(100% - 40px); 
	box-sizing:border-box; 
	margin-left:40px;
}	
.news_box{ 
	position:relative; 
	margin-top:12px;
}
.news_box dl{
	width:33.3%;
}
.news_box dl dt{ 
	position:relative;
	display:flex;
	padding-top:22px;
	padding-left:42px;
	padding-bottom:22px;
	align-items:center;	
}
.news_box dl dt h2{
	font-size:2.5em;
	color:#fff;
	font-family:"微软雅黑","Microsoft YaHei","Microsoft JhengHei";
    font-weight:bold;
	line-height:1;
}
.news_box dl dt span{
	border-bottom:1px solid rgba(256,256,256,.75);
	height:1px;
	width:50px;
	margin-left:14px;
}
.news_box dl dt p{
	font-size:1.6em;
	font-family:"微软雅黑","Microsoft YaHei","Microsoft JhengHei";
	color:#fff;
	margin-left:14px;
	line-height:1;
}
.news_box dl#nbx_1 dt  {background:#008571;}
.news_box dl#nbx_2 dt  {background:#578000;}
.news_box dl#nbx_3 dt  {background:#0070ba;}
.news_box dl dt a{ display:block; height:60px; line-height:60px; text-align:center; background-color:#e6e6e6; color:#4d4d4d; text-decoration:none; font-size:2.5em; margin:0; padding:0}
.news_box dl dt a:hover, .news_box dl dt a:focus{background-color:#89d4dc ; color:#fff; }
.news_box dl.on dt a{ background-color:#b9e6eb; color:#000; font-weight:bold;}
.news_box dl dd {
	padding:42px 0 0px 42px; 
	min-height:400px;
}
.news_box .news_li{ 
	display:block; 
	list-style:none; 
	padding-right:42px;
	border-right:1px solid #e5e5e5;
}
.news_box #nbx_3 .news_li{
	border-right:0;
}
.news_box .news_li li{ 
	display:block; 
	padding:22px 0;
	border-bottom:1px solid #e5e5e5;
}
.news_box .news_li li:first-child{
	padding-top:0;
}
.news_box .news_li li a{
	display:inline-block;
}
.news_box .news_li li a .zoomBox{
	position:relative; width:140px; height:100px; overflow:hidden; float:left; margin-right:20px;}
	
.news_box .news_li li a .zoomBox .zoom-pic{
	position:absolute; width:100%; height:100%; left:0; top:0; transition:all 0.5s; background-color:#8ad5dd; background-position:center bottom; background-size:cover; background-image:url(../images/noPic.svg)}		
.news_box .news_li li a:hover .zoomBox .zoom-pic,
.news_box .news_li li a:focus .zoomBox .zoom-pic{transform:scale(1.1)}	
.news_box .news_li li a	strong{
	display:block; 
	font-size:2em; 
	font-weight:bolder; 
	color:#333333; 
	line-height:1.2; 
	margin-bottom:15px;
}	
.news_box .news_li li a:hover strong,
.news_box .news_li li a:focus strong{
	color:#d4420c;
}		
.news_box .news_li li a	p{ 
	display:block; 
	font-size:1.7em;
	font-weight:bold;
}		
#nbx_1 .news_li li a p time{color:#008571;}
#nbx_2 .news_li li a p time{color:#578000;}
#nbx_3 .news_li li a p time{color:#0070ba;}

/* News Btn */
.news_box .news-btn{
	display:block;
	padding:0 26px 0px 26px;
}
.news_box .news-btn a{
	width:100%;
	display:inline-block;
}	
.news_box .news-btn a strong.news-b{
	display:block;
	font-size:2.0em;
	font-family:"微軟正黑體";
	color:#666666;
	font-weight:400;
	padding:16px 16px 12px 16px;
	position:relative;
	z-index:100;
	transition:all 0.2s ease;	
}
.news_box .news-btn a strong.news-b::before{
	content:"";
	display:block;
	height:4px;
	width:100%;
	position:absolute;
	bottom:-4px;
	left:0;
	background:#008571;
	z-index:-50;
	transition:all .5s ease
}
#nbx_2 a strong.news-b::before{background:#578000;}
#nbx_3 a strong.news-b::before{background:#0070ba;}
.news_box .news-btn a strong.news-b::after{
	content:"";
	display:block;
	position:absolute;
	right:2%;
	top:50%;
	transform:translateY(-37%);
	width:0;
	height:0;
	border-style:solid;
	border-width:8px 0px 8px 8px;
	border-color:transparent transparent transparent #008571;
}
#nbx_2 a strong.news-b::after{border-color:transparent transparent transparent #578000;}
#nbx_3 a strong.news-b::after{border-color:transparent transparent transparent #0070ba;}


/* hover */
.news_box .news-btn:hover a	strong.news-b,
.news_box .news-btn:focus a	strong.news-b{
	color:#fff;
}
.news_box .news-btn:hover a strong.news-b::before{
	height:100%;
}
.news_box .news-btn:hover a	strong.news-b::after,
.news_box .news-btn:focus a	strong.news-b::after{
	border-color:transparent transparent transparent #fff;
}
#nbx_2 .news-btn:hover a strong.news-b::after{border-color:transparent transparent transparent #fff;}
#nbx_3 .news-btn:hover a strong.news-b::after{border-color:transparent transparent transparent #fff;}

@media screen and (max-width:1158px) {
	.news_box dl dt{padding-left:20px;}
	.news_box dl dt span{width:40px;}
}

@media screen and (max-width:1080px) {
	#News .f_box.movie_box{
		width:100%;
		max-width:calc(50% - 15px);
		margin-left:15px;}	
	.news_box .news_li li a .zoomBox {
		width:110px;
		height:100px; margin-right:10px}
	.news_box .news_li li a strong {font-size:1.7em;}	
	.movie_box #movies_show a strong {font-size:1.7em; margin-bottom:12px;}	
	.news_box dl dt h2{width:25%;}	
	.news_box dl dt{padding-left:30px;}
}

@media screen and (max-width:990px) {
	#about{ padding-bottom:30px;}		 
	.news_box dl dt a {
    	height:50px;
    	line-height:50px;
    	font-size:2em;
	}
	.news_box dl dd {
		min-height:370px;
	}
}
@media screen and (max-width:833px) {
	.news_box dl dt{
		flex-direction:column;
	}
	.news_box dl dt h2{
		width:100%;
	}
	.news_box dl dt span{
		display:none;
	}
	.news_box dl dt p{
		width:100%;
		margin-left:0;
		margin-top:8px;
	}
}
@media screen and (max-width:768px) {
	#News .f_box.news_box { width:100%; min-width:0; }	
	.news_box dl dd{
		padding:25px 0 0px 25px;
	}
	.news_box .news-btn {
		padding:0 15px 0px 15px;
	}
}
@media screen and (max-width:660px) {
	#News {
		padding:20px 0 40px 0;
	}
	.news_box .news-btn {
		padding:0 2px 0px 2px;
	}
	#News .f_box.news_box{
		flex-direction:column;
	}
	.news_box dl{
		width:100%;
		margin-bottom:30px;
	}
	.news_box dl dd{
		min-height:350px;
	}
}
@media screen and (max-width:425px) {
	#News {
		padding:0 0 20px 0;
	}
}


/* Industry */
#Industry{
	position:relative;
	padding:80px 0;
	background:#8ad5dd;
}
#Industry h2{
	margin-bottom:0;
}
#Industry .com-search{
	background:#6ecbd1;
}
#Industry h2 strong{
	position:absolute;
	bottom:16px;
}
.industry-group{
	display:flex;
	flex-direction:row;
	padding:0 12px;
	width:calc(100% - 24px);

}
.industry-group .industry-box {
	width:25%;
	background:#fff;
	border-radius:8px;
	box-shadow:4px 4px 0 rgba(0,0,0,.20);
	list-style:none; 
	margin-right:32px;
	transition:all 0.3s;
	text-align:center;	
}
.industry-group .industry-box a{
	display:block;
}
.industry-group .industry-box a:hover,
.industry-group .industry-box a:focus{
	transform:scale(0.9);
}
.industry-group .industry-box:last-child{
	margin-right:0;
}
.industry-group .industry-box .box-img{
	display:block;
	padding-top:36px;
}
.industry-group .industry-box .box-img img{
	display:block;
	margin:0 auto;
}
.industry-group .industry-box .box-wd{
	display:block;
	font-size:2.0em;
	font-weight:bold;
	color:#008571;
	margin-top:16px;
	text-align:center;
	padding-bottom:36px;
}
@media screen and (max-width:1400px) {
	#Industry h2 strong{
		bottom:8px;
	}
}
@media screen and (max-width:990px) {
	#Industry {
		padding:40px 0;
	}
	.industry-group{
		flex-wrap:wrap;
		justify-content:space-between;
	}
	.industry-group .industry-box{
		width:26%;
		margin-right:0;
		margin-bottom:32px;
	}
}
@media screen and (max-width:768px) {
	.industry-group .industry-box{
		width:47%;
	}
}
@media screen and (max-width:425px) {
	#Industry{
		padding:30px 0;
	}
	.industry-group .industry-box .box-img{
		padding-top:8px;
	}
	.industry-group .industry-box .box-img img{
		transform:scale(0.8);
	}
	.industry-group .industry-box .box-wd {
		padding:0 15px 16px 15px;
		margin-top:0;
		font-size:1.8em;
	}

}


/* Videos */
#Videos{
	padding:80px 0;
	background:#fff;
}
#Videos::after{
	content:"";
	display:block;
	width:100%;
	height:150px;
	background:url(../images/video-bg.png);
	background-size:contain;
	background-repeat:no-repeat;
	background-position:bottom center;
	margin-top:80px;
	margin-bottom:-80px;
}
#Videos h2{
	margin-bottom:0;
}
.movie_box{ padding-top:20px;}

.movie_box h3{
	display:inline-block;
    height:60px;
    line-height:60px;
    width:200px;
    background:#89d4dc;
    background:linear-gradient(228deg, transparent 39px, #b9e6eb 0);
    text-align:center;
    font-size:2.5em;
    color:#4d4d4d;
    font-weight:bold;
    padding-right:25px; }
	
.movie_box #movies_show{ 
	position:relative;
    padding:17px 0;
    margin-top:14px;
	display:flex;
	flex-wrap:nowrap;
	justify-content:space-between;

}	
#Videos .R_more{
	position:absolute;
	right:0;
	bottom:0;
	z-index:10;
	border:1px solid ;
}
.movie_box #movies_show a{
	position:relative;
	display:block; 
	width:100%; 
	text-decoration:none;
	background:#000;
	padding-top:10px;
	border-radius:8px;
	overflow:hidden;
}	
.movie_box #movies_show a .pic{
	display:block; 
	position:relative; 
	width:100%; 
	height:340px; 
	background-position:center; 
	background-size:100%;
	background-repeat:no-repeat;
}
.movie_box #movies_show a .pic-wd{
	height:100px;
	background:linear-gradient(to bottom, rgba(0,0,0,.0) 0%, rgba(0,0,0,1) 80%);
	display:block;
	position:absolute;
	width:100%; 
	bottom:0;
	border-radius:0 0 8px 8px;
}	
.movie_box #movies_show a .pic-wd time{ 
	display:inline-block;
	font-size:1.8em; 
	color:#f7931e;
	font-family:"微软雅黑","Microsoft YaHei";
	padding:53px 0 30px 30px;
	float:left;
}			
.movie_box #movies_show a .pic-wd strong{
	display:inline-block;
	width:70%;
	font-size:2em; 
	color:#fff; 
	margin-bottom:10px;
	font-family:"微软雅黑","Microsoft YaHei";
	padding:50px 0 30px 16px;
	float:left;
}	
.movie_box #movies_show a:hover .pic-wd strong{ 
	color:#8ad5dd
}
#movShow{width:100%;}
#movShow .onewrap{
	padding:0 10px;
	box-sizing:border-box;
}
#movShow .slick-prev, 
#movShow .slick-next {
    display:block;
    width:22px;
    height:22px;
    border:5px solid #999999;
    transform:rotate(45deg);
    z-index:20;
}
#movShow .slick-prev:hover,
#movShow .slick-next:hover{
	border-color:#008571;}
#movShow .slick-prev {
    right:100px;
    top:-88px;
    left:auto;
    border-top:0;
    border-right:0;
}
#movShow .slick-next {
    right:70px;
    top:-88px;
    border-left:0;
    border-bottom:0;
}
@media screen and (max-width:1300px) {
	.movie_box #movies_show a .pic-wd time{padding:53px 0 30px 12px;}
}
@media screen and (max-width:990px) {
	#Videos{padding:40px 0;}
	#Videos::after{margin-top:40px;margin-bottom:-40px;}
}
@media screen and (max-width:1050px) {
	.movie_box #movies_show a .pic{height:240px;}
	.movie_box #movies_show a .pic-wd strong{width:60%;}
}
@media screen and (max-width:768px) {	
	.movie_box #movies_show{flex-wrap:wrap;}
	.movie_box #movies_show a{
		width:100%;
		margin-bottom:80px;
		position:relative;
	}
	.movie_box #movies_show a .pic{height:370px;}
	.movie_box #movies_show a .pic-wd{width:100%;}
	#Videos::after {height:60px;}
}
@media screen and (max-width:580px) {
	.movie_box #movies_show a .pic{height:295px;}
	.movie_box #movies_show a .pic-wd time {font-size:1.4em;}
	.movie_box #movies_show a .pic-wd strong {font-size:1.6em;}
	#Videos::after {height:45px;}
}
@media screen and (max-width:425px) {
	#Videos{padding:30px 0;}
	.movie_box{
		margin-top:0;
		padding-top:0;
	}
	.movie_box #movies_show a .pic{height:215px;}
	.movie_box #movies_show{margin-top:0;}
	#Videos::after{
		margin-top:0;
		margin-bottom:-30px;
		height:35px;
	}
	.movie_box #movies_show a{margin-bottom:50px;}
}


/*Links*/
#Links{ 
	background-color:#8ad5dd;
	position:relative; 
	padding:60px 0 80px 0;
	margin-bottom:-30px;
} 
#Links .Q_link{
	display:block; 
 	list-style:none;
	width:100%; margin-bottom:60px; text-align:center;}
	
#Links .Q_link li{width:calc(100% / 6.1); text-align:center; padding:10px; box-sizing:border-box; display:inline-block; vertical-align:top;}		
#Links .Q_link li a{ display:block; text-decoration:none;}
#Links .Q_link li a strong{ font-size:2.2em; font-weight:bold; color:#000; display:block; width:100%; line-height:1.2}
#Links .Q_link li a i{ 
	display:inline-block; margin-bottom:12px;
    width:90%; height:0; padding-bottom:90%;
    background-position:center;
    background-repeat:no-repeat;
    background-size:100%;
    background-color:#fff; transition:all 0.4s
}	
#Links .Q_link li a:hover i{  transform:rotate(360deg); box-shadow:none; background-color:#FF9; transform:scale(0.9)}	
#Links .Q_link li a:hover strong{ color:#fff; text-shadow:0 0 4px #36C}	
#Links .Q_link li a i.ic_1{ background-image:url(../images/slink-1.png);}	
#Links .Q_link li a i.ic_2{ background-image:url(../images/slink-2.png);}	
#Links .Q_link li a i.ic_3{ background-image:url(../images/slink-3.png);}	
#Links .Q_link li a i.ic_4{ background-image:url(../images/slink-4.png);}
#Links .Q_link li a i.ic_5{ background-image:url(../images/slink-5.png);}
#Links .Q_link li a i.ic_6{ background-image:url(../images/slink-6.png);}
 @media screen and (max-width:990px) {
	#Links {padding:40px 0;}
	#Links .Q_link li{width:calc(100% / 4.1);}
	#Links .Q_link li a strong { font-size:2em; }
}
@media screen and (max-width:768px) {
	#Links .Q_link li{width:calc(100% / 3.1);}
	#Links .Q_link li a strong { font-size:1.8em; }	
}	
@media screen and (max-width:425px) {
	#Links {padding:30px 0;}
	#Links .Q_link li{width:calc(100% / 2.05);}
	#Links .Q_link li a strong { font-size:1.7em; }	
}		
	
#ad_show{width:calc(100% + 16px); margin-left:-8px; position:relative; z-index:3}
#ad_show a{ display:inline-block; padding:8px; box-sizing:border-box; outline:none;}
#ad_show a img{ display:inline-block; box-sizing:border-box; box-shadow:7px 7px 0px rgba(0,0,0,0.1); transition:all 0.4s;}
#ad_show a:hover img, #ad_show a:focus img{ transform:scale(0.9); border:dashed 2px #E02D00; outline:none;}
#ad_show .slick-prev, 
#ad_show .slick-next {
    display:block;
    width:22px;
    height:22px;
    border:5px solid #fff;
    transform:rotate(45deg);
    z-index:20;
}
#ad_show .slick-prev:hover, #ad_show .slick-next:hover,
#ad_show .slick-prev:focus, #ad_show .slick-next:focus{border-color:#FF6;}
#ad_show .slick-prev {
    right:50px;
    top:-44px;
    left:auto;
    border-top:0;
    border-right:0;
}
#ad_show .slick-next {
    right:21px;
    top:-44px;
    border-left:0;
    border-bottom:0;
}


/** 暫停播放鍵**/
/* 主視覺 */
#banner .controlerC{
	display:none;
	position:absolute;
	left:20px;top:20px;
	padding:0;
	z-index:3;
}
#banner .controlerC button{
	background-color:rgba(255,255,255,0.6);
}
#banner .controlerC button:hover,
#banner .controlerC button:focus{
	background-color:rgba(0,0,0,0.9);
}
/* 相關影音 */
#Videos .controler{
	display:none;
	position:absolute;
	right:140px;bottom:-5px;
	padding:0;
	z-index:3;
}
#Videos .controler button{
	background-color:rgba(255,255,255,0.6);
}
#Videos .controler button:hover,
#Videos .controler button:focus{
	background-color:rgba(0,0,0,0.9);
}
/* 相關連結 */
#Links .controler{
	display:none;
	position:absolute;
	right:80px;bottom:0;
	padding:0;
	z-index:3;
}
#Links .controler button{
	background-color:rgba(255,255,255,0.6);
}
#Links .controler button:hover,
#Links .controler button:focus{
	background-color:rgba(0,0,0,0.9);
}
/* controlerC */
.controlerC{
	width:auto;
	box-sizing:border-box;
	padding:0 15px;
}
.controlerC button{
	display:inline-block;
    width:44px;height:44px;
    cursor:pointer;
	background:#fff;
    border:none;
    box-sizing:border-box;
    vertical-align:middle;
    padding:0;margin:0 3px;
    border-radius:100%;
    transition:all 0.5s ease;
}
.controlerC button:hover,
.controlerC button:focus{
	background-color:#329614;
}
.controlerC button span {
    position:relative;
    display:block;
    width:100%;
    height:100%;
}
.controlerC .play span:before {
	position:absolute;
	content:"";
    display:block;
	top:50%;
	left:50%;
    width:0;
	height:0;
	border-style:solid;
	border-width:6px 0 6px 9px;
	border-color:transparent transparent transparent #000;
	box-sizing:border-box;
	margin:-6px 0 0 -3px; 
	-webkit-transition:all 0.5s ease;
	   -moz-transition:all 0.5s ease;
	     -o-transition:all 0.5s ease;
	        transition:all 0.5s ease;
}
.controlerC .play:hover span:before,
.controlerC .play:focus span:before {
	border-color:transparent transparent transparent #ffffff;
}
.controlerC .stop span:before,
.controlerC .stop span:after {
	position:absolute;
	content:"";
    display:block; 
	top:50%;  
	left:50%;
    width:3px;
    height:14px;
	background:#000;
	margin:-7px 0 0 0;   
    z-index:2;
	-webkit-transition:all 0.5s ease;
	   -moz-transition:all 0.5s ease;
	     -o-transition:all 0.5s ease;
	        transition:all 0.5s ease;
}
.controlerC .stop span:before {
	margin-left:-5px;
}
.controlerC .stop span:after {
	margin-left:2px;
}
.controlerC .stop:hover span:before,
.controlerC .stop:focus span:before,
.controlerC .stop:hover span:after,
.controlerC .stop:focus span:after {
	background:#ffffff;
}
.controlerC .play,
.controlerC.on .play,
.controlerC.off .stop{
	display:none;
}

/* controler */
.controler{
	width:auto;
	box-sizing:border-box;
	padding:0 15px;
}
.controler button{
	display:inline-block;
    width:44px;height:44px;
    cursor:pointer;
	background:#fff;
    border:none;
    box-sizing:border-box;
    vertical-align:middle;
    padding:0;margin:0 3px;
    border-radius:100%;
    transition:all 0.5s ease;
}
.controler button:hover,
.controler button:focus{
	background-color:#329614;
}
.controler button span {
    position:relative;
    display:block;
    width:100%;
    height:100%;
}
.controler .play span:before {
	position:absolute;
	content:"";
    display:block;
	top:50%;
	left:50%;
    width:0;
	height:0;
	border-style:solid;
	border-width:6px 0 6px 9px;
	border-color:transparent transparent transparent #000;
	box-sizing:border-box;
	margin:-6px 0 0 -3px; 
	-webkit-transition:all 0.5s ease;
	   -moz-transition:all 0.5s ease;
	     -o-transition:all 0.5s ease;
	        transition:all 0.5s ease;
}
.controler .play:hover span:before,
.controler .play:focus span:before {
	border-color:transparent transparent transparent #ffffff;
}
.controler .stop span:before,
.controler .stop span:after {
	position:absolute;
	content:"";
    display:block; 
	top:50%;  
	left:50%;
    width:3px;
    height:14px;
	background:#000;
	margin:-7px 0 0 0;   
    z-index:2;
	-webkit-transition:all 0.5s ease;
	   -moz-transition:all 0.5s ease;
	     -o-transition:all 0.5s ease;
	        transition:all 0.5s ease;
}
.controler .stop span:before {
	margin-left:-5px;
}
.controler .stop span:after {
	margin-left:2px;
}
.controler .stop:hover span:before,
.controler .stop:focus span:before,
.controler .stop:hover span:after,
.controler .stop:focus span:after {
	background:#ffffff;
}
.controler .play,
.controler.on .play,
.controler.off .stop{
	display:none;
}


/** resultsCases **/
.resultsCases {
	width:100%;
	display:flex;
	justify-content:space-between;
	align-items:stretch;
}
.casePic{
	width:240px;
	min-height:240px;
	background:#ccedec;
    display:flex;
    align-items:center;
	padding:10px;
	box-sizing:border-box;			
}
.caseInfo{
	width:100%;
}
.casePic + .caseInfo{
	width:calc(100% - 240px);
}
.caseInfo img{
	margin:0 auto;
}
.caseInfo table{
	width:100%;
	height:100%;
	font-size:2.1em;
	font-weight:bold;
	text-align:center;
}
.caseInfo table caption{
	margin-bottom:20px;	
}
.caseInfo table th{
	color:#fff;
	padding:10px;
	vertical-align:middle;	
	background:#006600;
	box-sizing:border-box;	
}
.caseInfo table tr:nth-child(odd){
	background:#fff;
}
.caseInfo table tr:nth-child(even){ 
	background-color:#e2efda;
}
.caseInfo table td{ 
	color:#000;
	font-size:90%;
	padding:10px;
	vertical-align:middle;
	box-sizing:border-box;
}
@media screen and (max-width:1200px) {
	.casePic{ width:200px; }
	.caseInfo{ width:calc(100% - 200px); }		
}
@media screen and (max-width:768px) {
	.caseInfo table{ font-size:1.9em; }
	.casePic{ width:27%; min-height:200px; }
	.caseInfo{ width:73%; }	
}
@media screen and (max-width:440px) {
	.resultsCases { display:block; }
	.casePic{ width:100%; min-height:auto; }	
	.caseInfo{ width:100%; }
}


/* ----- explainBox ----- */
.explainBox {
	width:100%;
	margin:20px auto 0 auto;
}
.explainBox .explainBtn {
	width:100%;
}
.explainBox .explainBtn a {
    display:inline-block;
    color:#000;
	font-size:1.7em;
	line-height:35px;
	border:1px solid #000;
    padding:0 20px;
	box-sizing:border-box;
	-webkit-border-radius:100px;
	   -moz-border-radius:100px;
			border-radius:100px;
}
.explainBox .explainBtn a:hover,
.explainBox .explainBtn a:focus {
    color:#A40000;
	border-color:#A40000;
}
.explainBox .explainBtn a.current {
	color:#FFF;
	background:#000;
}
.explainBox .explainBtn a span {
    position:relative;
	padding-right:21px;
}
.explainBox .explainBtn a span:before,
.explainBox .explainBtn a span:after {
    content:"";
    position:absolute;
    top:50%;
	right:1px;	  
    display:block;
    width:14px;
    height:2px;
	margin-top:-1px;
    background-color:#000;
    -webkit-transition:all .3s ease;
	   -moz-transition:all .3s ease;
	     -o-transition:all .3s ease;
			transition:all .3s ease;
}
.explainBox .explainBtn a span:after {
    -webkit-transform:rotate(90deg);
	   -moz-transform:rotate(90deg);
        -ms-transform:rotate(90deg);
         -o-transform:rotate(90deg);
            transform:rotate(90deg);
}
.explainBox .explainBtn a:hover span:before,
.explainBox .explainBtn a:focus span:before,
.explainBox .explainBtn a:hover span:after,
.explainBox .explainBtn a:focus span:after {
	background-color:#A40000;
}
.explainBox .explainBtn a.current span:before,
.explainBox .explainBtn a.current span:after {
	right:0;    
	width:16px;
	background-color:#FFF;
    -webkit-transform:rotate(225deg);
	   -moz-transform:rotate(225deg);
        -ms-transform:rotate(225deg);
         -o-transform:rotate(225deg);
            transform:rotate(225deg);
}
.explainBox .explainBtn a.current span:after {
    -webkit-transform:rotate(315deg);
	   -moz-transform:rotate(315deg);
        -ms-transform:rotate(315deg);
         -o-transform:rotate(315deg);
            transform:rotate(315deg);
}
.explainBox .explainBody {
	display:none;
	width:100%;
	margin:20px auto 0 auto;
}
.explainBox .explainBody ol,
.explainBox .explainBody ul {
	margin-left:2em;
}