/*----------------------------------------------- layout -----------------------------------------------*/
hr {}
header {
	
	background-color: #FFF ;
	color:#004E8C;
}

.header_bg {
	padding:0px 0px 0px 0px ;
	line-height:85px;	/*同 .logo_img 高度 */
}
/*header 的高度由這控制*/
.header_bg .logo_img {
	height:80px;
	margin-top: -1%;
}
.header_bg a {
	display:block;
}


.header-phone {
	
}
.header-phone .header_line1 {
	width:100%;
}
.header-phone .header_line2 {
	background-color: #01508B ;
	height:5px;
	width:100%;
}

.header-phone .fa_icon {
	font-size:28px;
	margin-right:10px;
}
.header-phone .txt {
	font-size:20px;
}

.header-desk {
	
}

.header-desk .header_bg {
	
}
.header-desk .header_line1 {
	width:100%;
}
.header-desk .header_line2 {
	background-color: #01508B ;
	height:5px;
	width:100%;
}
.header-desk .btn_group {
	text-align: center;
}
.header-desk .fa_icon {
	font-size:28px;
	padding:12px;
	border:1px solid transparent ;
}
.header-desk .fa_icon:hover {
	/*border-color:#ff5050;*/
}
.header-desk .txt {
	font-size:20px;
	line-height: 55px;
	border:1px solid transparent ;
}
.lang_sw {
	cursor:pointer;
}
.header_lang {
	display:none;
	position:fixed;
	padding: 5px;
	top:60px;
	right: 10vw;	/*會由 JS 處理 觸發時的位置偏移 */
	min-width:150px;
	background-color: #004E8C;
	color:#FFF ;
	border:1px solid #cccccc;
}
.header_lang .lang_txt {
	padding: 5px 10px 5px 10px ;
	cursor:pointer;
}
.header_lang .lang_txt:hover {
	background-color: #cce9ff ;
	color:#000000;
}
@media (max-width: 767px) {
	header.menu_open .header_lang {
		display:block !important ;
	}
	.header_lang {
		position:static;
		padding:0px;
		border:0px solid #cccccc ;
	}
	.header_lang .lang_txt {
		color: #ffffff;
		background-color: #004E8C;
		text-align:center;
		line-height: 72px;
		font-size: 18px;
	}
	.header_lang .lang_txt:hover {
		background-color: #0066A1;
		color: #fff;
	}
}
.header_menu {
	background-color : #004E8C;
}

.header_menu .item_header_menu .nav-link {
	display: inline-block;
	width:100%;
	color: #fff;
	background-color: #004E8C;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: bold;
}
.header_menu .item_header_menu  {
	
}
.header_menu .item_header_menu .dropdown-menu {
	display:none;
}
.item_header_menu .dropdown-menu .nav-link {
	background-color: #004E8C;
	font-size: 18px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #2B7AA6;
	font-weight: normal;
}
.header_menu .item_header_menu.active > .nav-link  {
	background-color: #0066A1;
	font-weight: bold;	
}
.header_menu .item_header_menu.active .dropdown-menu {
    display:block;
}
.header_menu .item_header_menu .nav-link:hover {
	background-color: #0066A1;
}		
.item_menu_top_middle {
	background-color:#b3b3b3;
	color:#FFF;
	height:100%;
	line-height: 80px;
	text-align:center;
	font-size: 15px;
	display:none;
}
.item_menu_top_middle a {
	display:inline-block;
	width:100%;
	height:100%;
}
.item_menu_top_middle.active {
	background-color:#01508B;
}


/* MENU 開關 在 g_function.js */
header.menu_close .header_menu {
	display: none ;
}
header.menu_open .header_menu {
	display: block ;
}
header.menu_open .fa-bars.fa_icon:before {
	content: "\f009";
}
header.menu_type1 .item_menu_top_middle {
	display: block ;
}
header.menu_type1 .header-desk .fa-bars {
	display: none !important ;	/*20180706 先只隱藏桌面板*/
}
header.menu_disable .header_menu {
	display: none !important ;
}
header.menu_disable .fa-bars {
	display: none !important ;
}

/* 要比 .header_bg 高*/
.section_top {	
	height:90px;	
}
@media (max-width: 1109px) {
	.section_top {
		height:89px;
	}	
}
.bg_section {
	
}
.bg_footer {
	
}
.bg_footer2 {
	background-image: url(/images/bg-footer.jpg);
	padding:90px 0px 90px 0px;
	color: #FFF;
	background-color: #FFF;
}
.bg_footer2 .fa-angle-right {
	color:#ff6600;
}

