@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:400;font-display:swap;font-style:italic;}
@font-face{font-family:"utm-alter-gothic";src:url("fonts/utm-alter-gothic.ttf")format("TrueType");font-weight:400;font-display:swap}

:root{
	--burger: #027287;
	--blue-dark: #027287;
	--blue-light: #43879A;
	--red: #EC1B24;
	--yellow-dark: #FFCE17;
}
html, body { font-family: roboto, sans-serif; font-size:16px; }
h1, h2, h3, h4, h5, h6 { font-family:"utm-alter-gothic"; line-height:1.3em; font-weight:normal; }
a { color:inherit; }
.boundary { width: 96%; max-width: 1200px; }
.breadcrumb { line-height: 1.5em!important; }
.breadcrumb li { display:inline; }

.container .container-title { font-family:"utm-alter-gothic"; font-size:2em; line-height:1.5em; color:var(--blue-dark); position:relative; padding-left:10px; display:inline-block; box-sizing:border-box; margin:10px 0; }
.container .container-title:after { content:""; display:inline-block; position:absolute; top:100%; left:0; width:150%; height:5px; background-color:var(--blue-dark); }

.top-menu { position:fixed; top:0; left:0; width:100%; height:60px; line-height:60px; background-color:rgba(255,255,255,1); z-index:9999; box-shadow: 0 0.5px 3px #666; text-align:center; }
.top-menu .top-menu-logo { display:inline-block; vertical-align:top; height:60px; width:60px; line-height:60px; text-align:center; margin-left:10px; }
.top-menu .top-menu-logo img { display:inline-block; vertical-align:middle; }
.top-menu .top-menu-title { display:inline-block; font-family:"utm-alter-gothic"; font-size:1.5em; color:var(--blue-dark); margin-left:10px; }

.top-menu .hamburger { margin:15px 10px; float:right; }

.top-menu .top-menu-wrapper { position:fixed; top:60px; left:110%; width:100%; height:calc(100% - 60px); background-color:var(--blue-dark); color:#FFF; z-index:9998; transition:all 0.3s;  }
.top-menu .top-menu-wrapper ul { list-style-type:none; font-family:"utm-alter-gothic"; font-size:1.4em; padding-left:150px; opacity:0; transition:all 1.5s; }
.top-menu .top-menu-wrapper ul li.active a, .top-menu .top-menu-wrapper ul li:hover a { color:var(--yellow-dark); position:relative; display:inline-block; line-height:1.3em; }
.top-menu .top-menu-wrapper ul li.active a:after, .top-menu .top-menu-wrapper ul li:hover a:after { content:""; display:inline-block; width:150%; height:3px; background-color:var(--yellow-dark); position:absolute; top:100%; left:-5px; }

.top-menu .top-menu-wrapper.active { left:0; }
.top-menu .top-menu-wrapper.active ul { padding-left:20px; opacity:1; }

.banner { position:relative; margin-top:60px; }
.banner:before { content:""; display:block; }
.banner:before, .banner .owl-carousel .square-image:before { padding-top:56%; }
.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; }

.introduction { margin-top:20px 0 40px; }
.introduction .col { text-align:left; line-height:1.5em; }
.introduction .col.min-hide { display:none!important; }
.introduction .square-image .square-image-frame { position:absolute; top:-2px; left:-2px; width:calc(100% + 4px); height:calc(100% + 4px); background:url(../images/introduction-frame.png) top left no-repeat; background-size:100% 100%; }
.introduction .introduction-content .square-image { display:none; }

.advantage { margin:90px 0 0; background-image:linear-gradient(#FFF, #EEE); }
.advantage .table .col { display:inline-block; width:49%; margin:0 2% 20px 0; font-size:0.8em; }
.advantage .table .col:nth-child(2n+0) { margin-right:0; }
.advantage .square-image { max-width:110px; margin:0 auto; margin-bottom:10px; }

.services { background-color:var(--blue-dark); color:#FFF; }
.services .table .col { text-align:left; padding-top:20px; }
.services .container-title { color:#FFF; }
.services .container-title:after { background-color:#FFF; }
.services ul { list-style-type:none; margin:0; padding:0 0 0 10px; }
.services ul li { line-height:1.5em; margin-bottom:10px; }
.services ul li:before { content:"\e923"; 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; display:inline-block; transform:rotate(90deg); margin-right:10px; }

.services ul.star-icons { padding-left:35px; }
.services ul.star-icons li:before { content: "\e9d9"; transform:unset; color:var(--yellow-dark); }

.services .services-hotline { position:relative; display:inline-block; text-align:center; width:auto; height:65px; line-height:65px; padding:0 20px; background-color:var(--yellow-dark); border-radius:40px; color:var(--blue-dark); margin:0 0 20px 15px; }
.services .services-hotline:before { content:""; position:absolute; top:-6px; left:-6px; width:calc(100% + 12px); height:calc(100% + 12px); border:3px solid var(--yellow-dark); box-sizing:border-box; border-radius:40px; }
.services .services-hotline i, .services .services-hotline span { display:inline-block; vertical-align:middle; }
.services .services-hotline i { width:30px; height:65px; line-height:65px; font-size:2em; }
.services .services-hotline span { font-weight:bold; width:calc(100% - 40px); margin-left:10px; line-height:1.5em; text-align:left; }

.gallery { margin-top:40px; }
.gallery .container-description { margin:10px 0; }
.gallery .gallery-content { }
.gallery .gallery-content .gallery-item { display:inline-block; width:49.5%; margin:0 1% 5px 0; }
.gallery .gallery-content .gallery-item:nth-child(2n+0) { margin-right:0; }
.gallery .gallery-content .gallery-item .square-image:before { padding-top:75%; }

.news { margin-top:40px; padding:30px 0; background-color:#F3F3F3; }
.news .container-title { margin-bottom:20px; }
.news .news-item { margin-bottom:20px; box-shadow:0 0 3px #666; }
.news .news-item .square-image:before { padding-top:52.333%; }
.news .news-item .news-item-title { text-align:center; padding:20px 10px; background-color:#FFF; }
.news .news-item .news-item-title a { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }

.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%; }

.footer { background-color:var(--blue-dark); color:#FFF; padding:30px 0; }
.footer .footer-contact { font-family:"utm-alter-gothic"; }
.footer .footer-contact h1 { font-size:1.5em; }
.footer .footer-contact h1 span { font-family:roboto; font-weight:normal; display:block; font-size:0.8em; }
.footer ul { list-style-type:none; width:90%; margin:10px auto; padding:0; text-align:left; }
.footer .footer-contact ul { font-size:1.1em; }
.footer ul li { margin-bottom: 10px; }
.footer .footer-contact ul li:before { content: "\e923"; 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; display: inline-block; vertical-align:middle; transform: rotate(90deg); margin-right: 10px; font-size:0.7em; }
.footer .footer-contact ul li span { display:inline-block; vertical-align:middle; width:calc(100% - 25px); }
.footer h2 { width:90%; margin:30px auto 0; text-align:left; }
.footer a:hover { color:var(--yellow-dark); }

.footer-copyright { font-size:0.8em; color:#FFF; background-color:var(--blue-light); padding:7px 0; }

@media (min-width:576px){
	.top-menu { position:fixed; top:0; left:0; width:100%; }
	.top-menu .top-menu-wrapper ul li { line-height:2em; }
	
	.banner:before, .banner .owl-carousel .square-image:before { padding-top:46%; }
	
	.gallery .gallery-content .gallery-item { width:32.666%; margin-bottom:7px; }
	.gallery .gallery-content .gallery-item:nth-child(2n+0) { margin-right:1%; }
	.gallery .gallery-content .gallery-item:nth-child(3n+0) { margin-right:0; }
	
	.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){
	
	.top-menu .top-menu-logo { margin-left:0; }
	.top-menu .top-menu-title, .top-menu .hamburger { display:none; }
	.top-menu .top-menu-wrapper { background-color:unset; top:unset; left:unset; position:relative; width:auto; height:auto; display:inline-block; float:right; }
	.top-menu .top-menu-wrapper ul { padding:0; margin:0; color:#333; opacity:1; font-size:1.2em; }
	.top-menu .top-menu-wrapper ul li { display:inline-block; }
	.top-menu .top-menu-wrapper ul li a { padding:0 10px; position:relative; }
	.top-menu .top-menu-wrapper ul li.active a, .top-menu .top-menu-wrapper ul li:hover a { color:var(--blue-dark); }
	.top-menu .top-menu-wrapper ul li a:after { content:""; position:absolute; top:100%; height:5px; width:0; left:50%; transition:all 0.3s; }
	.top-menu .top-menu-wrapper ul li.active a:after, .top-menu .top-menu-wrapper ul li:hover a:after { left:0; width:100%; background-color:var(--blue-dark); }
	
	.banner .owl-carousel button i { font-size:2.5em; }

	.introduction .introduction-content .square-image { display:inline-block; float:right; width:40%; margin:80px 0 20px 20px; }
	.introduction .col.min-show { display:none!important; }
	
	.advantage { padding-bottom:40px; }
	
	.services { padding: 40px 0; }
	.services .services-hotline { margin-top:20px; }

	.gallery .gallery-content .gallery-item { width:24.25%; }
	.gallery .gallery-content .gallery-item:nth-child(2n+0), .gallery .gallery-content .gallery-item:nth-child(3n+0) { margin-right:1%; }
	.gallery .gallery-content .gallery-item:nth-child(4n+0) { margin-right:0; }
	
	.footer .table .col .table .col-sm-6 { display:block; width:100%; }
	.footer .footer-menu { padding-top:90px; padding-left:20px; }
	
}

@media (min-width: 996px){
	.top-menu { height:80px; line-height:80px; background-color:rgba(255, 255, 255, 0.8); }
	.top-menu .top-menu-logo { margin-top:3px; }
	.top-menu .top-menu-logo, .top-menu .top-menu-logo img { width:74px; height:74px; }
	.top-menu .top-menu-wrapper ul { font-size:1.6em; margin-right:10px; }
	.top-menu .top-menu-wrapper ul li a { padding:0 15px; }
	
	.banner { margin-top:0; }
	
	.introduction { margin:40px 0 60px; }
	.introduction .col.min-hide { display:table-cell!important; padding-top:60px; }
	.introduction .introduction-content .square-image { display:none; }
	
	.advantage { margin-top:120px; }
	.advantage .table .col { font-size:1em; }
	
	.advantage .boundary, .services .boundary { max-width:1000px; }
	
	.gallery .gallery-content { display:flex; flex-direction:row; flex-wrap:wrap; gap:5px; }
	.gallery .gallery-content .gallery-item { width:calc(25% - 5px); margin-right:0; margin-bottom:0; }
	.gallery .gallery-content .gallery-item:nth-child(2n+0), .gallery .gallery-content .gallery-item:nth-child(3n+0) { margin-right:0; }
	
	.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 h2 { margin-bottom:20px; }
	.footer .table .col .table .col-sm-6 { width:50%; display:table-cell; }
	
}

@media (min-width: 1200px){
	.top-menu .top-menu-wrapper ul li a { padding:0 25px; }
	
	.introduction { margin:80px 0; }
	.introduction .col.min-hide { padding-top:0; }
	
	.footer { padding:60px 0; }
	.footer .footer-logo { display:inline-block; margin-top:10px; }
	.footer .footer-contact { display:inline-block; vertical-align:top; text-align:left; width:calc(100% - 120px); margin-left:20px; }
	.footer .footer-contact h1 { font-size:2em; }
	.footer .footer-contact ul { margin-left:0; font-size:1.3em; }
	
	.footer .footer-menu { padding-top:0; padding-left:40px; }
}