.btn {padding:8px 20px;clear: both;color: #FFF;background-color:#1d3c6f;text-decoration: none;display:inline-block;font-weight: bold;margin-top:20px;}
.btn:hover {color:#FFF;transition: background-color .3s;background:#1c345f;}



.Quote{width:100%; display:block;line-height:26px;}
.Quote h2{color:#384278;font-size:36px;font-family: 'CenturyGothic', sans-serif; font-weight:lighter;}

.inqurybottom{ display:table;width:100%;padding-top:20px;padding-bottom:20px;}
.inqurybottom h1{margin-top:0px !important;padding-top:0px !important;font-family: 'CenturyGothic', sans-serif; }
.inqurybottom .icon{ display:inline-block;padding:10px; border-radius:10px; background-color:#263369;}
.inqurybottom .icon img{margin:auto; max-width:100%;}

.inquiryform{width:100%;margin:auto;padding-top:0px;padding-bottom:20px;border-top:1px solid #eeeeee;margin-top:10x;}
.inquiryform .col-md-12{padding-bottom:30px;}
    .inquiryform table, .inquiryform table tr, .inquiryform table td { border: none;   border-bottom: 0}
    @media (max-width: 768px) {
        .inquiryform{padding-left:15px;padding-right:15px;}
}


/*conatct begin*/
.conatct-List{ display:table;width:100%;padding-top:20px;}
.conatct-List div[class*="col"]{ text-align:center;padding:15px;}
.conatct-List div[class*="col"] img{ max-width:100%;margin:auto auto 15px auto; display:block;}
.conatct-List div[class*="col"] a{color:#384278;}
.conatct-List div[class*="col"]:hover a{color:#1c345f;transition: color .3s;}

.contactQuoteprom { display:table;width:100%;}
.contactQuoteprom h1{color:#384278;font-family: 'CenturyGothic', sans-serif;}
.contactQuoteprom div[class*="col"]{min-height:190px;}
.contactQuoteprom div[class*="col"] .btn{position:relative;margin-top:25%;font-size:20px;padding-top:20px;padding-bottom:20px;padding-right:20px;}
.contactQuoteprom div[class*="col"] .btn img{position:absolute;top:15px;}
/*conatct end*/

.successinfo{line-height:30px;line-height:22px;color:#888888;padding-right:20px;padding-bottom:20px; display:table;width:100%;}
.successinfo .iconarea .iconunit{text-align:center;display:block; width:40px;height:40px; border-radius:40px; background-color:#090;color:#ffffff;line-height:40px;font-weight: bolder;font-size:22px; position:relative;z-index:9;}
.successinfo .tit{font-size:20px;font-weight:bold;color:#009900; display:block;}
.successinfo .iconarea .iconunit img{top:10px;left:5px;position:absolute; z-index:10;}
@media (min-width: 1280px){	
.successinfo .iconarea{float:left;margin-right:15px;}
}
@media (min-width: 769px) and (max-width: 1279px){
.successinfo .iconarea{float:left;margin-right:15px;}
}
	
@media (max-width: 768px){	
.successinfo .iconarea{margin-right:15px;}
}
.form-horizontal .form-group{display:table;width:100%;padding-top:10px;padding-bottom:10px;}

.SUBSCRIBE{padding:20px;margin:5% auto auto auto; border:1px solid #efefef; box-shadow:0 0 8px #cccccc; border-radius:var(--small-radius8);}
@media (min-width: 1280px){	
.SUBSCRIBE{width:30%;}
}
@media (min-width: 769px) and (max-width: 1279px){
.SUBSCRIBE{width:70%;}
}
	
@media (max-width: 768px){	
.SUBSCRIBE{width:90%;}
}

.about-us-Beliefs{ display:table;width:100%;min-height:324px;font-size:16px;line-height:26px; background-repeat:no-repeat; background-color:#fafafa; }
@media (min-width: 1280px){	
.about-us-Beliefs{ background-image:url(../images/NHP-about-us-banner-2.jpg);background-position:center center;}
}
@media (min-width: 769px) and (max-width: 1279px){
.about-us-Beliefs{ background-image:url(../images/NHP-about-us-banner-2.jpg);background-position:center center;}
}
@media (max-width: 768px){	
.about-us-Beliefs{width:100%;background-image:url(../images/NHP-about-us-banner-2-mobile.jpg);/*height:600px;*/ margin: auto;background-repeat:no-repeat;background-color:#fafafa;padding-left:15px;padding-right:15px;background-position:center bottom; vertical-align: top;padding-bottom:350px;}
}

.inquirycont h3{font-size:36px;margin-bottom:0;color:#1d3c6f;}


.job_list{border-bottom:1px solid #efefef;padding-top:15px;padding-bottom:15px;}
.job_list h3{margin-top:0px;padding-top:0px;}
.job_list h3 span {color:#aaa;font-weight:lighter; display: inline-block;margin-top:8px;font-size:14px;}

.job_search .job_search_unit .search-input{padding:12px 7px 7px 7px !important;width:100% !important;}
.job_search  select{width:100%;padding:7px;margin-top:7px;margin-bottom:7px;}
.job_search .search_btn i{font-size:20px !important;}

.job_show hr{display: block;margin-top:30px !important;margin-bottom:10px !important;}
.job_show .row{border-bottom:1px solid #efefef;padding-top:10px;padding-bottom:10px;margin-left:0px;margin-right:0px;}
.job_show .row div[class*="col-md-3"]{font-weight:bold;}
.job_show .row:nth-child(2n+1){ background-color:#fafafa;}
.job_Application{border-top:1px solid #444444;padding-top:10px;margin-top:10px;}
.job_show h3,.job_Application h3{font-size:26px !important;}

.search_job_area_fliter select{width:100%;padding:7px;margin-top:7px;margin-bottom:20px;}
.search-input{border-radius:2px;line-height:40px; padding-left:10px; width:100%; outline:none; height:40px;font-size:14px;border:0; background-color:#f4f4f4;color:#000000;}
.search_job_area .search_btn{ position:absolute;top:33px;right:0;height:39px;line-height:30px;display:inline-block;width:40px;color:#444444;border-bottom-right-radius:5px;border-top-right-radius:5px; text-align:center;font-size:20px; cursor:pointer;}
.search_job_area .search_btn:hover{color:#3399cc;}

.jobnote{color:#aaa !important;font-size:12px !important;line-height:20px !important;padding:20px 0px 0px 0px !important; font-style: italic;}


.filter_iv {
	margin-right: 10px;
	background: aliceblue;
	display: inline-block;
	margin-bottom: 10px;
}

	.filter_iv .filter_item {
		color: #297dff;
		font-weight: bold;
		margin-right: 5px;
	}

	.filter_iv .closebtn {
		cursor: pointer;
		color: red;
	}

.nomain-listfilter-header {
	margin-bottom: 5px;
	display: inline-block;
	margin-right: 5px;
}


.ShoppingCarList table td{padding:8px 5px 8px 5px;}
.products-category-1{
	margin-bottom:15px;
}
.products-category-1 a {
    width: 100%;
    display: block;
    border: 1px solid #384278;
    border-radius: var(--small-radius5);
    text-align: center;
	padding:5px 10px;
		  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
	color:#384278;
}
.products-category-1 .row{
	margin:0px;
	padding:0px;
}
.products-category-1 div[class*="col"]{
	padding:5px 10px 5px 0px;
	margin:0px;
}
.products-category-1 div[class*="col"]:hover a{
	    white-space:normal;
/*  overflow: hidden;*/
  text-overflow:inherit;
	color:#fff;
	background-color: #384278;
}
.models_unit{
	margin-bottom:15px;
}
.models_unit strong{
	display: block;
	border:1px solid #efefef;
	position: relative;
	padding:10px;
	height:48px;
	line-height:24px;
	cursor: pointer;
}
.models_unit strong:hover{
	background-color: #efefef;
}
.models_unit strong .but_f{
	width:40px;
	height:48px;
	line-height:30px;
	text-align: center;
	display: inline-block;
	top:0;
	right:0;
	position: absolute;
}
.models_unit strong .but_f:after{
		position: absolute;
	content:"+";
	left:13px;
	top:8px;
	font-size:20px;
}
.models_unit strong .add:after{
	position: absolute;
	content:"-";
	left:13px;
	top:6px;
	font-size:36px;
}
.models_unit ul{
	display: none;
}

/*=========================
sevrvices begin
==========================*/
.secbanner {
  background-color: var(--main-color);
  height: 140px;
  background-size: cover;
  background-position: center;
}
.pagestit,
.relatedtit,
.titfont {
    font-family: var(--font-mon-regular);
}

/*--------------Breadcrumb navigation begin--------------*/
.pathbg {
  background-color: #fdfdfd;
  padding-top: 10px;
}
.pathbg .nhp_container {
  padding: 0px 20px;
}
.bread-crumb {
  position: relative;
  font-size: 12px;
  margin: auto;
  padding: 0px;
}

.bread-crumb li {
  position: relative;
  display: inline-block;
  margin-right: 30px;
  color: #aaaaaa;
  line-height: 28px;
}

.bread-crumb li:last-child {
  margin-right: 0;
}

.bread-crumb li:after {
  content: '/';
  position: absolute;
  font-size: 12px !important;
  right: -22px;
  width: 10px;
  line-height: 22px;
  color: #aaaaaa;
  top: 4px;
}

.bread-crumb li:last-child:after {
  display: none;
}

.bread-crumb li a {
  color: #aaaaaa;
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  text-decoration: none;
  height: 28px;
  display: inline-block;
}

.bread-crumb li a:hover {
  color: var(--main-color);
}

.pathbg .ah-container {
  padding: 0px !important;
}

/*--------------Breadcrumb navigation end--------------*/
/*--------------leftmeun begin--------------*/
.slidetit{
    font-size:1.3rem;
}
.navMenu {
    margin: 0px 0 20px 0 !important;
    /*height:100%;*/
    padding: 0px !important;
    width: 100%;
}

.navMenu li {
    list-style: none !important;
    /* padding: 8px 0px; */
    margin:0px;
    position: relative;
}
/* .navMenu li:last-child{
    padding:8px 0px 0px 0px;
} */

.navMenu>li {
    display: block;
    margin: 0;
 
    position: relative;
}

.navMenu a:hover,
.navMenu>li a:hover {
    color:var(--main-color);
}

.navMenu>li a {
    padding: 10px 30px 10px 10px;
    color: #000000;
}

.navMenu>li>a {
    display: block;
    overflow: hidden;
    color: #333 !important;
    transition: all .3s;
    position: relative;
    text-decoration: none;
    font-size: 24px !important;
    /* padding: 10px 0px 10px 0px; */
    font-weight: 900;
    width: 88%;
}

.navMenu>li>a:hover {
    color: #333 !important;
}

.navMenu>li>.arrow:before {
    font-weight: 900;
    padding: 0px 5px 0px 10px;
    cursor: pointer;
    /*	border:1px solid #ff0000;*/
    display: none;
}

.navMenu>li>ul.sub-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    /*display: block;*/
    /* height: 400px; */
    /* overflow-y: auto; */
}

.navMenu>li>ul.sub-menu>li>ul.sub-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: none;
}

.navMenu>li>ul.sub-menu>li {
    margin-bottom: 0px;
    /* border-bottom: 1px solid #ccc; */
    position: relative;
      
}

/* .navMenu>li>ul>li {
    padding-top: 10px;
    padding-bottom: 8px;

} */

.navMenu>li>ul>li ul li {
    /* padding-top: 5px;
    padding-bottom: 5px; */
    border-bottom: 1px solid #ccc;
}

.navMenu>li>ul.sub-menu li:last-child {
    border-bottom: 0px;
}

.navMenu>li .sub-menu {
    margin:0px;
    font-size: 0.92em;
    line-height:1.3rem;
}
.navMenu>li>ul.sub-menu>li{
  margin:10px auto;
}
.navMenu>li>ul.sub-menu>li>a {
    display:block;
    /* padding-left: 0px; */
    position: relative;
      font-family:var(--font-mon-regular) !important;
   /* width: 90%; */
    /* font-size:1.05rem; */
    background-color: #eff9f8;
    border:1px solid #ccc;
    border-radius: 30px;
    /* padding:10px 40px 10px 20px; */
}

.navMenu>li>ul.sub-menu>li>a:before {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    color: #ddd;
}

.navMenu>li>ul.sub-menu .sub-menu li>a {
    display: inline-block;
    padding-left: 0px;
    line-height: 1.5em;
    /*    overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;*/
    position: relative;
    /* width: 90%; */
    color: #000;
}

.navMenu>li>ul.sub-menu .sub-menu .sub-menu {
    list-style: none;
    /*background: #f9f9f9;*/
    /* padding: 10px 0; */
    display: none;
    margin:0px 0px 0px 5px;
    padding:0px;
}

.navMenu>li>ul.sub-menu .sub-menu .sub-menu li>a {
    color: #000;
    padding-left: 10px;
    /* height: 22px; */
}

.navMenu>li>ul.sub-menu .sub-menu .sub-menu li>a:before {
    content: '';
}

.navMenu>li>ul.sub-menu .sub-menu li>a:before {
    content: '';
    top: 0px;
    position: absolute;
    left: 0;
    color: #111111;
}

.navMenu>li>ul.sub-menu .sub-menu .sub-menu .sub-menu {
    padding: 8px;
    margin-bottom: 0px;
    background: #eeeeee;
}


.navMenu>li {
  display: block;
  margin: 0;
  padding: 5px 0 5px 0;
  border: 0px;
  position: relative
}

.navMenu>li>a {
  display: block;
  overflow: hidden;
  color: #000000;
  line-height: 36px;
  position: relative;
  text-decoration: none
}

.navMenu li a:hover {
  color: var(--main-color)
}

.navMenu>li>a>i {
  font-size: 10px;
  float: left;
  font-style: normal;
  margin: 0 5px
}
.sub-menu span.arrow {
    padding: 0px;
    /* border:1px solid var(--main-color); */
    display: inline-block;
    width:20px;
    height:20px;
    position: absolute;
    top:15px;
    right:10px;
    cursor: pointer;
}

.navMenu li .arrow:before {
  display: block;
  float: right;
  font-size: 18px;
  content: "";
  /* font-family: "Font Awesome"; */
  color: var(--main-color);
  text-shadow: none;
  font-weight: bold;
  position: absolute;
  top:0px;
  right: 4px;
  z-index: 8;
   width:10px;
   height:10px;
  border-top:3px solid var(--main-color);
  border-right:3px solid var(--main-color);
  transform: rotate(135deg);
}

.navMenu li .arrow.open:before {
  display: inline-block;
  /* height: auto;
  font-size: 20px;
  content: "-"; 
  font-weight: 300;
  text-shadow: none;
  font-weight: bold;
  position: absolute;
  top:4px;
  right: 5px;
   width:10px;
   height:10px;
  border-top:3px solid var(--main-color);
  border-right:3px solid var(--main-color); */
  top:4px;
  transform: rotate(-45deg);
}

.nav-active{
    color:var(--main-color) !important;
    /* font-family: var(--font-mon-regular); */

}
.left-cont-us{
  display: block;
  background-color: var(--main-color);
  color:#fff;
  text-align: center;
  padding:10px;
  border-radius: var(--small-radius5);;
}
.left-cont-us:hover{
  background-color: var(--main-yellow-color);
  color:#fff !important;
}
@media (max-width: 768px) {
.navMenu>li>ul.sub-menu {

  display: block;
   height: 400px; 
   overflow-y: auto; 
}
}
/*--------------leftmeun end--------------*/

/*================== sevrvices paiban ========*/
.mtop10,
.mt-10 {
  margin-top: 10px
}

.mtop15,
.mt-15 {
  margin-top: 15px
}

.mtop20,
.mt-20 {
  margin-top: 20px
}

.mtop30,
.mt-30 {
  margin-top: 30px
}

.mtop40,
.mt-40 {
  margin-top: 40px
}

.mtop50,
.mt-50 {
  margin-top: 50px
}

.mbottom10,
.mb-10 {
  margin-bottom: 10px
}

.mbottom15,
.mb-15 {
  margin-bottom: 15px
}

.mbottom20,
.mb-20 {
  margin-bottom: 20px
}

.mbottom30,
.mb-30 {
  margin-bottom: 30px
}

.mbottom40,
.mb-40 {
  margin-bottom: 40px
}

.mbottom50,
.mb-50 {
  margin-bottom: 50px
}

.services-container h1,
.services-container h2,
.services-container h3,
.services-container h4,
.services-container h5,
.services-container h6{
  font-family: var(--font-mon-regular) !important;
  font-weight: bold;
}

.services-container h1,.ah-container h1 {
  margin: 0px 15px 25px 0px;
  font-size: 1.8rem;
  line-height: 1.3em;
  font-weight:bold;
}

.services-container h2 {
  font-size: 22px
}

.services-container h3 {
  font-size: 18px
}

.services-container h4 {
  font-size: 16px
}

.services-container h5,
.index_container h5 {
  font-size: 16px
}

.services-container h6 {
  font-size: 14px
}

.services-container p{
  margin:20px auto !important;
}

.show-center,
.show-left,
.show-right {
  color: #666;
  text-align: center;
  font-size: 0.95em;
  line-height: 1.7em !important
}

.show-center img,
.show-left img,
.show-right img {
  display: block;
  margin-right: auto;
  margin-bottom: 15px;
  margin-left: auto;
  height: auto;
  max-width: 100%
}

@media (min-width:992px) {

  .show-left,
  .show-right {
    display: inline-block
  }

  .show-right {
    float: right;
    margin-left: 15px
  }

  .show-left {
    float: left;
    margin-right: 15px
  }
}

@media (max-width:992px) {

  .show-right,
  .show-left {
    width: 100%;
    margin: 0
  }
}

.Reference,
.reference {
  color: #666;
  font-size: 0.95em
}

.Reference p,
.reference p {
  margin-bottom: 10px
}

.Reference ol,
.reference ol {
  margin-bottom: 15px;
  padding-left: 15px
}


table{margin-bottom:25px;width:100%;border:1px solid #ddd}
table p,table td ul,table td ol{margin-bottom:15px}
table td ul:last-child,table td ol:last-child,table td p:last-child,table td ul:last-child>li:last-child,table td ol:last-child>li:last-child{margin-bottom:0}
table>thead>tr>th,table>tbody>tr>th,table>tfoot>tr>th,table>thead>tr>td,table>tbody>tr>td,table>tfoot>tr>td,.table>thead>tr>th,table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>td,.table>tbody>tr>td,.table>tfoot>tr>td{padding:10px 8px;border-top:1px solid #ddd;vertical-align:middle;line-height:1.428571429}
.service-table tr:first-child,.service-tr,.service-table.table-striped tr:first-child{background:var(--m);color:#fff}
.service-td{background:#d6efe1!important;}
.service-table tr:first-child a,.service-tr a{color:#fff}
.service-table tr:first-child td,.service-table tr:first-child th,.table-bordered .service-tr td,.service-tr td{border:none}
.service-table.table-striped>tbody>tr:nth-child(1)>td,.service-table.table-striped>tbody>tr:nth-child(1)>th{background-color:transparent}
.table-vertical tr>td:nth-child(even){background:#f9f9f9;}
.table-vertical tr>td:nth-child(odd){background:#f3f8f5;}
@media (max-width: 760px) {
	table>thead>tr>th, table>tbody>tr>th, table>tfoot>tr>th, table>thead>tr>td, table>tbody>tr>td, table>tfoot>tr>td{
		display: block;
		width: 100%;
		border: none !important;
	}
	table tr{
		border-bottom: 1px solid #ddd;
	}
}

/* .table-box strong{
  font-family: var(--font-mon-regular);
} */

.table-box{
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:1px solid var(--main-color);
}
.table-box th{
	background-color: var(--main-color);
	color:#fff;
}
.table-box tr:nth-child(2n+1){
	background-color: #f5fbfa;
}
.table-box tr td{
	border:0px !important;
}

/*page-tab==============*/
.page-tab {
	position: sticky;
	padding: 0px;
	margin-bottom: 20px;
	z-index: 100;
	background-color: #d5efeb;
	/* border-bottom: 1px solid var(--main-color); */
  white-space: nowrap;
  overflow-x: auto;
}

 .page-tab span,
.page-tab a {
	padding: 6px 10px;
	display: inline-block;
	 margin: 5px; 
	/* background-color: var(--main-color);  */
	cursor: pointer;
	color: var(--main-color);
	border-radius: var(--small-radius5);
  font-family: var(--font-mon-regular);
}

.page-tab span:hover,
.page-tab a:hover,
.page-tab-choose {
	background-color:var( --main-yellow-color) !important;
	color: #000 !important;
  box-shadow: 0 0 6px rgba(0,0,0,0.4);
  /* font-family: var(--font-mon-regular); */
} 

.tab_nav {
  position: relative
}

.tab_nav span {
  margin-right: 5px;
  margin-top: 10px;
  padding: 5px 10px;
  display: inline-block;
  background-color:var(--light-gray-color);
  cursor: pointer;
  color: #000;
  font-family: var(--font-mon-regular);
  font-size:1.05rem;
}

.tab_nav span a {
  color: #fff
}

.tab_nav span:hover,
.tab_nav .tab_choosebg {
  background-color:var(--main-color);
  color: #fff
}

.tab_nav span:hover a,
.tab_nav .tab_choosebg a {
  color: #000
}

.tab_cont {
  padding: 10px 0px;
  position: relative;
  border-top: 1px solid #ccc;
  display: none
}
.tab_cont ul li{
  list-style: none;
}

.h_tit{
  display: flex;
  flex-direction: row;
  align-items: center;
  margin:15px auto;
  min-height:40px;
}
.h_tit img{
  width:40px;
  height:40px;
  margin-right:10px;
}

.h2_tit {
  position: relative;
  background-color: #f8f8f8;
  padding: 10px 5px 10px 10px;
  text-align: left;
  border-left: 8px solid var(--main-color);
  margin: 15px 0 !important;
}

.h3_tit {
  display: block;
  margin: 10px 0 !important;
  position: relative;
  padding-left: 20px
}

.h3_tit:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0px;
  width: 12px;
  height: 12px;
  background-color: #000
}
.ul-list-icon-1 {
  list-style: none !important;
  margin-left:0px;
  padding-left:0px;
}
.ul-list-icon-1 li{
  position: relative;
  padding-left:20px;
}
.ul-list-icon-1 li:before {
  content: "√";
  position: absolute;
   top: 0px;
  left: 0px;
  color:var(--main-color);
  font-size:14px;
  /* width: 12px;
  height: 12px;
  background-color: #000 ; */
}

.ul-list-icon-2{
  list-style: none !important;
  margin-left:0px;
  padding-left:0px;
}
.ul-list-icon-2 li{
  position: relative;
  padding-left:20px;
}
.ul-list-icon-2 li:before {
  content: "▲";
  position: absolute;
  top: 0px;
  left: 0px;
  color:var(--main-color);
  transform: rotate(90deg); 
  font-size:20px;
  /* width: 12px;
  height: 12px;
  background-color: #000 ; */
}

.list-icon-1 {
  display: block;
  position: relative;
  padding-left: 20px
}

.list-icon-1:before {
  content: "√";
  position: absolute;
   top: 0px;
  left: 0px;
  color:var(--main-color);
  /* width: 12px;
  height: 12px;
  background-color: #000 ; */
}


.h3_tit-2 {
  display: flex;
  align-items: center;
}
.h3_tit-2 img{
  margin-right:10px;
}
.flex-right{
  justify-content: flex-end;
}

.h4_tit {
  display: inline-block;
  padding-top: 12px;
  padding-bottom: 12px;
  margin-bottom: 10px !important;
  border-bottom: 1px solid #1856b2
}

.align-center{
  text-align: center;
}

.flex-align-center{
  align-items: center;
}
.flex-align-center img{
  max-width:100% !important;
  display: block;
  margin: auto;
  height:auto ;
  max-height:100%;
}


.inq-icon-btn{
  background-color:var(--main-color);
  color:#fff;
  padding:10px 20px;
  border-radius: var(--small-radius5);;
  margin: auto;
  cursor: pointer;
}
.inq-icon-btn:hover{
  background-color:var(--main-yellow-color);
  color:#000;
}

.tooltip-box {
  position: relative;
}

.tooltip-box .tooltip {
  display: none;
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(30, 30, 30, 1);
  color: #fff;
  padding: 5px 10px;
  border-radius: var(--small-radius5);
  white-space: wrap;
  width: 100%;
  font-size: 14px;
  text-align: left;
  line-height: 1.4em;
}

.tooltip-box .tooltip a {
  color: #f3e04e;
}

.tooltip-box .tooltip a:hover {
  color: #f3e04e;
  text-decoration: underline;
}

.tooltip-box:hover .tooltip {
  display: block;
  opacity: 1;
}

.tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  border-width: 8px;
  border-style: solid;
  border-color: rgba(30, 30, 30, 1) transparent transparent transparent;
  transform: translateX(-50%);
}


.Inquiry_success strong {
  display: inline-block;
  width: 22%;
}

.Inquiry_success li {
  padding-bottom: 5px;
  padding-top: 5px;
}

.box-1{
  margin-bottom:30px;
}
.box-1 img{
	max-width:100%;
	max-height:100%;
}


.q-a-area{
	padding:10px 0px;
}
.q-a{
	border:1px solid var(--main-color);;
		margin-bottom:15px;
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
}
.q-a strong{
	display: block;
	background-color: var(--light-green-color);
	padding:10px 40px 10px 10px;
	position: relative;

}
.q-a-content{
	padding:15px 0px 15px 15px;
	display: none;
}
.f_angle{
	transform: rotate(180deg)
		
}
.q-a-content .row{
	display: table;
	margin-top:20px;
	margin-bottom:20px;
	
}
.q-a strong i {
	position: absolute;
	display: inline-block;
	top:10px;
	right:15px;
}
.q-a .col-md-5{padding-left:0px;}
.q-a div[class*="col"]{
	padding-top:15px;
	padding-bottom:15px;
}

.pagebox{
	margin-bottom:30px;
}
.pagebox div[class*="col"]{
  padding:10px !important;
}
.pagebox-1{
	padding:20px;
	height:100%;
  background-color:var(--light-green-color);
  border-radius:var(--small-radius5);
  
}
.pagebox-1 .tit{
	text-align: center;
    margin-bottom:5px;
	color:var(--main-color);
  font-size:18px;
}
.pagebox-1 .pagebox-cont{
	margin-bottom:0px;
}


.ullist {padding:0px 0px 15px 19px;margin:0px;}
.ollist {padding:0px 0px 15px 19px;margin:0px;}

.ullist li{list-style: disc !important;}

.disc li{list-style: disc !important;}
.roman li{list-style: lower-roman !important;}
.decimal li{list-style: decimal !important;}
.greek li{list-style: lower-greek !important;}
.latin li{list-style: lower-latin !important;}
.upper-latin li{list-style: upper-latin !important;}

.Reference{padding-bottom:0px;font-size:14px !important;line-height:20px !important;color:#888888 !important; }
.Referencemargin{margin-top:0 !important;margin-bottom:0 !important;padding-bottom:0px !important;}
.Referencemargin strong{font-size:14px !important;}
.Referencemargin li{padding-bottom:8px !important;}

.tablecontentshow{margin:auto auto 15px auto;}
.tablecontentshow td{padding:5px;}
.tablecontentshow .servicetheadbg{ background-color:#1d3d6f;color:#ffffff;}
/*================== sevrvices paiban end ========*/

/*=========================
sevrvices end
=============================*/

  /*========product-list begin========*/    
  /*--------filter begin------------*/
  .filter-container {
	position: sticky;
	top: 80px;
	background-color: white;
	padding: 15px 0;
	z-index: 10;
	/* border-bottom: 1px solid #eee;
	margin-bottom: 20px; */
	font-size:14px;
}


.filter-item {
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 10px;
	position: relative;
}

.filter-search{
    width:300px;
    max-width:300px;
    padding: 5px 10px;
    border: 1px solid #ddd;
    border-radius: var(--small-radius5);
    display: inline-flex;
    align-items: center;
    gap: 5px;  
    transition: all 0.2s ease;
}
.filter-search-btn{
    background-color:var(--main-color);
    color:#fff;
    padding: 5px 15px;
    border: 0px solid #ddd;
    border-radius: var(--small-radius5);
    display: inline-flex;
    align-items: center;
    gap: 5px;  
    font-family: var(--font-mon-regular);
}
.filter-search-btn:hover,.filter-cle-btn:hover{
    background-color:var(--main-yellow-color);
    color:#000;
}
.filter-cle-btn{
    cursor: pointer;
    /* padding: 5px 15px; */
    /* border-radius: var(--small-radius5); */
    border: 1px solid #ddd;
    display: inline-flex;
    align-items: center;
    gap: 5px;  
    background-color:var(--main-color);
      color:#fff;
      width:38px;
      height:38px;
      border-radius: 38px;
      justify-content: center;
}

.filter-header {
	cursor: pointer;
	padding: 5px 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background-color: #e9fffd;
	transition: all 0.2s ease;
    color:#ccc;
}

.filter-header span{
	max-width:150px;
	overflow: hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
  margin-right:10px;
  color:#000;
}

.filter-header:hover {
	background-color:var(--main-color);
	border-color: var(--main-color);
    color:#fff;
}
.filter-header:hover i,.filter-header:hover span{
  color:#fff;
}


.filter-header i {
	font-style: normal;
	font-size: 12px;
	transition: transform 0.2s ease;
  position: relative;
  color:#000;
}
/* .filter-header i::before{
 content: "|";
 position: absolute;
 left:0px;
 top:0px;
 color:#ccc;
}
.filter-header:hover i::before{
  color:#fff;
} */

.filter-tags .filter-tags-unit{border:1px solid #efefef;margin-right:10px;padding:8px 30px 8px 8px;border-radius:5px; position: relative;}
.filter-tags .filter-tags-unit b.colosedtags{position: absolute;width:25px;height:100%;color:#ff0000;top:0px;right:0px;text-align: center; display: inline-flex; align-items: center; justify-content: center;}
.filter-tags .filter-tags-unit b.tagsname{display: inline-block;margin-right:5px;}

.filter-item.expanded .filter-header i {
	transform: rotate(180deg);
}


.filter-options {
	position: absolute;
	top: 100%;
	left: 0;
	background-color: white;
	border: 1px solid #ddd;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	padding: 10px;
	margin-top: 5px;
	width: 250px;
/* display: block;  */
    display: none;  
	z-index: 20;
	
}


.filter-item.expanded .filter-options {
	display: block;
	animation: fadeIn 0.2s ease;
}


.checkbox-option {
	display: flex;
	align-items: center;
	/* margin-bottom: 5px; */
	padding: 0px;
	border-radius: 2px;
	transition: background-color 0.2s;
}

.checkbox-option:hover {
	background-color: #f5f5f5;
}

.checkbox-option input[type="checkbox"] {
	margin-right: 5px;
	width: 16px;
	height: 16px;
	cursor: pointer;
}

.checkbox-option label {
	cursor: pointer;
	flex: 1;
	font-size: 12px;
}


@keyframes fadeIn {
	from { opacity: 0; transform: translateY(-5px); }
	to { opacity: 1; transform: translateY(0); }
}


.placeholder-content {
	height: 1000px;
	padding-top: 20px;
}

.placeholder-content p {
	margin-bottom: 16px;
	line-height: 1.6;
	color: #666;
}
  /*--------filter end------------*/

  .products-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin: 0 auto;
    padding:20px 0px;
  }
  

  .product-item {
    background: white;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
    width: 100%;
  }
  
  .product-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  }
  

  .product-header {
    padding: 15px 20px;
    border-bottom: 1px solid #eee;
  }
  
  .product-header span {
    font-size: 14px;
    color: #444;
    display: block;
    margin-bottom: 5px;
    font-family: var(--font-mon-regular);
    
  }
  
  .product-header h2 {
    font-size: 18px;
    color: var(--main-color);
    margin-bottom:0px;
    font-family: var(--font-mon-regular);
  }
  

  .product-content {
    display: flex;
    flex-direction: column;
  }
  

  .param-block, .image-block, .action-block {
    padding: 20px;
  }
  

  .param-list {
    list-style: none;
    padding-left:0px;
  }
  
  .param-list li {
    display: flex;
    margin-bottom: 3px;
    padding-bottom: 3px;
    border-bottom: 1px dashed #eee;
    font-size:14px;
    align-items: center;
    flex-wrap: wrap;
    
  }
  
  .param-list li:last-child {
    border-bottom: none;
  }
  
  .param-list li strong {
    display: inline-block;
    font-weight: bold;
    color: #333;
    padding-right:15px !important;
    flex: 1 1 180px;
    max-width: 180px; 
  }
  
  .param-list li .param-cont{
    flex: 1;
    min-width: 180px;
    display: flex;
    align-items: center;
  }
  @media (max-width: 768px) {
      
  .param-list li,.param-list li strong {
    display: block;
  }
  }
  .image-block img {
    max-width: 100%;
    height: auto;
    max-height: 200px;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  }
  


  .inquiry-link {
    display: block;
    width: 100%;
    padding: 4px 12px;
    text-align: center;
    background: var(--main-color);
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    margin-bottom: 10px;
    transition: background 0.3s ease;
  }
  
  .inquiry-link:hover {
    background: var(--main-yellow-color);
    color:#000;
  }
  
  .datasheet-link {
    display: block;
    width: 100%;
    padding:4px 12px;
    text-align: center;
    background: #e9fffd;
    color: #666;
    text-decoration: none;
    border-radius: 6px;
    transition: background 0.3s ease;
  }

  .datasheet-link i{color:#ff0000;}
  
  .datasheet-link:hover {
    background: #e0e0e0;
    color:#000;
  }
  

  @media (min-width: 768px) {

    .product-content {
      flex-direction: row;
    }
    
    .param-block {
      flex: 2; 
    }
    
    .image-block {
      flex: 1; 
      display: flex;
      align-items: center;
      justify-content: center;
    }
    
    .action-block {
      flex: 0 0 240px; 
      border-top: none;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
  }
  
  @media (min-width: 992px) {

    .param-block {
      flex: 2;
    }
    
    .image-block {
      flex: 1;
    }
  }
  .active>.page-link{
    border:1px solid var(--main-color);
    background-color:var(--main-color);
    color:#fff;
  }
  .page-link{
    color:var(--main-color);
  }
  .prodesc {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    background: white;
     font-size:14px;
}
.prodesc p{
  flex: 1 1 300px;
   min-width: 300px; 
}
  .prodescimg{
    flex: 1;
    width: 200px;
    height: 200px;
    border: 1px solid #ddd;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    object-fit: contain;
      overflow: hidden;
  }
  .prodescimg img{
    max-width:100%;
    height:100%;
  }



/*========product-list end========*/
/*=====================
product show begin
========================*/
/*-------------===========obes-product-header begin================------------------------*/
.obes-product-header {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	background: white;

	margin-bottom: 30px;
	 font-size:14px;
}
.obes-product-basic-info {
	flex: 1;
	min-width: 300px;
}

.obes-product-basic-info h1{
  border-bottom:1px solid #ccc;
  padding-bottom:10px;
}

.obes-product-image-container {
	width: 300px;
	height: 300px;
	background-color: #f1f1f1;
	border: 1px solid #ddd;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #999;
	object-fit: contain;
    overflow: hidden;
}
.obes-product-image-container img{
	max-width:100%;
	max-height:100%;
}
.obes-params-grid {
	display: grid;
	 grid-template-columns: repeat(1, 1fr);
	/* grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); */
	gap: 5px 15px;
}
.obes-action-buttons {
	margin-top: 20px;
	display: flex;
	gap: 15px;
	flex-wrap: wrap;
}
.obes-info-item {
	padding:8px 0;
	border-bottom:1px solid #f2f2f2;
    display: flex;
}

.obes-info-label {
	display: inline-block;
	max-width: 220px;
  min-width:220px;
  font-family: var(--font-mon-regular);
}

.obes-info-value .addbtn{
  display: inline-flex;
  color: white;
  align-items: center;
  background-color: var(--main-color);
  padding:0px 5px;
  border-radius: 5px;
  margin-left:20px;
  cursor: pointer;
}
.obes-btn {
	display: inline-block;
	padding: 5px 15px;
	background-color: var(--main-color);
	color: white;
	text-decoration: none;
	border-radius: 4px;
	font-weight: bold;
	transition: background-color 0.3s;
}

.obes-btn:hover {
	background-color:var(--main-yellow-color);
	color: white;
}

.obes-btn-inquiry {
	background-color: #e67e22;
}

.obes-btn-inquiry:hover {
	background-color:var(--main-blue-color);
	color: white;
}

.obes-info-down{
  margin-top:15px;
  border-top:1px solid #efefef;
  padding:15px 0;
}
.obes-info-down span.submit{
  background-color:#fafafa;
  color:#000;
  font-size:14px;
  border-radius: 0;
  margin-right:8px;
  border:1px solid #efefef;
}


@media (max-width: 992px) {
	.obes-product-image-container {
		width: 100%;
		max-width: 300px;
		margin: 0 auto;
	}
	
	.obes-params-grid {
		grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	}
}

@media (max-width: 768px) {
	.obes-params-grid {
		grid-template-columns: 1fr;
	}
	
	.obes-basic-info-grid {
		grid-template-columns: 1fr;
	}
	
	.obes-action-buttons {
		flex-direction: column;
	}
	.obes-info-item {
        display: block;
    }
	.obes-btn {
		width: 100%;
		text-align: center;
	}
	
	.obes-page-title {
		font-size: 1.5rem;
	}
	
	.obes-main-product-title {
		font-size: 1.4rem;
	}
  .obes-info-label{
    width:100%;
    display: block;
  }
}

@media (max-width: 480px) {
	.obes-content-section, .obes-product-header {
		padding: 15px;
	}
    .obes-info-item {
        display: block;
    }
	.obes-section-title {
		font-size: 1.2rem;
	}
	
	/* .obes-info-label {
		min-width: 150px;
	} */
}

.obes-product-basic-info .submit {
  display: inline-block;
  text-align: center;
  padding: 0.5em 1.5em 0.5em 1.5em;
  clear: both;
  color: #fff;
  text-decoration: none;
  background-color:var(--main-color);
  border: 0px;
  cursor: pointer;
  border-radius:5px;
  margin-right:20px;
  font-size:16px;
  margin-bottom:10px;
}
.obes-product-basic-info .submit a{
  color:#fff;
}
.obes-product-basic-info .submit:hover a{
  color:#000;
}

.obes-product-basic-info .submit:hover {
  background:var(--main-yellow-color);
  transition: background-color .3s;
  color: #000;
}

.obes-product-basic-info .submit.datasheetbtn{
  background:var(--main-yellow-color);
  color: #000;
}
.obes-product-basic-info .submit.datasheetbtn a{
  color:#000;
}
.obes-product-basic-info .submit.datasheetbtn:hover{
  background-color:var(--main-color);
  color: #fff;
}
.obes-product-basic-info .submit.datasheetbtn:hover a{
  color: #fff;
}
.ahbutton {
  padding: 5px 20px;
  display: inline-block;
  background-color: var(--main-color);
  cursor: pointer;
  color: #fff;
  border-radius: var(--small-radius5);;
  border:0px;
}

.ahbutton:hover {
  background-color:var(--main-yellow-color);
  color:#000;
}

.related{
  padding:20px 0px;
  display: block;
}
.related-list{
  padding-left:0px;
}
.related-list li{
  margin:0px;
  padding:8px 0px;
  list-style: none;
  border-bottom:1px solid #efefef;
}

/*-------------==============obes-product-header end=============------------------------*/
/*==================
product show end
==================*/

.box-about{
  position: relative;
  border-bottom:1px solid #ccc;
  padding-bottom:20px;
  margin-bottom:30px;
}
.box-about h2{
  min-height:100px;
}
.box-about .pagerow_pt_unit img{
 object-fit: cover;
 width:100%;
 height:100%;
}

.box-about-why{
  border-top:1px solid #ccc;
  position: relative;
  padding-top:30px;
  margin-top:30px;
}

.features-container {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  width: 100%;
  margin:30px auto;
}

.feature-card {
  flex: 1;
  min-width: 350px;
  padding: 1.5rem;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
}

.feature-card:hover {
  transform: translateY(-5px);
}

.feature-icon {
  width: 40px;
  height: 40px;
  margin-bottom: 1rem;
  fill: var(--main-color);
}

.feature-title {
  font-size: 1.2rem;
  margin-bottom: 0.8rem;
}

.feature-description {
  line-height: 1.5;
}

@media (max-width: 768px) {
  .features-container {
      flex-direction: column;
  }
  
  .feature-card {
      min-width: 100%;
  }
}