.bg_about1name {
	
}
@media (max-width: 578px) {
	.bg_about1name {
		display: none;
}	
}

.bg_about1name1 {
	display: none;

}
@media (max-width: 578px) {
	.bg_about1name1 {
	display: block;
	text-align:right;
	margin-right: 20px;
	margin-left: 20px;
}	
}
/*----------------------------------------------- view -----------------------------------------------*/
.web_colo1 {
	color:#01508B;
	font-weight: bold;
}
.web_colo2 {
	color:#ff6600;
	font-weight: bold;
}
.web_colo3 {
	color:#B09781;
}
.page-title {
	font-weight:700;
}

.space_index2 {
	padding-top: 70px;
	padding-bottom: 100px;
	text-align:center ;
}
@media (max-width: 575px) {
	.space_index2 {
	padding-top: 70px;
	padding-bottom: 50px;
	text-align:center ;
	}
}
.space_index2 .tit1 {
	font-size:2em;
	font-weight:700;
}
.space_index2 .tit2 {
	color:#9D7D64;
}
.space_index2 .tit3 {
	margin-bottom: 50px;
	color: #3D3A35;
}
.item_function {
	position:relative;
	margin-left:10px;
	margin-right:10px;
	border: 1px solid #8D8D8D;
	padding-bottom: 30px;
	padding-top: 2px;
	padding-right: 2px;
	padding-left: 2px;
	margin-bottom: 35px;
}
.item_function .txt1 {
	padding-bottom:5px;
	background-color:#01508B;
	color:#FFF;
	font-size:18px;
	font-weight:600;
	padding-top: 30px;
}
.item_function .txt2 {
	background-color:#ff6600;
	color:#FFF ;
	font-size:20px;
	font-weight:600;
}
.item_function .txt3 {
	height: 100px;
	padding:20px 10px 10px 10px;
	text-overflow:ellipsis;	
	white-space:nowrap;
	overflow:hidden;
}
.item_function .txt4 {
	padding-bottom:10px;
}
.btn_function {
	padding:10px 45px ;
	background-color: #FFF ;	
	border: 1px solid #3F8CB8;	
	-webkit-border-radius:25px 25px 25px 25px;
	border-radius: 25px 25px 25px 25px;
}
.btn-submit {
	padding:10px 45px;
	background-color: #004F8C;
	border: 1px solid #3F8CB8;
	-webkit-border-radius:25px 25px 25px 25px;
	border-radius: 25px 25px 25px 25px;
	color: #FFF;
}

.space_index1 {
	padding-bottom:30px;
	text-align:center;
	background-image: url('/images/space_indexbg.jpg');	
}
.index_bar {
	line-height: 30px;
	background-color: #ff6600;
	color:#FFF;
	font-size: 18px;
	font-weight: bold;
	padding-top: 10px;
	padding-bottom: 10px;
}
.bar_arrow {
	margin: 0 auto 30px auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 50px 0 50px;
	border-color: #ff6600 transparent transparent transparent;
}
.item_core.border_r {
		border-right: 2px dotted #01508B ;

}

@media (max-width: 768px) {
	.item_core.border_r {
		border-bottom: 2px dotted #01508B ;
		border-right: 0px dotted #01508B ;
	}
}
.item_core .txt {
	margin-bottom:10px;
	font-weight:700;
	text-align:center;
	font-size: 20px;
}
.item_core .txt2 {
	font-size:12px;
	color:#737373;
}
.item_core .thing_l {
	margin-left:20%;
	background-color: #01508B;	
	-webkit-border-radius: 20px 0% 0% 20px;
	border-radius: 20px 0% 0% 20px;
	color:#FFF;
}
.item_core .thing_r {
	margin-right:20%;
	background-color: #ff6600 ;	
	-webkit-border-radius: 0% 20px 20px 0%;
	border-radius: 0% 20px 20px 0%;
	color:#FFF;
	
}
.item_core .comm_l {
	padding:10px 0px 0px 20%;
	height:100px;
	overflow:hidden;
	text-align:left ;
	border-right: 1px solid #FFF;
}
.item_core .comm_r {
	padding:10px 20% 0px 10px;
	height:120px;
	overflow:hidden;
	text-align:left ;
	border-left: 1px solid #FFF;
}
.item_core .comm2 {
	padding:20px 20px 0px 20px;
	height:100px;
	text-align: left;	/*overflow:hidden;*/
}

