/* CSS Document */

body {	-webkit-text-size-adjust:100%; text-align:center; font-family:'Lato', sans-serif; overflow-x: hidden;}
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; 
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { margin:0; padding:0; list-style:none;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

.content-Box { max-width:1100px; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { font-size: 16px; line-height: 26px; color: #333; padding-top: 129px; letter-spacing: 0.1rem;}
#content p{ padding-bottom: 40px;}

.banner { margin-bottom: 25px; background: url(../images/banner-bg.jpg) no-repeat top center; background-size: cover; height: 306px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center;}
.banner h1{ color: #fff; font-size: 42px; line-height: 100%;}

#path { padding: 0 0 30px 0; }
#path li { display: inline-block; vertical-align: top; font-size: 15px;}
#path li:after { content:"/"; display: inline-block; vertical-align: top; padding: 0 0 0 4px;}
#path li:last-child { pointer-events: none;}
#path li:last-child:after { display: none;}
#path li a { color: #333333;}
#path li a:hover { opacity: 0.6;}



.pro-list { display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 65px;}
.pro-list > div { width: 50%; padding-bottom:40px;}
.pro-list > div:hover img { transform: scale(1.05);}
.pro-list > div:hover .pro-list-name { color: #0068b7;}
.pro-list-pto { line-height: 0; overflow: hidden; margin-bottom: 15px;}
.pro-list-pto img { width: 100%;transition: all 0.4s ease-out 0s;}
.pro-list-name { color: #000000; font-size: 22px; padding:0 20px;}

/*products-list*/
.products-list-section { display: flex; flex-direction: row; flex-wrap: wrap;}
.products-list-section > div:nth-of-type(1) { width: 214px; background: #f3f3f3; padding: 20px 20px 0 20px;}
.products-list-section > div:nth-of-type(2) { width: calc(100% - 214px); padding-left: 50px;}

aside { }
.side_classLink { }
.side_classLink > ul { }
.side_classLink > ul > li { }
.side_classLink > ul > li > a{ display:block; color: #333333; font-size: 17px; line-height: 120%; padding: 0 0 10px 0; margin-bottom: 15px; font-weight: bold; border-bottom: 4px solid #e6e6e6;}
.side_classLink > ul > li > a:hover, .side_classLink > ul > li > a.current { color:#0068b7;}
.side_classLink > ul > li > ul {padding: 0 0 16px 0;}
.side_classLink > ul > li > ul > li > a { display: block; font-size: 15px; color: #333333; line-height: 120%; padding-bottom: 15px;}
.side_classLink > ul > li > ul > li > a:hover, .side_classLink > ul > li > ul > li > a.current { color: #0068b7;}
.side_classLink > ul > li.current02{ display:none; }
.m_classLink{ display:none;}

.p-list { padding: 0px 0 35px 0; display: flex; flex-direction: row; flex-wrap: wrap;}
.p-list > div { width:33.33%; padding: 0 18px 36px 18px; text-align: center;margin-bottom: 50px;}
.p-list > div:hover img { transform: scale(1.05);}
.p-list > div:hover .p-list-name { color: #0068b7;}
.p-list-pto { line-height: 0; overflow: hidden; margin-bottom: 20px;}
.p-list-pto img { width: 80%;transition: all 0.4s ease-out 0s; aspect-ratio: 3/4; object-fit: contain;}
.p-list-name { color: #000000; font-size: 18px; font-weight: bold; text-align: center;padding: 12px 5px;border-top:4px solid #0068b7;position: relative;}
.p-list-name::before{content:'';display: block;width: 0;height: 0;border-width: 10px 10px 0 10px;border-color: #0068b7 transparent transparent transparent;
border-style: solid;position: absolute;left: 45%;top: 0;}
.p-list-btn { display: block; font-size: 15px; color: #0068b7;}
.p-list-linkBox{}
.p-list-linkBox ul{display: flex;align-items: center;justify-content: center;}
.p-list-linkBox ul li{display: inline-block;width:50%;padding: 3px 5px;font-size: 14px;}
.p-list-linkBox ul li:nth-child(1){background:#0068b7;}
.p-list-linkBox ul li:nth-child(1) a{color:#fff;}
.p-list-linkBox ul li:nth-child(1) a::before{content:"\f022";font-family: 'Font Awesome 5 Free';font-weight: 900;color:#fff;padding-right: 3px;}
.p-list-linkBox ul li:nth-child(2){background:#e6e6e6;}
.p-list-linkBox ul li:nth-child(2) a{color:#333;}
.p-list-linkBox ul li:hover{background: #4cb8fc;}
.p-list-linkBox ul li:hover a{color:#fff;}
#page { text-align: center; padding-bottom:60px;}
#page a { width: 34px; line-height: 34px; text-align: center; color: #333333; font-size: 17px; font-weight: bold; background: #ddd; margin: 0 3px 6px 3px; display: inline-block; border-radius: 100%;}
#page a:hover, #page a.current { color: #fff;background: #0068b7;}

/*products-detail*/
.products-detail-section { display: flex; flex-direction: row; flex-wrap: wrap; padding-bottom: 65px;}
.products-detail-section > div { width: 50%;}

.loop .owl-dots { }
.loop .owl-nav { position: absolute; top:calc(50% - 50px); width: 100%; z-index: 11;}
.loop .owl-prev, .loop .owl-next { position:absolute; z-index:100; top:calc(50% + 20px); background:none !important;}
.loop .owl-prev { left:10px; }
.loop .owl-next { right:10px;}
.loop .owl-prev:before, .loop .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:60px; color: #fff; opacity: 0.3;transition: all 0.4s ease-out 0s;}
.loop .owl-prev:before { content:"\f104"; }
.loop .owl-next:before { content:"\f105"; }
.loop .owl-prev:hover:before, .loop .owl-next:hover:before { opacity: 1;}
.loop .owl-stage-outer {z-index: 2;}
.loop .owl-dots { position: absolute; z-index: 100; bottom: 0px; width: 100%; text-align: center !important; padding: 0 50px; }
.loop .owl-dots .owl-dot span, .loop  .owl-dots .owl-dot span { background: #646464 !important; width: 13px !important; height: 13px !important;}
.loop .owl-dots .owl-dot.active span, .loop  .owl-dots .owl-dot:hover span { background: #1a93d8 !important; }

.loop .owl-item { text-align: center;}
.loop .owl-item img { width: inherit !important; display: inline-block !important;}

.title01 { padding: 0 0 18px 40px; color: #0068b7; font-size: 17px; font-weight: bold; position: relative;}
.title01 i { display: inline-block; position: absolute; left: 0; top: 2px; font-size: 24px;}

.btn-box { display: flex; flex-direction: row; flex-wrap: wrap;}
.btn-box a { display: inline-block; margin: 0 3px 3px 0; text-align: center; width: 200px; line-height: 38px;color: #fff; font-size: 16px; background: #5493b3;}
.btn-box a:nth-of-type(2) { background: #547cb3;}
.btn-box a:hover { opacity: 0.6;}
.btn-box a i { display: inline-block; margin-right: 5px; vertical-align: middle; font-size: 22px; position: relative; top:-1px;}

/*inquiry*/
.inquiry_page{padding: 2vh 0;}
.cart-img{}
.cart-img img{width:30%;}
.inquiry_page a{color:#333;}
.inquiry_list{margin-bottom: 30px;border-bottom: 3px solid #ccc;padding-bottom: 30px;}
.inquiry_page .delete::before {content: '\f2ed';display: block;font-family: 'Font Awesome 5 Free';font-weight: 900;font-size: 14px;color: #333;}
.cart-table td input {border: 1px solid #ccc;width: 80px;text-align: center;padding: 5px;}
.inquiry_data form{margin: 15px 0;}
.inquiry_data form input[type="text"],.inquiry_data form input[type="tel"],.inquiry_data form input[type="phone"],.inquiry_data form input[type="email"],.inquiry_data form textarea{font-size: 16px;border-width: 0 0 1px 0;border-style: solid;border-color: #cccccc;margin: 0px 0 0 0;width: 100%;
padding: 15px 5px;color: #333;background: none;font-family: 'PT Sans', sans-serif;letter-spacing: 1px;}
.inquiry_data form select{margin: 0px 0 0 0; min-width: 80px; width:100%; background-image: url(../images/product-select.png); background-repeat: no-repeat; background-position: 100% 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none;   margin-right:4px; background-color: transparent; font-size: 16px; border-width:0 0 1px 0; border-style: solid; border-color: #cccccc; mwidth: 100%; color:#333; font-family: 'PT Sans', sans-serif; height: 54.5px; padding: 0 5px;  letter-spacing: 1px;}
.inquiry_data .contact-btn input[type=button]{padding: 0;margin-top: 22px;}

/*news*/
.news-list { display: flex; flex-direction: row; flex-wrap: wrap; padding-bottom: 40px;}
.news-list > div { width: 25%; box-shadow: 0 0 1px rgba(0,0,0,0.2); transition: all 0.4s ease-out 0s; background: #fff;}
.news-list > div:hover { transform: scale(1.07); box-shadow: 0 0 12px rgba(0,0,0,0.05);}
.news-content { display: flex; flex-direction:column; flex-wrap: nowrap;}
.news-pto { line-height: 0;}
.news-pto img { width: 100%;}
.news-data { padding: 30px 24px; color: #222222; font-size: 16px; line-height: 130%; text-align: left;}
.news-data span { font-size: 14px; color: #ed1b23;  padding-bottom: 4px; display: block;}
.news_detail{padding: 2vh 0;}
.news_detail_top{border-bottom: 2px solid #ccc;margin-bottom: 30px;}
.news_title{font-size: 30px;color: #2368b7;margin-bottom: 10px;}
.news_detail .news-data{padding: 10px 0;}
.news_btn{display: block;width: 95px;height: 95px;border-radius: 100%;text-align: center;padding-top: 34px;color: #ffffff;font-size: 15px;
font-weight: bold;background: #0068b7;margin: 15px auto;}
.news_btn:hover{opacity: .6;}
/*download*/
.download-spec { border-spacing: 1px; width: 100%;color: #333333; margin-bottom: 60px;}
.download-spec th { padding: 30px 20px; border-top:4px solid #dcdcdc; font-size: 16px; text-align: center; border-bottom: 1px solid #ebebeb; position: relative;}
.download-spec th:after { content: ""; position: absolute; width: 1px; height: 29px; background: #ebebeb; top:40px; right: 0px;}
.download-spec th:last-child:after { display: none;}
.download-spec th:first-child { border-top-color: #0068b7;}
.download-spec td { font-size: 16px; padding: 30px 20px; text-align: center;border-bottom: 1px solid #ebebeb;}
.download-spec td a { color: #a7abaf; font-size: 20px;}
.download-spec td a:hover { color: #000;}
.download-spec tr { transition: all 0.4s ease-out 0s;}
.download-spec tr:hover { background: #F4F4F4;}
.download-spec tr:first-child:hover { background: #fff;}
.align-left { text-align: left !important;}

/*contact*/
.contact-main {padding: 0 0px; margin-bottom: 50px; display: flex; flex-direction: row; flex-wrap: wrap; color: #333; flow-size: 16px;}
.contact-main > div:first-child { width: 45%;}
.contact-main > div:last-child { width: 55%; padding-left: 64px;} 
.contact-main input[type="text"], .contact-main input[type="number"], .contact-main input[type="tel"], .contact-main input[type="phone"],.contact-main input[type="date"],.contact-main input[type="email"],.contact-main input[type="password"],.contact-main input[type="button"], .contact-main textarea,.contact-btn input[type=submit],.contact-btn input[type=reset] { font-size: 16px; border-width:0 0 1px 0; border-style: solid; border-color: #cccccc; margin: 0px 0 0 0; width: 100%; padding: 15px 5px; color:#333; background: none; font-family: 'PT Sans', sans-serif; letter-spacing: 1px; }
.contact-main textarea { height:135px; padding:10px 5px; letter-spacing: 1px;}
.contact-main select{  margin: 0px 0 0 0; min-width: 80px; width:100%; background-image: url(../images/product-select.png); background-repeat: no-repeat; background-position: 100% 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none;   margin-right:4px; background-color: transparent; font-size: 16px; border-width:0 0 1px 0; border-style: solid; border-color: #cccccc; mwidth: 100%; color:#333; font-family: 'PT Sans', sans-serif; height: 54.5px; padding: 0 5px;  letter-spacing: 1px;}
.contact-main option { padding:1px 5px;}
.contact-main select::-ms-expand {
    display: none;
}
.contact-map iframe { width: 100%; border-width: 0; height:580px; box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1);margin-bottom: 35px;}
.contact-map a { color: #333;}
.contact-form-3 { margin-right: -10px; display: flex; flex-direction: row; flex-wrap: nowrap;}
.contact-form-3 > div {margin-right: 10px;}
.contact-form-3 > div:nth-of-type(1), .contact-form-3 > div:nth-of-type(2) { width: calc((100% - 126px) / 2);}
.contact-form-3 > div:nth-of-type(3) { width: 126px;}
.google-machine { margin:24px 0 28px 0;}
.contact-btn { text-align: right;}
.contact-btn input[type=button],.contact-btn input[type=submit],.contact-btn input[type=reset]{display: inline-block; margin-left: 22px; width: 95px; height: 95px; border-radius: 100%; text-align: center; padding-top: 20px; color: #ffffff; font-size: 15px; font-weight: bold; background: #c4c4c4;}
.contact-btn input[type=button]:hover,.contact-btn input[type=submit]:hover,.contact-btn input[type=reset]:hover{ opacity: 0.6;}
.contact-btn input[type=button]:first-child,.contact-btn input[type=submit]{ background: #0068b7;}

/*company*/
.company-list { }
.company-list > div { margin-bottom: 205px;}
.company-content { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-end;}
.company-content > div:nth-of-type(1) { width: 100%; height: 500px; background-size: cover; background-position: center center; margin: 0 auto 0 0;}
.company-content > div:nth-of-type(1) img { display: none;}
.company-content > div:nth-of-type(2) { position: absolute; z-index: 2; width: 600px; right: 0%; background: rgba(255,255,255,.95); box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2); padding: 45px; font-size: 16px; line-height: 150%; margin-bottom: -120px;}
.company-title { padding-bottom: 45px; font-size: 40px; line-height: 140%;}

@media only screen and (max-width: 980px) {
	#content { padding-top: 80px;}
	#content p{ padding-bottom: 30px;}
	
	.banner { height: 180px;}
	.banner h1{ font-size: 28px;}
	
	.main-box { padding: 0 30px;}
	#path { padding-bottom: 15px;}
	#path li { font-size: 13px;}
	
	.products-list-section > div:nth-of-type(1) { width: 100%; background: none; padding: 0; margin-bottom: 20px;}
	.products-list-section > div:nth-of-type(2) { width: 100%; padding-left: 0px;}
	
	.side_classLink { display:none;}
	.m_classLink{ display:block; position:relative; border-bottom:1px solid #D6D6D6;}
	.m_classLink a.main{ display:block; font-size:17px; position:relative; padding: 9px 15px 9px 15px; color:#fff; text-align:left; cursor:pointer; background:#2e4c80;}
	.m_classLink a.main i{ display:block; font-size:20px; position:absolute; right:20px; top:50%; margin-top:-11px; color:#fff; font-style:normal; font-family: 'Font Awesome 5 Free';font-weight: 900;}
	.m_classLink > ul{ display:none; width:100%;  position:absolute; z-index:5; background:#fff; border-width:0 4px 4px 4px; border-color:#2e4c80; border-style:solid; padding: 20px; }
	.m_classLink > ul > li { }
	.m_classLink > ul > li > a{ display:block; color: #333333; font-size: 17px; line-height: 120%; padding: 0 0 10px 0; font-weight: bold; border-bottom: 4px solid #e6e6e6; margin-bottom: 15px;}
	.m_classLink > ul > li > a:hover, .m_classLink > ul > li > a.current { color:#0068b7;}
	.m_classLink > ul > li > ul {padding: 0 0 16px 0;}
	.m_classLink > ul > li > ul > li > a { display: block; font-size: 15px; color: #333333; line-height: 120%; padding-bottom: 15px;}
	.m_classLink > ul > li > ul > li > a:hover, .m_classLink > ul > li > ul > li > a.current { color: #0068b7;}
	.m_classLink > ul > li.current02{ display:none; }
	
	.products-detail-section > div { width: 100%;}
	.products-detail-section > div:nth-of-type(1) { margin-bottom: 35px;}
	
	.news-list > div { width: 50%; }
	
	.contact-main {width: 100%; padding: 20px 0;}
	.contact-main > div:first-child { width: 100%; margin-left: 0px; margin-top: 50px; order: 2;}
	.contact-main > div:last-child { width: 100%; padding-left: 0px; order: 1;} 
	
	
	.company-list > div { margin-bottom: 40px;}
	.company-content { flex-direction: column;}
	.company-content > div:nth-of-type(2) {margin-bottom: 0;}
	.company-content > div:nth-of-type(1) { height: auto; width: 100%; background: none;}
	.company-content > div:nth-of-type(1) img { display: block;}
	.company-content > div:nth-of-type(2), .company-list > div:nth-child(even) > div:nth-of-type(2) { width: 100%; position: inherit; padding: 30px 20px;}
}


@media only screen and (max-width: 768px) {
	.pro-list { margin-bottom: 40px;}
	.pro-list > div { width: 100%;}
	.pro-list-name { font-size: 18px; padding: 0;}
	
	.p-list > div { width:50%;}
	.p-list-name { font-size: 18px;}
	
	.download-spec th { display: none;}
	.download-spec td { display: list-item; text-align: left; padding: 10px 15px;}
	.download-spec td:nth-of-type(1), .download-spec td:nth-of-type(2) { border-width: 0;}
	.download-spec td:nth-of-type(1):before, .download-spec td:nth-of-type(2):before, .download-spec td:nth-of-type(3):before { display: block; color: #C8C8C8;}
	.download-spec td:nth-of-type(1):before { content: "File name";}
	.download-spec td:nth-of-type(2):before { content: "Latest Update";}
	.download-spec td:nth-of-type(3):before { content: "Download";}
	
	.contact-form-3 { flex-direction: column; margin-right: 0;}
	.contact-form-3 > div { width: 100% !important;}
	.contact-btn { text-align: center;}
	.contact-btn input[type=button],.contact-btn input[type=submit],.contact-btn input[type=reset]{display: inline-block; margin:0 11px; }
}
@media only screen and (max-width: 640px) {
	
}
@media only screen and (max-width: 570px) {
	.news-list > div { width: 100%; }
	.p-list > div {width: 100%;}
	.cart-img img{width:100%;}
}

@media only screen and (max-width: 414px) {

}

@media only screen and (max-width: 320px) {

}
