@charset "utf-8";
/* CSS Document */


body{ overflow-x:hidden;}

a{ color: #212529;}

a:hover{ color: #0ea5ea; text-decoration: none;}



.container{ max-width: 1200px; padding: 0;}

.logo_holder{ width: 100%;margin: 0;}

.ablic_logo {
    text-indent: -9999px;
    overflow: hidden;
    width: 212px;
    height: 70px;
    background: url(../images/logo.gif) no-repeat;
	background-size: 100% auto;
	padding: 5px 0;
    margin-bottom: 0;
	max-width: 100%;
}

.logo_holder .btn_contact{ display: block; width: 100%; background: #31b3f1; text-align: center; opacity: 0.8; height: 3rem; line-height: 3rem; border-radius: 1.5rem; margin: 8px 0; float: right; max-width: 350px;}

.focus_banner{ margin-top:0!important; padding: 0 15px;}

.focus_banner_img{ padding: 0;}

.carousel-control-prev, .carousel-control-next{ width: 10%;}

.container_title{ color:#fff; background: url(../images/title_bg.jpg) no-repeat right center #00adf8; font-size: 2rem; height: 60px; line-height: 60px; margin-top: 3rem;}


.intro{ padding: 0; margin: 0;}

.intro_img{ padding:20px 0 0; max-width: 100%; height: auto;}

.intro_text{ text-indent:2rem; padding: 1.2rem 1.25rem 0; line-height: 2; margin-bottom: 0; text-align: left; font-size: 1.1rem;}


.feature_holder{ background:#f0f0f0; padding: 2rem 0; margin-top: 2rem;}

.feature_holder h3{ color:#c33; margin: 0 auto; font-size: 1.7rem; font-weight: bold;}


.card{ border-radius:0; background:#f0f0f0; margin-top: 1.5rem; border: none;}

.card-img-top{ border-radius:0;}

.card-title{ font-size:1.2rem; font-weight: bold; margin-top: 0.75rem; padding: 0 1rem; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.card-body{ padding:0.25rem;}




.btn_product_sort{
	display: block;
	width: 40%;
	background: #31b3f1;
	text-align: center;
	opacity: 0.8;
	height: 2rem;
	line-height: 2rem;
	border-radius: 1.5rem;
	margin: 0rem auto 0;
	color: #fff;
}

.btn_product_sort:hover{
	opacity: 1;
	color: #fff;
}


.sort_img{ max-width: 100%; height: auto; margin: 0!important;}

.sort_holder{ width: 100%; height: 582px; background: url(../images/sort_bg.jpg) no-repeat; margin-top: 2rem;}

.sort_list{ width:810px; height: 400px; list-style: none; margin: 10px auto; padding: 22px 30px; background: url(../images/sort_box_bg.png) no-repeat;}

.sort_list li{ float: left; width: 165px; height: 100px; margin: 11px 11px 5px;}

.sort_list li a.nav-link{ width: 165px; height: 100px; background:url(../images/sort_bg.png) repeat; color: #fff; text-align: center; border-radius: 10px; padding: 5px; vertical-align: middle; display: table-cell;}

.sort_list li a.nav-link:hover{ border: 3px solid #f4f535; padding:2px;}

.sort_list li a span{display: block; word-break: break-all; font-size: 0.9rem;}

.disabled{ opacity:0.7;}

.dropdown-toggle::after {
    display: none;
    width: 4px;
    margin: 10px auto;
	position: absolute;
	right: 0.5rem;
	bottom: 0rem;
}

.dropdown-toggle {
    white-space: normal;
}

.dropdown-menu{ margin-top:-0.5rem;}


.dropdown-item.active, .dropdown-item:active {
  background-color: #00a0e9;
}

.dropdown-item:hover{
    color: #00a0e9;
}

.dropdown-item:focus {
    color: #fff;
}

.dropdown-item span{ color: #666; display: block; font-size: 0.9rem;}

.dropdown-item:focus span{ color: #fff;}

span.dropdown-item{ color: #666; display: block; font-size: 0.9rem;}

span.dropdown-item:hover, span.dropdown-item:focus{ color: #666; background: none;}


.txt_list{ line-height: 2; list-style: none; padding:0 1rem;}

.txt_list li{ width: 100%; border-bottom: 1px solid rgba(0, 0, 0, 0.125);}

.txt_list li a{ display: block; background: url(../images/icon_arrow.gif) no-repeat left 1.5rem; background-size: auto 1rem; padding:1rem 0 1rem 1.5rem; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #212529;}

.txt_list li a:hover{ color: #0ea5ea; text-decoration: none;}

.txt_list li a img{ vertical-align: baseline;}

.txtlist_morebtn{ display: none; width: 100%; height: 2.5rem; line-height: 2.5rem; background:#f0f0f0; text-align:center; border: none; color: #0ea5ea; opacity: 0.8;}

.txtlist_morebtn:hover{ opacity: 1; background:#f0f0f0; color: #0ea5ea; text-decoration: none;}

.txtlist_morebtn span{ background: url(../images/btn_arrow.jpg) no-repeat right center; background-size: auto 0.8rem; padding-right: 1.5rem;}


.btn_download{ display: block; width: 60%; background: #ef8074; text-align: center; opacity: 0.8; height: 3rem; line-height: 3rem; border-radius: 1.5rem; margin: 3rem auto 0;}

.btn_download span{ display: inline-block; color: #fff; font-size: 1.5rem; background: url(../images/icon_pdf.png) no-repeat left center; background-size: 2rem 2rem; padding-left: 2.5rem; height: 3rem; line-height: 3rem;}

.btn_download:hover{ opacity: 1; text-decoration: none;}


.btn_contact{ display: block; width: 60%; background: #31b3f1; text-align: center; opacity: 0.8; height: 3rem; line-height: 3rem; border-radius: 1.5rem; margin: 3rem auto 0;}

.btn_contact span{ color: #fff; font-size: 1.5rem; background: url(../images/icon_contact.png) no-repeat left center; background-size: 2rem 2rem; padding-left: 2.5rem;}

.btn_contact:hover{ opacity: 1; text-decoration: none;}



.content_location{ font-size:1rem; background: url(../images/title_bg.jpg) no-repeat right center #00adf8; height: 40px; line-height: 40px; margin-top: 0rem; padding: 0 1rem; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.content_location a{ color:#fff;}

.content_location a:hover{ text-decoration: underline;}


.download_list{ padding: 1.5rem 5%; margin-top: 0.5rem;}

.download_list li{ background: url(../images/icon_pdf1.gif) no-repeat left 0.2rem; background-size: auto 1.6rem; padding-left: 2.5rem; list-style: none; float: left; width: 100%; padding-bottom: 1rem; border-bottom: 1px solid rgba(0, 0, 0, 0.125); margin-bottom: 1rem;}

.download_list li a.download_txtname{ color: #212529; float: left; padding: 0.3rem 1rem 0.3rem 0;}

.download_list li a.download_txtname:hover{ color: #0ea5ea; text-decoration: none;}

.download_list li a.download_txtname img{ vertical-align: baseline;}

.txt_download{ float: right; display: block; width: 150px; color: #fff; background: #ef8074; text-align: center; opacity: 0.8; height: 2rem; line-height: 2rem; border-radius: 1rem;}

.txt_download span{ color: #fff; font-size: 1rem; background: url(../images/icon_download.png) no-repeat 5px center; background-size: auto 1.3rem; padding-left: 2rem; text-align: center;}

.txt_download:hover{ opacity: 1; text-decoration: none;}


.btn_contactbox{ display: inline-block; margin: 0 auto; padding: 7px 30px; border-radius: 20px; outline: none; background: linear-gradient(90deg, #00aff4 0, #00aff4 52%, #008ed5) !important;
line-height: 1.2; border: none;}


.content_title{ text-align: center; margin: 1rem auto 0.5rem; padding:1rem 5%; border-bottom: 1px solid #dcdcdc; max-width: 1000px;}

.content_title h1{ font-size: 1.5rem; color: #0ea5ea; line-height: 1.5;}

.content_info{ font-size:0.9rem; color: #0ea5ea; text-align: center; margin-top: 1rem;}

.content_time{color: #999; margin-left: 1rem;}

.content_footnote{ display: block;color: #999; font-size: 0.8rem; margin-top: 0.5rem;}

.content_detail{ padding:1.5rem 5%; max-width: 1000px; margin: 0 auto; color: rgb(63, 63, 63); line-height: 1.8;}

.content_detail p a{ color:#0ea5ea;  text-decoration: underline;}

.content_detail p img{ width: auto; height: auto; max-width: 100%;}

.content_detail div img{ width: auto; height: auto; max-width: 100%;}
.content_detail h2{background: #eee9f6;border-left: 3px solid #5423a5; padding: 10px 15px 15px 15px;color: #5448c2;}

.iframe_video{ width:100%; height: 500px;}



.contact_contenttxt{ font-size:1.2rem;}

.consult_leftname{ line-height: 1.5; display: block; height: calc(1.5em + 0.75rem + 2px);padding: 0.375rem 0.75rem;}

.consult_form i{ color:#ef8074;}

.consult_form .input-group, .consult_form .form-group{ margin-top:1rem;}



footer.content_footer{ background:#f0f0f0; padding: 2rem 0; margin-top: 2rem;}

.content_footer{ position:fixed; bottom: 0; width: 100%; padding: 1rem 0 0; background:rgb(240,240,240,0.8);}

.home_footer{ position: inherit;}

footer.content_footer p{ float: left; width: 100%;}

footer.content_footer p span.footer_l{ float: left;}
	
footer.content_footer p span.footer_r{ float: right;}

@media (max-width: 1220px) {
	footer.content_footer p span.footer_l{ margin-left:1rem;}
	
	footer.content_footer p span.footer_r{ margin-right:1rem;}
}

@media (max-width: 670px) {
	footer.content_footer p span.footer_l{ float: none; display: block; margin-left:0;}
	
	footer.content_footer p span.footer_r{ float: none; display: block; margin-right:0;}
}

.content_mainholder{ margin-bottom: 100px;}

.navbar{ max-width: 1200px; margin: 0 auto;}

.content_totalholder{ max-width:100%;}

.content_totalholder .content_title{ border-bottom: none; max-width: 100%;}

.content_totalholder .content_detail{ padding:0; max-width: 100%;}

@media (max-width: 768px) {
	.ablic_logo {
    margin: 0 auto;
	display: block;
	}
	.logo_holder .btn_contact { float: none; margin: 8px auto;}
	.focus_banner{ padding: 0;}
	.row{ margin-left: 0; margin-right: 0;}
	.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto {
    padding-right: 0;
    padding-left: 0;}
	
	.card{ margin-left: 15px; margin-right: 15px;}
	.intro_img{ width: 100%; margin-right: 0!important; padding:20px 15px 0 15px;}	
	
	.container_title{ margin-top: 2rem;}
	
	.content_location{ margin-top: 0rem;}
	
	.sort_holder{ width: 100%; height: auto; min-height: 582px; background: url(../images/sort_bg.jpg) no-repeat center top; margin-top: 2rem;}

	.sort_list{ width:auto; height: auto; border: 3px solid #cb4855; background:none; border-radius: 10px; padding: 5px; margin: 10px !important;}

	.sort_list li{ display: block; float: left; width: 46%; height: 7rem; margin: 8px 2%;}
	
	.sort_list li div{ display: table; width:100%; height:100%;}

	.sort_list li div a.nav-link{ display: table-cell; width:100%; height:100%; background:url(../images/sort_bg.png) repeat; color: #fff; text-align: center; border-radius: 10px; padding: 0.5rem 1rem 0.5rem 0.5rem; vertical-align: middle; padding: 5px;}

	.sort_list li div a span{display: block; word-break: break-all;}
		
	.dropdown-item span{ display: block!important; font-size: 0.9rem!important;}

	.disabled{ opacity:0.7;}

	.dropdown-toggle::after {
		display: block;
		width: 4px;
		margin: 10px auto;
		position: absolute;
		right: 0.5rem;
		top: 0.5rem;
	}

	.dropdown-toggle {
		white-space: normal;
	}

	.dropdown-menu{ margin-top:0; width: 100%; margin-left: 0!important;}
	
	.dropdown-item{ white-space: break-spaces;}
	
	.dropdown-item:hover{
    color: #00a0e9;
	}

	.dropdown-item:focus {
		color: #fff;
	}

	.dropdown-item span{ color: #666; display: block; font-size: 0.9rem;}

	.dropdown-item:focus span{ color: #fff!important;}
	
	.media-body{ -ms-flex:none; width: 100%;}
		
}



.feature {
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		margin-top: 43px;
}

.feature dd, .feature dt {
		width: 100%;
}

.feature dd.flex {
		width: 50%;
}
.feature {
	border: 1px solid #d5d5d5;
	border-top: none;
	border-left: none;
}

.feature dt {
	position: relative;
	padding: 18px 10px 18px 41px;
	border-top: 1px solid #d5d5d5;
	border-left: 1px solid #d5d5d5;
	background-color: #eff0f2;
	font-size: 1rem;
	line-height: 1.375;
	font-weight: normal;
}

.feature dt:before {
	display: block;
	position: absolute;
	top: 23px;
	left: 20px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: linear-gradient(-155deg, #00aff4, #00aff4 52%, #008ed5);
	content: "";
}

.feature dd {
	margin: 0;
	padding: 16px 18px 19px 39px;
	border-top: 1px solid #d5d5d5;
	border-left: 1px solid #d5d5d5;
	font-size: 1rem;
	line-height: 1.71429;
}

.feature ul {
	margin-bottom: 0;
	font-size: 1rem;
	line-height: 1.71429;
}

.feature ul li:before {
	content: none;
}



.datatables-wrap{ padding-top: 10px; margin-top:2rem;}

.dataTable {
    border-collapse: collapse;
	width: 100%;
	background-color: #fff;
	white-space: nowrap;
	color: #000;
}
.dataTable th.webshop, .dataTable td.webshop {
    display: none;
}
.datatables-wrap {
	position: relative;
	margin: 6px 0 4px;
	padding: 0 10px 10px;
	overflow: scroll;
	border: 1px solid #dfdfdf;
	background-color: #fff;
}

.dataTable td,.dataTable th {
	border-left: 1px dotted #ddd;
	font-size: 0.75rem;
	font-weight: 200;
	line-height: 1.58333;
}

.dataTable td:first-of-type,.dataTable th:first-of-type {
	border-left: none;
}

.dataTable td.height,.dataTable td.long,.dataTable th.height,.dataTable th.long {
	border-left: none;
	text-align: center;
}

.dataTable td.board,.dataTable th.board {
	border-left: none;
}

.dataTable td.board.board1,.dataTable th.board.board1 {
	border-left: 1px dotted #ddd;
}

.dataTable thead{
	border-bottom: 1px dotted #dfdfdf;
}

.dataTable thead th {
	padding: 0 0 2px 4px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px dotted #dfdfdf;
}

.dataTable thead th:first-of-type {
	padding-left: 0;
}

.dataTable thead th.sorting,.dataTable thead th.sorting_asc,.dataTable thead th.sorting_desc {
	position: relative;
}

.dataTable thead th.sorting:after,.dataTable thead th.sorting_asc:after,.dataTable thead th.sorting_desc:after {
	
	font-smoothing: antialiased;
	display: inline-block;
	position: absolute;
	top: 4px;
	right: 2px;
	color: #b1b1b1;
	font-family: FontAwesome;
	font-size: 0.8rem;
	font-weight: 400;
	line-height: 1;
}

.dataTable thead th.sorting:after {
	content: "\f0dc";
	display: none;
}

.dataTable thead th.sorting_asc:after {
	content: "\f0d7";
}

.dataTable thead th.sorting_desc:after {
	content: "\f0d8";
}

.dataTable tbody tr:hover {
	background-color: #f7f7f7;
}

.dataTable tbody tr td {
	padding: 2px 0 2px 4px;
	border-top: 1px solid #dfdfdf;
}

.dataTable tbody tr td:first-of-type {
	padding-left: 0;
}

.dataTable tbody tr:first-of-type td {
	border-top: none;
}

.dataTable tfoot {
	display: table-header-group;
}

.dataTable tfoot th {
	padding: 2px;
	border-top: 2px solid #dfdfdf;
	border-bottom: 2px solid #dfdfdf;
	text-align: left;
}

.dataTable tfoot th:first-of-type {
	padding-left: 0;
}

.dataTable tfoot input[type=text],.dataTable tfoot select {
	width: 100%;
	padding: 4px 0 4px 4px;
	border: none;
	border-radius: 4px;
	outline: none;
	background-color: #f0f0f0;
	line-height: 1;
}

.dataTable tfoot input[type=text].number_range_slider_filter {
	width: 0;
	padding: 0;
}

.dataTable tfoot input[type=text].number_range_slider_filter.change {
	width: 100%;
	padding: 5px 0 5px 4px;
}

.dataTable tfoot select {
	height: 22px;
	font-size: 0.8rem;
	line-height: 1;
}

.dataTable .pkg-shape {
	width: 30px;
	height: 30px;
}

.dataTable .inquiry,.dataTable .pdf {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 66px;
	height: 20px;
	margin: 0 auto;
	border-radius: 10px;
	background-color: #ef8074;
	color: #fff;
	font-size: 0.8rem;
	font-weight: 200;
	line-height: 1;
	text-decoration: none;
}

.dataTable .inquiry i,.dataTable .pdf i {
	margin-right: 5px;
	font-weight: 400;
	height: 0.8rem;
	width: 0.8rem;
	background: url(../images/icon_pdf2.png) no-repeat;
	background-size: 100% 100%;
}

.dataTable .inquiry {
	background: linear-gradient(90deg, #00aff4 0, #00aff4 52%, #008ed5);
}

.dataTable .parts {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 40px;
	height: 20px;
	margin: 0 auto;
	border-radius: 10px;
	background-color: #818181;
	color: #fff;
	font-size: 0.8rem;
	line-height: 1;
}

.dataTable tfoot a,.dataTable thead a {
	color: #00a0e9;
	text-decoration: none;
}

.dataTable tfoot a:hover,.dataTable thead a:hover {
	text-decoration: underline;
}

.dataTable .reliability-section tbody tr td,.package-list-section .dataTable tbody tr td {
	padding-top: 0;
	padding-bottom: 0;
}
.product-datasheet .dataTable .column-2 {
	width: 70px !important;
	padding-right: 10px;
	padding-left: 10px;
}

.dataTable .drawing {
	width: 73px;
	padding-left: 0;
}

.dataTable .product {
	width: 60px;
}
.dataTable a {
	color: #00a0e9;
	text-decoration: none;
}

.dataTable a:hover {
	text-decoration: underline;
}

.dataTable a.inquiry-link:hover,.dataTable a.pdf-link:hover {
	text-decoration: none;
}


.article_form .p-right{text-align: right!important;}
.article_form .p-center{text-align: center!important;}
.article_form td, .article_form th {
 word-wrap:break-word;
 word-break:break-all;
 -webkit-hyphens:auto;
 -ms-hyphens:auto;
 hyphens:auto;
 padding:5px 10px;
 border:1px solid #DDD
}
.article_form th{text-align: right!important;font-weight: normal;}
.article_form td p { 
 margin-top: 0;
 margin-bottom: 0;
}

.article_form1 th {
 background-color: #eff0f2;
}

.article_form1 a{ color:#0ea5ea;  text-decoration: underline;}