.banner {
	
}
.banner_comm {
	display:inline-block;
	position:absolute;
	top:30%;
	text-align:center;
	margin:0 auto ;
	z-index:1;
	width:100%;
}
.banner_comm .banner_txt1 {
	color:#FFF;
	font-size:5em;
	font-size:7vw;
	font-weight:700;
	text-shadow:3px 3px 3px #5f5d5d;
	word-spacing: -20px;
	word-spacing: -1vw;
}

.banner_comm .banner_txt2 {
	color:#FFF;
	height: 50%;
	font-size:18px;
	text-shadow:3px 3px 3px #5f5d5d;

}

@media (max-width: 575px) {
	.banner_comm .banner_txt2 {
		color:#FFF;
		height: 50%;
		font-size:18px;
		margin-right: 45px;
		margin-left: 45px;
		text-shadow:3px 3px 3px #5f5d5d;
	}

}
.banner_comm .banner_txt3 {
	
}
.btn_banner1 {
	padding:10px 45px ;
	background-color: #fff ;	
	border: 2px solid #01508B;	
	-webkit-border-radius:25px 25px 25px 25px;
	border-radius: 25px 25px 25px 25px;
	opacity:0.7;
	font-size:20px;
	font-weight:700;
}
.banner_comm .banner_txt4 {
	font-size:52px;
	color:#FFF;
}

/* Blog Timeline layout
---------------------------------- */
.timeline {
	position: relative;
	/*padding: 40px 0;
	margin-top: 40px;*/
	padding: 0px 0;
	margin-top: 0px;
	
	float: left;
	width:100%;
}
.timeline .blogpost footer {
  padding-top: 0px;
  border-top: none;
}
.timeline .blogpost header h2 {
  font-size: 22px;
}
.timeline .item_timeline {
  padding: 0 15px;
}
.timeline-date-label {
  float: none;
  clear: both;
  display: block;
  margin: 0px auto;
  text-align: center;
  /*margin-bottom: 80px;*/
	margin-top: 20px;
    margin-bottom: 20px;
  line-height: 1;
  width: 135px;
  position: relative;
  z-index: 2;
  color: #ffffff;
}
.timeline-date-label:after {
	display: block;
    clear: both;
    content: "";
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	height: 30px;
	width: 100%;
	position: absolute;
	bottom: -8px;
	z-index: -1;
	background-color: #ff6600 ;
}
.view_activity .timeline-date-label:after {
	background-color: #01508B;
}
.view_activity .timeline .item_timeline:before {
	background-color: #01508B ;
	border: 1px solid #01508B ;
}

@media (min-width: 768px) {
	.timeline .blogpost {
		margin-bottom: 0;
	}
	.timeline:before {
		background-color: #e8e8e8;
		
		background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.09) 10%, rgba(0, 0, 0, 0.09) 90%, transparent 100%);
		width: 1px;
		height: 100%;
		content: "";
		position: absolute;
		left: 50%;
		display: block;
		top: 0;
	}
	.timeline .item_timeline {
		position: relative;
		width: 50%;
		padding-left: 0;
		padding-right: 40px;
		
		margin-top: 80px ;
		margin-bottom: 80px ;
		
		float: left;
		clear: left;
		z-index: 1;
	}
	.timeline .item_timeline.pull-right {
		padding-left: 40px;
		padding-right: 0;
		
		float: right;
		clear: right;
	}
	
	.timeline .item_timeline.item_line_1 {
		margin-top: 0px ;
		
	}
	.timeline .item_timeline.item_line_2 {
		margin-bottom: 20px ;
	}
	
	.timeline .item_timeline.pull-right + .timeline-date-label {
		padding-top: 80px;
	}
	.timeline .item_timeline:after {
		content: "";
		font-family: "FontAwesome";
		right: 0px;
		background-color: #eaeaea;
		left: auto;
		position: absolute;
		top: 20px;
		z-index: -1;
		width: 35px;
		height: 1px;
	}
	.timeline .item_timeline:before {
		content: "";
		position: absolute;
		background-color: #ff6600 ;
		border: 1px solid #ff6600 ;
		height: 7px;
		width: 7px;
		-webkit-border-radius: 100%;
		-moz-border-radius: 100%;
		border-radius: 100%;
		top: 17px;
		right: -4px;
	}
	.timeline .item_timeline.pull-right:after {
		right: auto;
		left: 0px;
	}
	.timeline .item_timeline.pull-right:before {
		left: -3px;
	}
}
/* Small devices (tablets, phones less than 767px) */
@media (max-width: 767px) {
	.timeline .item_timeline.pull-right {
		float: none !important;
	}
	.timeline-date-label {
		padding-top:10%;
		margin-bottom: 30px;
	}
}
.title_timeline {
	margin-bottom: 20px;
}
.item_timeline .blogpost {
	border: 1px solid #d0d0d0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
} 
.blogpost .blogpost-header,
.blogpost .blogpost-content,
.blogpost .blogpost-footer {
	padding-left: 20px;
    padding-right: 20px;
}
.blogpost .blogpost-header {
	padding-top: 20px;
}
.blogpost .blogpost-footer {
	height:25px;
}
.blogpost .blogpost-footer .link a:hover{
	color:#ff6600 ;
}
.blogpost .blogpost-img {
	text-align:center;
	margin-bottom:10px;
}
.blogpost .overlay-container {
	text-align:center;
}
.blogpost .blogpost-content p {
	overflow-x: hidden;
}

