@charset "utf-8";

body{ font-family:"微軟正黑體", "新細明體", "Arial Unicode MS"}

.container-fluid{ max-width:1280px;}

.footer{
	color:#fff;
	background-color:#0092dd;
	text-align:center;
	padding:24px 0;
}
.footer a{
	color:#fff;
}
.share{margin:8px 0;}
.share img{margin:0 2px;}

.backtop{
	position:fixed;
	z-index:15;
	width:48px;
	height:48px;
	left:100%;
	top:100%;
	margin-top:-64px;
	margin-left:-64px;
	padding:5px;
	background-color:rgba(000,000,000,0.5);
	text-align:center;
	color:#fff;
	font-size:1.3rem;
	border-radius:4px;
	cursor:pointer;
	-webkit-transition: background 0.3s; /* Safari */ 
	transition: background 0.3s;
}
.backtop:hover{ background-color:#f49d02;}


.title_line{
	width:72px;
	height:4px;
	background-color:#fff;
	margin:15px auto;
}


.navbar{ padding:0px;}
.navbar-brand{ margin-left:15px;}
@media (min-width:768px){.navbar-brand{ margin-left:0;}}
.navbar-toggler{ margin:15px;}
.navbar-nav .nav-item .nav-link{ padding:15px;}
.navbar-nav .nav-item .nav-link:hover{ background-color:#999;}



.menu_header{ position:fixed; z-index:9000; top:0; left:0; width:240px; height:100%; background-color:#0092dd; -webkit-transition: margin 0.3s; /* Safari */ transition: margin 0.3s; overflow-y: auto;}

.menu_header img{ margin:12px 0;}

.menu_close{ left:100%; margin-left:0px;}
.menu_open{ left:100%; margin-left:-240px;}

.menu_header .container-fluid{ padding:0; position:relative; max-width:1280px;}


@media (min-width:992px){
	.menu_header{ position:fixed; width:100%; height:auto; background:#fff; border-top:8px solid #0092dd;  overflow-y: hidden; height:96px;	-moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}
	.menu_open, .menu_close{ left:0; margin-left:0;}
	.menu_header .container-fluid{ padding:0 15px;}
}

.logo_big{ display:none}
@media (min-width:992px){
	.logo_big{ display: block; text-align:center;  float:left;}
}
.logo_big img{ -webkit-transition: all 0.3s; /* Safari */ transition: all 0.3s; width:300px; height:auto; margin-top:17px;}

.menu_ul{list-style:none; padding:0;}
.menu_ul li{ border-bottom:1px dotted #036;}

.menu_ul li a{ color:#fff; display:block; font-size:1.1rem; -webkit-transition: background 0.3s; /* Safari */ transition: background 0.3s;  padding:15px;}
.menu_ul li a:hover, .menu_ul li a:focus{ text-decoration:none; background-color:#036;}

.menu_ul li a span{ display:block; font-size:0.8rem;}


@media (min-width:992px){
	.menu_ul{ text-align:center; border-radius:4px; height:48px; float:right;}
	.menu_ul li{ float:left; border:none; position:relative;}
	.menu_ul li a{ color:#555; font-size:1rem; width:120px; text-align:center; padding:23px 0 22px 0;}
	.menu_ul li a:hover, .menu_ul li a:focus{ background-color:#0092dd; color:#fff;}
	.menu_ul .mobile_home{ display:none;}
}
@media (min-width:1200px){
	.menu_ul li a{ font-size:1.1rem; width:140px; text-align:center; padding:22px 0 22px 0;}
}


.mobile_hide{ background-color:#000; opacity:0; position:fixed; z-index:8999; top:0; left:0; width:100%; height:100%;}

.mobile_header{ background-color:#fff; position:fixed; z-index:8900; height:96px; width:100%; border-top:8px solid #0092dd; -moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}

.mobile_header img{ margin:24px 0 0 15px; width:220px; height:auto}
@media (min-width:400px){.mobile_header img{ margin:17px 0 0 15px; width:300px;}}

.iconbar{float:right; width:48px; height:36px; margin:26px 15px; border:2px solid #525269; border-radius:4px; cursor:pointer; background-position:center; background-repeat:no-repeat;-webkit-transition: background 0.2s; /* For Safari 3.1 to 6.0 */ transition: background 0.2s;}

.iconbar_open{background-image:url(../../images/iconbar.png);}
.iconbar_close{background-image:url(../../images/iconbar2.png); border-color:#0092dd;}

.menu_title{ margin:5px 15px; padding-top:25px; padding-bottom:16px; color:#fff; font-family:Verdana, Geneva, sans-serif;}

@media (min-width:992px){
	.mobile_hide{ display:none;}
	.mobile_header{ display:none;}
	.iconbar_close{ display:none;}
	.menu_title{ display:none;}
}


.top_blank{ height:96px;}


.view_lg{ display:none;}
@media (min-width:992px){
	.view_sm{ display:none;}
	.view_lg{ display:block;}
}


.scroll_down{ 
	display:none; 
	-webkit-transition: box-shadow 0.3s, text-shadow 0.3s; /* Safari */ 
	transition: box-shadow 0.3s, text-shadow 0.3s; 
	text-shadow: 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 15px #999; 
	box-shadow: 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 10px #777, 0px 0px 15px #999;
}
.scroll_down:hover{ 
	box-shadow: 0px 0px 10px #960, 0px 0px 15px #f60, 0px 0px 20px #f60, 0px 0px 25px #ffc; 
	text-shadow: 0px 0px 10px #960, 0px 0px 15px #f60, 0px 0px 20px #f60, 0px 0px 25px #ffc;
}

@media (min-width:1200px){.scroll_down{ position:absolute; top:100%; left:50%; z-index:1000; margin-left:-40px; margin-top:-150px; height:80px; width:80px; border:4px solid #fff; border-radius:50%; text-align:center; color:#fff; padding-top:16px; cursor:pointer; display:block;}}


.more{ margin-top:32px; margin-bottom:16px;}
.more a{ padding:8px 32px; border:4px solid #fff; color:#fff; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.more a:hover{ background-color:rgba(255,255,255,0.4); text-decoration:none;}




.top_about_block{}
.top_about_block .container-fluid{ max-width:none;}

.top_about_block .col-md-3{ padding:0; display:none;}
@media (min-width:768px){.top_about_block .col-md-3{ display:block;}}

.top_about_text{ background-color:#0092dd; color:#fff; text-align:center; padding:48px 15px;}
.top_about_text p{ max-width:560px; margin-left:auto; margin-right:auto;}
@media (min-width:768px){.top_about_text{ padding-top:56px;}}
@media (min-width:992px){.top_about_text{ padding-top:88px;}}

.top_about_pic{ background-position:center; background-size:cover; height:240px;}



.top_product_block{ padding:64px 0; text-align:center; background-image:url(../../images/top_product_bg.jpg); background-position:center; background-size:cover;}

.top_product_block .title_line{ background-color:#0092dd;}

.top_product_block .col-md-6.col-lg-4{ margin:15px 0;}

.top_pro_con{ text-align:justify; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s; height:100%; background-color:#fff; position:relative;}
.top_pro_con:hover{	-moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}


.top_pro_pic{ background-position:center; background-size:cover; height:320px; position:relative;}
.top_pro_pic a{ position:absolute; width:100%; height:100%; background-color:#fff; opacity:0; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.top_pro_pic a:hover{ opacity:0.3;}

.top_pro_text{ padding:15px;}
.top_pro_text h4{ border-bottom:1px solid #0092dd; padding-bottom:8px; margin:8px 0;}
.top_pro_text h4 a{ color:#0092dd; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.top_pro_text h4 a:hover{ color:#036; text-decoration:none;}
.top_pro_text p{ color:#555; padding-bottom:48px;}


.top_pro_con .more{ position:absolute; top:100%; left:50%; margin-top:-48px; transform:translateX(-50%);}
.top_pro_con .more a{ padding:10px 24px; background-color:#0092dd; border:none;  color:#fff; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.top_pro_con .more a:hover{ background-color:#036; color:#fff; text-decoration:none;}




.top_news_block .container-fluid{ max-width:none;}

.top_news_text{ background-color:#f49d02; color:#fff; padding:48px 15px;}

.top_news_text h1{ text-align:center;}

.top_news_text ul{ padding:0; list-style:none; max-width:560px; margin-left:auto; margin-right:auto;}
.top_news_text ul li{ border-bottom:1px dashed #ccc; padding-bottom:8px; margin:4px 0;}
.top_news_text ul li a{ color:#fff;}
.top_news_text ul li a:hover{ color:#007bff; text-decoration:none;}

.top_news_pic{ background-image:url(../../images/tn1.jpg); background-position:center; background-size:cover; display:none;}

@media (min-width:768px){.top_news_pic{ display:block;}}



.top_contact_block{ padding:32px 0; background-color:#ededed; }

.top_contact_text{ text-align:center;}
@media (min-width:992px){ .top_contact_text{ text-align:left;}}
.top_contact_text ul{ list-style:none; padding:0; font-size:0.95rem; margin-top:10px; color:#555;}



.site_map{ display:none;}
@media (min-width:992px){.site_map{ display:block;}}
.site_map_con h5 a{color:#333; font-size:1.1rem;}
.site_map_con ul{ list-style:none; padding:0; font-size:0.95rem;}
.site_map_con ul li a{color:#555;}

.site_map_con h5 a:hover,
.site_map_con ul li a:hover{ color:#0092dd; text-decoration:none;}


.guide{ margin-top:32px; margin-bottom:32px;}
.guide a{ color:#0092dd; border:4px solid #0092dd; padding:8px 16px; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.guide a:hover{ text-decoration:none; background-color:#0092dd; color:#fff;}
@media (min-width:768px){.guide{ display:none;}}





.page_bread{ background-color:#0092dd; margin:0; font-size:0.9rem; display:table; width:100%;}
.page_bread .breadcrumb { background:none; float:right; text-align:left;   padding:15px 0 0 0;}
.page_bread .breadcrumb li{ border-radius:0; color:#fff;}
.page_bread .breadcrumb li::before{ color:#fff;}
.page_bread .breadcrumb a{ color:#fff;}
.page_bread .breadcrumb a:hover{color:#FC6; text-decoration:none;}


.about_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}
.about_block img{ max-width:100%; height:auto;}

.side_nav{}
.side_nav h3{ margin-bottom:20px; border-left:4px solid #0092dd; padding:0 14px;}
.side_nav h3 span{ color:#0092dd;}

.side_nav ul{ list-style:none; padding:0; margin-bottom:30px;}
.side_nav ul li{ margin-bottom:10px; padding-bottom:10px; border-bottom:1px dotted #999;}
.side_nav ul li a{ color:#555; padding-left:30px; background-position:-15px 6px; background-repeat:no-repeat; background-image:url(../images/arrow1.png); display:block; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s; font-weight:bold;}
.side_nav ul li a:hover{ color:#0092dd; text-decoration:none; background-image:url(../images/arrow2.png); background-position:0px 6px;}
.side_nav ul li a.active{ color:#0092dd; background-image:url(../images/arrow2.png); background-position:0px 6px;}



.side_nav .side_sub_ul{ margin:0;}
.side_nav .side_sub_ul li{ border-bottom:none; padding:0; margin:0;}
.side_nav .side_sub_ul li a{ font-size:0.9rem; color:#999; font-weight:normal;}
.side_nav .side_sub_ul li a:hover{ color:#0092dd; text-decoration:none; background-image:url(../images/arrow2.png); background-position:0px 6px;}
.side_nav .side_sub_ul li a.active{ color:#0092dd; background-image:none; background-position:0px 6px;}

.side_nav_pc{ display:none; }
.side_nav_mobile select{ margin:15px 0; }
@media (min-width:992px){
	.side_nav_pc{ display:block; }
	.side_nav_mobile{ display:none; }
}

@media (min-width:992px){.content_row{ border-left:1px solid #ccc;}}

.page_content h3{ color:#333; margin-bottom:20px; padding:5px 0 5px 72px; background-image:url(../images/page_title1.png); background-size:60px auto; background-position:center left; background-repeat:no-repeat;}

.page_content h3 span{ font-size:1rem; color:#0092dd; display:block;}

.page_content p img{ max-width:100%; }
.page_content ul{ max-width:100%; }

@media (min-width:992px){.page_content h3 span{ margin-left:10px; font-size:1.2rem; color:#0092dd; display:inline-block;}}


.about_content_ul{ color:#0092dd; padding-left:5px; list-style:none;}
.about_content_ul li i{ margin-right:10px;}


.product_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}


.product_block .col-lg-6.col-xl-4{ margin:15px 0;}

.page_pro_con{ text-align:justify; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s; height:100%; background-color:#fff;}
.page_pro_con:hover{	-moz-box-shadow:0 4px 15px -2px gray; -webkit-box-shadow:0 4px 15px -2px gray; box-shadow:0 4px 15px -2px gray;}


.page_pro_pic{ background-position:center; background-size:cover; height:320px; position:relative;}
@media (min-width:992px){.page_pro_pic{height:240px;}}
.page_pro_pic a{ position:absolute; width:100%; height:100%; background-color:#fff; opacity:0; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.page_pro_pic a:hover{ opacity:0.3;}

.page_pro_text{ padding:15px;}
.page_pro_text h4{ border-bottom:1px solid #0092dd; padding-bottom:8px; margin:8px 0;}
.page_pro_text h4 a{ color:#0092dd; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.page_pro_text h4 a:hover{ color:#036; text-decoration:none;}
.page_pro_text p{ color:#555; padding-bottom:48px;}

.page_pro_con .more{ position:absolute; top:100%; left:50%; margin-top:-48px; transform:translateX(-50%);}
.page_pro_con .more a{ padding:10px 24px; background-color:#0092dd; border:none;  color:#fff; -webkit-transition: all 0.2s; /* For Safari 3.1 to 6.0 */ transition: all 0.2s;}
.page_pro_con .more a:hover{ background-color:#036; color:#fff; text-decoration:none;}




.product_page_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}


.product_page_block .page_content{ color:#555;}
.product_page_block .page_content h4{ color:#3366b1;}


.pro_content_pic{ margin-bottom:15px;}
.pro_content_list{ padding-left:26px; list-style-image:url(../images/list_arrow.gif);}

.page_content .more{ display:inline-block;}
.page_content .more a{ border:none; color:#fff;}
.page_content .more.inquiry a{ background-color:#F90;}
.page_content .more.inquiry a:hover{ background-color:#C30;}
.page_content .more.back-btn a{ background-color:#0092dd;}
.page_content .more.back-btn a:hover{ background-color:#035;}

.product_block .page_content h3,
.product_page_block .page_content h3{ background-image:url(../images/page_title2.png);}


.news_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}

.news_con{ margin:15px 0; border-bottom:1px dashed #999;}

.news_con .news_date{ background-color:#0092dd; color:#fff; width:80px; height:80px; text-align:center; display:block; float:left; padding-top:15px;}
.news_con .news_date:hover{ background-color:#036; text-decoration:none;}
.news_con .news_date h5{ font-size:1.1rem;}

.news_con .news_text{ margin-left:90px;}
.news_con .news_text a{ color:#0092dd;}
.news_con .news_text a:hover{ color:#036;}

.news_page_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}
.news_page_block .page_content h4{ color:#333;}
.news_page_block .page_content h6{ margin:15px 0;}
.news_page_block .page_content p{ color:#555;}

.news_block .page_content h3,
.news_page_block .page_content h3{ background-image:url(../images/page_title3.png);}


.knowledge_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}

.knowledge_block .news_con .news_date{ background-color:#099;}
.knowledge_block .news_con .news_date:hover{ background-color:#033;}

.knowledge_block .news_con .news_text h4 a{ color:#099;}
.knowledge_block .news_con .news_text h4 a:hover{ color:#033;}



.knowledge_page_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}
.knowledge_page_block .page_content h4{ color:#333;}
.knowledge_page_block .page_content h6{ margin:15px 0;}
.knowledge_page_block .page_content p{ color:#555;}

.knowledge_block .page_content h3,
.knowledge_page_block .page_content h3{ background-image:url(../images/page_title4.png);}


.knowledge_search_row h6{ padding:6px 0;}
.knowledge_search_row .col-md-auto{ margin-right:-25px;}


.knowledge_search_row .input-group form input{float:left; width:200px; height:31px; font-size:0.9rem;}
.knowledge_search_row .input-group form button{float:left;}



.contact_block{ padding:64px 0; background-image:url(../images/about_bg.jpg); background-position:center; background-size:cover;}

.contact_block .page_content h5{ color:#0092dd; margin:10px 0;}
.contact_block .page_content ul{ padding:0; list-style:none; color:#555; margin-top:20px;}


.contact_block .page_content .contact_info_col .contact_info_con{background-color:#eaeaea; padding:15px;}
@media (min-width:992px){
.contact_block .page_content .contact_map_col{ padding-right:0;}
.contact_block .page_content .contact_info_col{ height:240px; padding-left:0;}
.contact_block .page_content .contact_info_col .contact_info_con{  height:100%; padding:30px;}
}


.contact_block form .form-group{ color:#333;}


.contact_block .page_content h3{ background-image:url(../images/page_title5.png);}

.contact_block .page_content table th{ background-color:#0092dd; color:#fff;}

.contact_block .page_content table th,
.contact_block .page_content table td{ text-align:center; vertical-align:middle;}




.inq_form_row{ text-align:left;}
.inq_form_row .input-group{ margin:8px 0;}
.inq_form_row .input-group i{ width:20px;}
.inq_form_row .form-group{ margin:8px 0;}
.inq_form_row .form-group .btn{ background-color:#0092dd; color:#fff;}
.inq_form_row .form-group .btn:hover{ background-color:#036;}
.inq_form_row .form-group .btn.submit{ background-color:#f90; color:#fff;}
.inq_form_row .form-group .btn.submit:hover{ background-color:#c30;}



/*========================================================
                           表格
=========================================================*/

.table1 {
	border-collapse: collapse;
	text-align: center;
	margin: 0 0 20px 0;
}
.table1 caption {
	color: #333;
	font-weight: bold;
}
.table1 tr:nth-of-type(2n+1) {
	background-color: #e8e8e1;
}
.table1 th {
	background: #333333;
	color: #fff;
	font-weight: bold;
	padding: 15px 5px !important;
	text-align: center;	
	border-top: 0 !important;
	border-right: 1px solid #555555;
}
.table1 td {
	padding: 0 5px;
	border: 1px solid #bbb;
}

.table1 a.file {
	display: inline-block;
	margin-top: 4px;
	width: 24px;
	height: 24px;
	background: url(../images/file_pdf.png) no-repeat center center;
	text-indent: -9999px;
	}
.table1 td img {
	max-width: 100px;
	max-height: 100px;
}
	
.table2 {
}
.table2 th {
	background: #e49d47;
	color: #fff;
	font-weight: bold;
	padding: 15px 5px !important;
	text-align: center;	
	border-top: 0 !important;
	border-right: 1px solid #bab9bb;
}
.table2 td {
	padding: 0 5px;
	border: 1px solid #cccccc;
	text-align: center;
	background-color: #fff;
}
.table2 td img {
	max-width: 100px;
	max-height: 100px;
}
.table2 td.left {
	text-align: left;
}
.table2 td.left b {
	display: block;
	color: #D40101;
}
	
.table3 {
	border-collapse: collapse;
	text-align: center;
	margin: 0 0 20px 0;
}
.table3 caption {
	color: #c0e4ea;
	font-weight: bold;
}
.table3 th {
	background: #0092dd;
	color: #fff;
	font-weight: bold;
	padding: 15px 5px !important;
	text-align: center;	
	border: 1px solid #fff;
}
.table3 td {
	padding: 0 5px;
	border: 1px solid #bbb;
	vertical-align: middle;
    text-align: center;
}
.table3 td.left {
	text-align: left;
}
.table3 a.file {
	display: inline-block;
	margin-top: 4px;
	width: 24px;
	height: 24px;
	background: url(../images/file_pdf.png) no-repeat center center;
	text-indent: -9999px;
	}
.table3 td img {
	max-width: 100px;
	max-height: 100px;
	margin: 2vh 0;
}

/* 手機表格提示 */
.table-text {
	color: #D40101;
	text-align: right;
	margin-bottom: -20px !important;
}	
@media (min-width: 768px) {
	.table-text {
		display: none;
	}	
}
/*========================================================
                           編輯器
=========================================================*/

.editor{
	width: 300px;
	height: 300px;
}
@media (min-width: 992px) {
	.editor {
		width: 600px;
		height: 600px;
	}	
}


