@font-face{font-family:"BankGothic";src:url("fonts/bankgotm.ttf")format("TrueType");font-weight:400;font-display:swap}
@font-face{font-family:"roboto";src:url("fonts/roboto-regular.ttf")format("TrueType");font-weight:400;font-display:swap}
@font-face{font-family:"roboto";src:url("fonts/roboto-bold.ttf")format("TrueType");font-weight:700;font-display:swap}
@font-face{font-family:"roboto";src:url("fonts/roboto-bolditalic.ttf")format("TrueType");font-weight:700;font-display:swap;font-style:italic;}
@font-face{font-family:"roboto";src:url("fonts/roboto-italic.ttf")format("TrueType");font-weight:400;font-display:swap;font-style:italic;}


:root{
	--burger:#174EA2;
	--blue:#174EA2;
	--blue-bg:#f0f8ff;
	--orange:#F68A4D;
	--green:#009356;
	--black:#090909;
	--grey-light:#f9f9f9;
}

html, body { font-family: roboto, sans-serif; font-size:18px; line-height:1.5em; }
/* body { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } */
.container .boundary {width:96%; max-width:1200px;}
h1, h2, h3, h4 { font-family:BankGothic, sans-serif; font-weight:normal; }

a {color:inherit;}

.breadcrumb { margin-top:40px!important; max-width:1200px; margin-left:auto; margin-right:auto; line-height:1.5em; }
.breadcrumb li { color:var(--blue); display:inline; font-size:0.8em; }
.breadcrumb li a { color:inherit; text-transform:uppercase; }
.breadcrumb li a:hover { color:#333; }

.banner { position:relative; margin-top:0; box-shadow: 0 5px 5px #DDD; }
.banner:before { content:""; display:block; }
.banner:before, .banner .owl-carousel .square-image:before { padding-top:38%; }
.banner .owl-carousel {position:absolute; top:0; left:0; width:100%; }
.banner .owl-carousel button { position:absolute; top:50%; left:5px; transform:translateY(-50%); color:#FFF!important; text-shadow:0 0 5px #000; }
.banner .owl-carousel button.owl-next {left:unset; right:5px;}
.banner .owl-carousel button i { font-size:1.5em; }

.top-menu { position:relative; background-color:#FFF; color:#000; height:60px; box-shadow:0 2px 5px #666; z-index:99999; border-top:1px solid #DDD; }
.top-menu .top-menu-logo { width:auto; height:50px; display:inline-block; margin-top:5px; position:relative; z-index:99999; }
.top-menu .top-menu-logo img {width:auto; height:100%; }
.top-menu .top-menu-logo .top-menu-logo-content { display:inline-block; width:auto; vertical-align:top; line-height:1.3em; font-size:.8em; font-family:BankGothic, sans-serif; margin-top:5px; margin-left:10px; }
.top-menu .hamburger { float:right; line-height:60px; margin-right:10px; z-index:4; position:relative; }

.top-menu .top-menu-bg { background-color:#FFF; z-index:3; position:absolute; top:0; left:0; width:100%; height:100%; }
.top-menu .top-menu-content { position:absolute; display:block; width:100%; height:auto; top:-120vh; left:0; background-color:#FFF; margin:0; padding:30px 10px; box-sizing:border-box; z-index:2; color:#333; list-style-type:none; transition:all 0.3s; box-shadow:0 0 3px #333; }
.top-menu .top-menu-content.active { top:100%; box-shadow:0 5px 5px #666; border-top:1px solid #DDD; }
.top-menu .top-menu-content li { border-bottom:1px solid #DDD; position:relative; }
.top-menu .top-menu-content li.sub-menu .icon-cheveron-right { display:inline-block; position:absolute; width:25px; height:25px; line-height:25px; top:5px; right:5px; background-color:#DDD; color:#666; border-radius:100%; text-align:center; }
.top-menu .top-menu-content li.active .icon-cheveron-right { transform:rotate(90deg); }
.top-menu .top-menu-content li a { display:block; width:100%; height:auto; line-height:1.5em; padding:7px 0; }
.top-menu .top-menu-content li.active > a { color:var(--blue-ex-light); }
.top-menu .top-menu-content li ul { list-style-type:none; padding: 0 0 0 20px; display:none; }
.top-menu .top-menu-content li ul li { font-size:1.1rem; border-bottom:unset; color:#666; font-weight:normal; }
.top-menu .top-menu-content li.active ul { display:block; }
.top-menu .top-menu-content li ul li ul { padding:0; }
.top-menu .top-menu-content li ul li ul li { font-size:0.8em; }
.top-menu .top-menu-content li ul li ul li a:before { content:"- "; }


.container .container-title { display:inline-block; width:auto; padding:0 20px; color:var(--blue); position:relative; margin:0 0; font-size:1.3em; height:30px; line-height:30px; border:1px solid var(--blue); border-radius:5px; overflow:hidden; border-bottom-width: 5px; border-bottom-color: var(--orange); }
.container .container-title a { position:absolute; top:calc(100% + 3px); right:10px; z-index:0; font-family:roboto; font-size:0.5em; background-color:var(--blue-bg); color:#000; border-bottom-left-radius:5px; border-bottom-right-radius:5px; padding:0 5px; box-shadow:0 0 3px #333; }
.container .container-title:hover a { background-color:var(--blue-ex-light); color:#FFF; }

.introduction, .news, .qa, why-us { margin:50px 0; font-size:16px; line-height:1.3em; }

.introduction .table .col, .qa .table .col { text-align:left; }
.introduction .square-image { margin: -50px 0 0 -10px; position: relative; z-index: -1; }

.news.products { padding:30px 0; background-color:#FFF; margin-bottom:-30px; }

.qa { background-color:var(--blue-bg); margin-top:0; }
.qa .boundary { position:relative; z-index:1; }
.qa .table { margin-top:-12px; }
.qa .container-title { margin-top:0; background-color:#FFF; }
.qa ul { list-style-type:none; margin:20px 0; padding:0; }
.qa ul li { padding:10px 0; }
.qa ul li:before { font-family: 'icomoon' !important; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content:"\e952"; color:var(--blue); display:inline-block; margin-right:10px; font-size:1.2em; vertical-align:middle; }
.qa ul li i { transform:rotate(90deg); display:inline-block; }
.qa ul li:hover a { color:var(--orange); }
.qa ul li .qa-answer { display:none; padding-left:32px; box-sizing:border-box; margin-top:10px; }
.qa ul li .qa-answer a { color:var(--blue); display:inline-block; font-size:0.7em; padding:2px 10px; background-color:var(--blue); border-radius:10px; color:#FFF; line-height:1.5em; }
.qa ul li .qa-answer a:hover { background-color:var(--orange); }

.qa form { margin-bottom:20px; padding:10px 0; background-color:var(--blue); color:#FFF; text-align:center; border-radius:10px; }
.qa form hr { background-color:#FFF; height:1px; border:0; }
.qa form .textbox { width:90%; border-radius:5px; }
.qa form .button { border-radius: 30px; padding:5px 30px; margin:10px 0 0; font-size:0.9em; }

.why-us .table { margin-top:20px; }
.why-us .table .col { display:inline-block; width:49%; margin:0 2% 20px 0; font-size:0.8em; line-height:1.3em; }
.why-us .table .col:nth-child(2n+0) { margin-right:0; }
.why-us .table .col i { color:#FFF; text-shadow:1px 0 #333, -1px 0 #333, 0 1px #333, 0 -1px #333, 1px 1px #333, -1px -1px #333, 1px -1px #333, -1px 1px #333; }
.why-us .table .col:first-child i { font-size:3.8em; color:#333; text-shadow:unset; margin:-7px 0 -7px; display:inline-block; }
.why-us i { font-size:3em; }
.why-us strong { display:block; color:var(--blue); margin:5px 0; }

.news-group { background-color:var(--grey-light); padding:30px 0; z-index:-1; position:relative; }
.news-group .news:first-child { margin-top:0; }
.news .container-title { margin-bottom:20px; }
.news .news-content { margin-top:20px; }
.news .news-item { margin-bottom:10px; }
.news .news-item .square-image { border-radius:10px; box-shadow:0 0 3px #DDD; }
.news .news-item .square-image:before { padding-top:52.333%; }
.news .news-item .news-item-title { padding:20px 10px; }
.news .news-item .news-item-title a, .news .news-item .news-item-title span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; color:var(--blue); font-weight:bold; }
.news .news-item .news-item-title span { -webkit-line-clamp:4; color:#000; font-weight:normal; }
.news .news-item .news-item-title:hover a { color:var(--blue-ex-light); }
.news .news-item .news-item-title span a, .news .news-item .news-item-title:hover span a { color:#000; margin-bottom:10px; }
.news .news-item .news-item-title span a { font-weight:normal; font-size:0.8em; margin-top:5px; }
.news .news-item .news-item-title span a:hover { color:var(--blue); }
.news .news-item .news-item-title span a i { display:inline-block; margin-right:5px; margin-top:2px; vertical-align:top; }
.news .news-item .square-image img { z-index:2; }
.news .news-item .square-image:after { position: absolute; top: 0; left: -75%; z-index: 10; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%); background: linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); transition:all 0.5s; }
.news .news-item:hover .square-image:after { left:120%; }

.news.products .news-item { width:100%!important; }

.gallery .square-image:before { padding-top:52.333%; }
.gallery .owl-dots, .news.products .owl-dots { text-align:center; }
.gallery .owl-dots .owl-dot, .news.products .owl-dots .owl-dot { display:inline-block; background-color:#999; border-radius:100%; width:10px; height:10px; margin:0 3px; }
.gallery .owl-dots .owl-dot.active, .news.products .owl-dots .owl-dot.active { background-color:var(--blue); }

.footer { margin-top:50px; background-color:var(--blue); color:#FFF; }
.footer a:hover { color:var(--blue-ex-light); }
.footer .boundary { padding:50px 0; }
.footer h1 { font-family:roboto; line-height:1.5em; font-size:1.5em; font-weight:bold; text-align:center; }

.footer .footer-logos { text-align:center; width:150px; display:inline-block; margin:0 auto;  }
.footer .footer-logos img { width:100%; height:auto; }

.footer .footer-menu { text-align:left; border-top:1px solid #FFF; margin-top:30px; }
.footer .footer-menu h3 { font-family:roboto; margin:30px 0 0; font-weight:bold; }
.footer .footer-menu ul { list-style-type:none; padding:0; }
.footer .footer-menu ul li:before { content:"- ";}

.footer .table .footer-social { margin-top:20px; border-top:1px solid #FFF; padding-top:10px; }
.footer .table .footer-social [class^='icon-'] { display:inline-block; margin:15px 5px; font-size:1.2em; }

.copyright { font-size:0.8em; background-color:var(--blue); color:#FFF; border-top:1px solid #FFF; }
.copyright .boundary { text-align:center; line-height:1.3em; padding:10px 0; }
.copyright span { display:block; }

@media (min-width:576px){
	
	.banner { margin-top:0; }
	.banner:before, .banner .owl-carousel .square-image:before { padding-top:32.89%; }
	
	
	.why-us .table { margin-top:30px; }
	
	.news .news-item { vertical-align:top; display:inline-block; width:49%; margin:0 2% 15px 0; }
	.news .news-item:nth-child(2n+0) { margin-right:0; }
}

@media (min-width:768px){
	.banner .owl-carousel .owl-nav button i{font-size:2.5em;}
	
	.top-menu .hamburger { display:none; }
	.top-menu .top-menu-logo { float:left; }
	.top-menu .top-menu-logo .top-menu-logo-content { display:none; }
	.top-menu .top-menu-bg { display:none; }
	.top-menu .top-menu-content { top:unset!important; left:unset!important; position:relative; box-shadow:unset!important; padding:0!important; background:unset!important; display:inline-block; width:auto; vertical-align:top; line-height:30px; margin:15px 0 0 10px; transition:unset!important; }
	.top-menu .top-menu-content li { display:inline-block; width:auto; font-size:0.65em; border:0; padding:0 5px; line-height:30px; vertical-align:top; box-sizing:border-box; position:relative; }
	.top-menu .top-menu-content li a { display:inline-block; vertical-align:middle; width:auto; color:var(--blue); }
	.top-menu .top-menu-content li ul a, .top-menu .top-menu-content li.active ul a { color:#000; }
	.top-menu .top-menu-content li.active { background-color:var(--orange); border-radius:5px; }
	.top-menu .top-menu-content li.active a { color:#FFF; }
	.top-menu .top-menu-content li ul { position:absolute; top:100%; left:0; background-color:#FFF; box-shadow: 0 0 3px #999; padding:10px; min-width:100%; padding:0; }
	.top-menu .top-menu-content li ul li { white-space:nowrap; font-size:1.3em; width:100%; }
	.top-menu .top-menu-content li ul li:hover { background-color:unset; }
	.top-menu .top-menu-content li ul li:hover a { color:var(--blue); }
	.top-menu .top-menu-content li.active ul { display:none;  }
	.top-menu .top-menu-content li.sub-menu .icon-cheveron-right { position:relative; background:unset; width:auto; height:auto; vertical-align:top; line-height:1em; top:unset; right:unset; margin-left:5px; color:#333; vertical-align:middle; }
	.top-menu .top-menu-content li.sub-menu .icon-cheveron-right { transform:rotate(90deg); }
	
	
	.introduction .square-image { margin: 20px 0 0 -20px; }
	
	.qa form { margin:40px 0 0; }
	
	.why-us { padding-bottom:40px; }
	.why-us .table { margin-top:40px; }
	.why-us strong { margin:15px 0; }
	
	.footer .table .col { text-align:left; }
	.footer .table .footer-social { border-top:0; }
	.footer .footer-contact { width:calc(100% - 165px); display:inline-block; vertical-align:top; text-align:left; padding-left:20px; box-sizing:border-box; }
	.footer .footer-contact h1 { text-align:left; margin-top:0; }
	
	.footer .footer-contact h1 span { display:block; }
}

@media (min-width:996px){
	.owl-carousel .owl-nav button i {font-size:3em;}
	
	.top-menu .boundary { text-align:right; }
	.top-menu .top-menu-content li { font-size:0.75em!important; padding:0 10px!important; text-align:left; }
	
	.container .container-title { margin-bottom:20px; }
	
	.introduction .square-image { width:80%; margin:0; }
	
	.qa ul { margin-top:0; }
	
	.why-us { margin-top:120px; }
	.why-us .table .col { font-size:1em; }
	
	.news .news-item { width:23.5%; }
	.news .news-item:nth-child(2n+0) { margin-right:2%; }
	.news .news-item:nth-child(4n+0) { margin-right:0; }
	
	.footer .footer-logos, .footer h1 { text-align:left; }
	.footer .footer-menu { border:0; margin-top:0; padding-left:100px; }
	.footer .footer-menu h3 { margin-top:0; }
	
	.copyright span { display:inline-block; }
}

@media (min-width:1200px){
	.top-menu { height:80px; }
	.top-menu .top-menu-logo { height:70px; }
	.top-menu .top-menu-content { margin-top:25px; }
	.top-menu .top-menu-content li { font-size:0.9em!important; padding:0 15px!important; margin:0 2px; }
	.top-menu .top-menu-content li ul li { font-size:1.1em!important; }
	.top-menu .top-menu-content li:hover { background-color:var(--orange); color:#FFF; border-radius:5px; }
	.top-menu .top-menu-content li:hover a { color:inherit; }
	.top-menu .top-menu-content li:hover ul { display:block!important; }
	
	.introduction, .news, .qa { font-size:18px; }
	
	.container .container-title { font-size:1.8em; }
	
	.why-us { margin-top:80px; }
	.why-us .table { margin-top:60px; }
	
	.qa .table .col:first-child { padding-right:30px; }
	.qa ul li { line-height:1.5em; }
}

@media(min-width:1300px){
	
}