.space_links {
	margin-bottom : 30px;
	background-color: #E2E2E2;
	padding-top: 2px;
	padding-bottom: 2px;
}
.space_links .item_links {
	position:relative;
	float:left;
	width:20%;
	text-align:center;
	border-bottom:1px solid transparent;
	color: #464646;
	font-size: 15px;
}
.item_links a {
	display: inline-block;
	height: 100%;
	width: 100%;
	padding:5px 0px 0px 0px;
	font-size: 15px;
	font-weight: bold;
}
.item_links .arrow {
	margin: 0px auto 0px auto;
    width: 0;
    height: 0px;
    border-style: solid;
    border-width: 5px 10px 0 10px;
    border-color: transparent transparent transparent transparent;
}
.item_links.active{
	border-color: #01508B ;
	color: #01508B ;
}
.item_links.active .arrow {
	border-top-color:#01508B ;
}
.contact-details {
	
	
}

.contact-details .mt{
	margin-bottom: 25px;
	text-align: center;
}
.mtin{
	text-align: left;

}
@media (max-width: 785px) {
.mtin{
	margin-right: auto;
	margin-left: auto;
}
}

.contact-details img{
	margin-bottom: 25px;
}
@media (max-width: 575px) {
.contact-details .mt{
	text-align: center;	
}
}
.contact-details h4{
	margin-bottom: 25px;
	font-weight: bold;
	line-height: 25px;
}

.bg_top {
	position:relative;
	
	background-position:0px 0px;
	background-repeat: no-repeat ;
	background-size:cover ;	
	height:60vh;
}
/*用原圖的高 + 隱藏  因為用 背景才能 cover */
.bg_top img {	
	visibility: hidden;
	height:100%;
}
.bg_top .bg_top_tet {
	position:absolute;
	top:30%;
	
	width:100%;
	text-align:center;
}
.bg_top_tet .page-title {
	color:#FFF ;
	text-shadow: 3px 3px 3px #5f5d5d;
}

.space_service {
	padding-top:20px;	/*不能用 margin 因為這頁有用 #(錨點)進行移動 */
	text-align:center;
}
.space_service .tit1 {
	font-size:2em;
	color:#01508B;
	font-weight: bold;
}
.space_service .tit2 {
	color: #9D7D64;
}
.space_service .tit3 {
	margin-bottom: 30px;
}
.space_service .tit4 {
	font-size:1em ;
	color:#EB6C1F;
}
.space_service .tit5 {
	margin-bottom: 20px;
	font-size: 1.5em;
	font-weight: bold;
	color: #EB6C1F;
}
.space_service .tit6 {
	font-size: 1.2em;
	font-weight: bold;
	color: #333;
	margin-bottom: 20px;
}
.space_service_1 .item_service {
	padding:5px;
}
.space_service_1 .bg_space1_2 {
	padding:50px 0px 50px 0px;
	background-image: url('/images/bg_space1_2.png');	
}

@media (max-width: 575px) {
.item_service_1_2{
	margin-right: 20px;
	margin-left: 20px;
}
}
.bg_space_bm0 {
	margin-bottom: 55px;
}
.bg_space_bm {
	margin-bottom: 31px;
}

.space_service_2 .item_service {
	
}
.space_service_3 .item_service  {
	padding:5px;
}
.space_service_2 .item_service_round {
	padding:3px;
}
.space_service_2 .item_service_title {
	background-color: #EB6C1F;
	color: #FFF;
	font-size: 1.5em;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 8px;
	padding-left: 10px;
	margin-bottom: 2px;
	font-weight: bold;
}
.space_service_2 .item_service_title2 {
	background-color: #004E8C;
	color: #FFF;
	text-align: left;
	padding-top: 5px;
	padding-right: 2px;
	padding-bottom: 5px;
	padding-left: 5px;
	font-weight: bold;
}
.space_service_2 .item_service_comm {
	color: #333;
	text-align: left;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-bottom: 20px;
}
.bg_space2_2 {
	background-image: url('/images/bg_space2_2.jpg');
	margin-top: 55px;
	margin-bottom: 55px;
	padding-top: 35px;
	padding-bottom: 35px;
}

.bg_space2_3 {
 
}
 .bg_space2_3 .titl{
	font-size:1.5em;
	color: #ED7E36;
	text-align: left;
	margin-top: 250px;
	font-weight: bold;
}

.bg_space2_3 .span_comm{
	color: #333;
	text-align: left;
	margin-top: 5px;
}
@media (max-width: 785px) {
	 .bg_space2_3 .titl{
		font-size:1.5em;
		color: #ED7E36;
		text-align: center;
		margin-top:20px;
		font-weight: bold;
	}
}	
@media (max-width: 575px) {
	 .bg_space2_3 .titl{
		font-size:1.5em;
		color: #ED7E36;
		text-align: center;
		margin-top:20px;
		font-weight: bold;
	}
	 .bg_space2_3 .span_comm{
		color: #333;
		text-align: center;
		margin-top: 10px;
		margin-bottom:10px
		
	}
}
.bg_space3_1{
 
}
.item_function_service3 {
	position: relative;
	padding-top: 2px;
	padding-right: 2px;
	padding-bottom: 10px;
	padding-left: 2px;
	
}


.item_img{
	position: relative;
	margin-right: -5px;
	margin-left: -5px;
}
@media (max-width: 575px) {
	.item_img{
		position: relative;
		margin-right: 5px;
		margin-left: 5px;
	}
}
.item_function_service {
	border: 1px solid #8D8D8D;
	
	margin-bottom: 35px;
	
}
.item_function_service2 {
	position:relative;
	
	border: 1px solid #8D8D8D;
	
	margin-bottom: 35px;
}
.space_service_3 .bg_space3_2 {
	padding:50px 0px 50px 0px;
	background-image: url('/images/bg_space3_2.png');
}
.item_service3_2 {
	margin-bottom:10px;
}
.item_service3_2 .str1 {
	display:inline-block;
	float:left;
	width:30%;
	text-align:center;
	background-color: #FFF;
	padding-top: 8px;
	padding-right: 12px;
	padding-bottom: 8px;
	padding-left: 8px;
}
.item_service3_2 .str2 {
	display:inline-block;
	float:left;
	width:70%;
	padding: 8px;
	text-align:left;
	background-color: #004E8C;
	color: #FFF;
}
.space_conmm {
	background-image: url('/images/service_1_1.png');
	height: 195px;
	width: 402px;
}
.aboutin  {
	text-align: left;
	color: #2A2120;
	font-size: 15px;
	line-height: 25px;
	margin-right: 30px;
}
@media (max-width: 575px) {
	.aboutin  {
		margin-left: 20px;
		margin-right: 20px;
	}
}
.aboutin2  {
	text-align: left;
	color: #2A2120;
	font-size: 15px;
	line-height: 25px;
	margin-right: 30px;
}

@media (max-width: 768px) {
	.aboutin2  {
		margin-top: 20px;
		margin-left: 20px;
		margin-right: 20px;
	}
}
.aboutinimg{
	
}
@media (max-width: 768px) {
	.aboutinimg  {
		margin-left: 20px;
		margin-right: 20px;
	}
}

.btn_gotop {
	position:fixed;
	bottom : 5vh;
	right:2vw ;
	
	z-index:100;
	text-align:center;
	background-color: #cccccc ;
	-webkit-border-radius: 50% 50% 50% 50%;
	border-radius: 50% 50% 50% 50%;
}
.btn_gotop .fa {
	padding:9px 10px 11px 10px;
	font-size:24px;
	font-weight:800;
}