/* CSS Document */

body {	-webkit-text-size-adjust:100%; font-family: 'Lato', sans-serif; overflow-x: hidden; font-weight: 400; }
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:1740px; margin:0 auto; text-align:left; position:relative; clear:both;}
.content-Box2 { max-width:1080px; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { font-size: 15px; line-height:24px; color: #002c6b; padding-top: 144px; letter-spacing: 0.05rem;}
#content p{ padding-bottom: 30px;}

.banner { position: relative; z-index: 4; background-size: cover; background-position: top left; height: 301px;}
.banner-title { position: absolute;top:calc(50% - 15px); color: #fff; font-weight: bold; font-size: 28px; left: 16%; line-height: 120%;}

.banner2 { 
	position: relative; 
	z-index: 4; 
	height: 375px;
}
.banner-image{
	position:relative;
	top:3%;
	width:100%;
	height:94%;
	background-size: auto 100%; 
	background-position: top right; 
	background-image: url(../img/banner-img.jpg);
	box-shadow:0 0 6px #000000;
	z-index:0;
	background-repeat: no-repeat;
}
.banner-title-block{
	position:absolute;
	top:0;
	width:100%;
	height:100%;
	background-position: top left; 
	background-image: url(../img/banner-bg.png);
	z-index:1;
	background-repeat: no-repeat;
	background-size: auto 100%;
}
.banner-title-text{
	position: absolute;
	top:calc(50% - 15px);
	color: #fff;
	font-weight: bold;
	font-size: 28px;
	left: 16%;
	line-height: 120%;
}
.banner-title-block-back{
	position:absolute;
	top:0;
	width:100%;
	height:100%;
	background-position: top left; 
	background-image: url(../img/banner-bg_back.png);
	z-index:-1;
	background-repeat: no-repeat;
	background-size: auto 100%;
}


.main-box {position: relative; overflow: hidden; padding: 20px 20px 30px 20px; margin-top: -15px;}
.main-box:before {position: absolute; background: #eff0f0; content: ""; width: 260px; height: 1000px; transform-origin: 100% 0%; transform:rotate(30deg); left: 0; top: 0;}
.main-box:after {position: absolute; background: #eff0f0; content: ""; width: 2000px; height: 900%; transform-origin: 100% 0%; transform:rotate(20deg); right: -100%; top: 0;}

.main-content { position: relative; z-index: 3; padding-top: 10px;}

#path { padding:0 0 30px 0; text-align: left; color: #002c6b; text-transform: uppercase; letter-spacing: 0;}
#path li { display: inline-block; vertical-align: top; font-size: 14px;}
#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: #002c6b;}
#path li a:hover { opacity: 0.6;}

.title01 { text-align: center; padding-bottom: 25px;}
.title01 h1, .title01 span { font-size: 24px; color: #002c6b; font-weight: bold; line-height: 130%; text-transform: uppercase;}

/*products*/
.products-list { display: flex; flex-direction: row; flex-wrap: wrap;}
.products-list > div { width: 33.33%; padding: 0 30px 25px 30px;}
.products-pto { line-height: 0; text-align: center; margin-bottom: 12px;}
.products-name { text-align: center; font-weight: bold; line-height: 130%;}

/*products-list*/
.btn-back { margin-bottom: 50px; background: url(../img/back-icon.png) no-repeat top left; padding-left: 40px; padding-top: 5px; min-height: 33px; padding-bottom: 10px; color: #0d1861; font-weight: bold;display: block;}
.btn-back:hover { padding-left: 50px;}

.btn-more { color: #fd001e; display: block; text-align: center; font-size: 13px;}
.btn-more:hover {  text-decoration: underline;}

/*products-detail*/
aside { margin-bottom: 40px; padding-left: 110px; position: relative;margin-top: -50px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;}
aside a { display: inline-block; margin: 0 10px 20px 10px; padding: 5px 10px; position: relative; color: #002c6b; font-size: 17px; font-weight: bold; min-width: 110px; text-align: center;}
aside a:hover, aside a.current { color: #fff; background: #0d1861;}
aside a:hover:after, aside a.current:after { height: 3px;}
aside a:after { content: ""; position: absolute; bottom: -5px; left: 0; width: 100%; height: 0px; background: #d71318;transition: all 0.4s ease-out 0s;}

.products-detail-top { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;}
.products-detail-top > div { width: 50%; padding-bottom: 40px;}

.products-detail-title { font-size: 22px; font-weight: bold; padding-bottom: 20px;}
.products-detail-title2 { font-size: 18px; padding-bottom: 14px;}


.responsive3 { padding:0 50px 15px 50px; margin-top: 15px; margin-bottom: 20px !important;}
.responsive3 .slick-slide img { display:inline-block; max-width: 120px;
-webkit-transition: all 0.2s ease-out 0s;
-moz-transition: all 0.2s ease-out 0s;
transition: all 0.2s ease-out 0s;}
.responsive3 .slick-slide:hover img { opacity:0.6;}
.responsive3 .slick-slide { position:relative; text-align:center; margin:0 5px; border:0px solid #eeeeee; line-height:0;}
.responsive3 .slick-dots { text-align:center; display:none !important;}
.responsive3 .slick-dots li { width:auto; height:3px; overflow:hidden;}
.responsive3 .slick-dots li button { width:30px; height:3px; background:#fff; margin:0 2px;}
.responsive3 .slick-dots li button::before { content:""; display:none; }
.responsive3 .slick-dots li.slick-active button  { background:#de4609;}
/*.single-item .slick-prev, .single-item .slick-next { display:none !important;}*/
.responsive3 .slick-prev, .responsive3 .slick-next { width:auto; height:auto; top:35%;}
.responsive3 .slick-prev { left:5px; width: 24px; height: 24px;  border:0px solid #e4e4e5; background:#0f249b;}
.responsive3 .slick-prev::before { font-family: 'Font Awesome 5 Free'; content:"\f0d9"; font-size:18px; color:#fff;font-weight: 900;}
.responsive3 .slick-next { right:5px; width: 24px; height: 24px;  border:0px solid #e4e4e5; background:#0f249b;}
.responsive3 .slick-next::before { font-family: 'Font Awesome 5 Free'; content:"\f0da"; font-size:18px; color:#fff;font-weight: 900;}
.responsive3 .slick-prev:hover, .responsive3 .slick-prev:focus, .responsive3 .slick-next:hover, .responsive3 .slick-next:focus {background:#0f249b;}

.slider a:before { content:""; display:block; position:absolute; width:100%; height:100%; z-index:1;}

.btn-zoom { position: absolute; bottom: 60px; right: 22px; z-index:2;}

.spec-title { margin-bottom: 10px; display: flex; flex-direction: row; flex-wrap: nowrap; background: #365c95;}
.spec-title > div {  text-align: center; padding: 5px 10px; color: #fff; font-size: 15px;}
.spec-title > div:nth-of-type(1) { width: 34%;}
.spec-title > div:nth-of-type(2) { width: 66%;}
.spec-title2 > div {width: 100% !important;}

.table-type-1 { width: 100%; border-spacing: 1px;  font-size: 16px; color: #0d1861; background: #fff;}
.table-type-1 th, .table-type-1 td { text-align: left; padding: 2px 15px;background: #e9f1f6;}

.accessory { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.accessory > div { width: calc(50% - 5px);}

.video-container {position: relative;padding-bottom: 51.5%;padding-top: 30px;height: 0;overflow: hidden;}
.video-container iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%; border-width: 0;}

/*news*/
.news-menu { display: flex;flex-direction: row; flex-wrap: wrap; justify-content: center; margin-bottom: 40px;}
.news-menu > a {  width: 100px; display: inline-block; line-height: 34px; text-align: center; background: #d8d9db; color: #000420; font-weight: bold; margin: 0 1px 2px 1px;}
.news-menu > a:hover, .news-menu > a.current {  color: #fff; background: #0d1861;}

.news-date { display: flex;flex-direction: row; flex-wrap: nowrap; margin-bottom: 20px; align-items: center;}
.news-date > div:nth-of-type(1) { width: 140px; font-weight: bold; font-size: 17px; color: #005bac;}
.news-date > div:nth-of-type(2) { width: calc(100% - 140px); height: 1px; border-top:1px dashed #d1d0d0;}
.news-data { display: flex;flex-direction: row; flex-wrap: wrap; margin-bottom: 30px;}
.news-data > div { margin-bottom: 20px;}
.news-data > div:nth-of-type(1) { width: 265px; line-height: 0;}
.news-data > div:nth-of-type(2) { width: calc(100% - 265px); color: #005bac; padding-left:30px;}
.news-btn {text-align: right; font-size: 14px;}
.news-btn a { color: #fd001e;}

/*qa*/
.qa-list { display: flex;flex-direction: column; flex-wrap: nowrap; }
.qa-list > div { display: flex;flex-direction: row; flex-wrap: wrap; align-items: center; margin:20px 0 50px 0px;}
.qa-list > div > div { margin-bottom: 20px;}
.qa-list > div > div:nth-of-type(1) { width: 50%; padding: 0 24px; color: #181818; font-size: 16px;}
.qa-list > div > div:nth-of-type(1) > b, .title02 { display: block; font-size: 18px; color: #181818; font-weight: bold; padding-bottom: 10px;}
.qa-list > div > div:nth-of-type(2) { width: 50%; line-height: 0;}
.qa-list > div > div:nth-of-type(2) img { width: 100%; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);}
.qa-list > div:nth-child(even) > div:nth-of-type(1) { order: 2;}
.qa-list > div:nth-child(even) > div:nth-of-type(2) { order: 1;}

.list-type-1 { }
.list-type-1 li { position: relative; padding-left: 25px;}
.list-type-1 li:before { position: absolute; content: ""; top: 10px; left: 7px; width: 6px; height: 6px; background: #fc031a;}

.qa-content { display: flex; flex-direction: row; flex-wrap: wrap; max-width: 820px; margin: 0 auto 30px auto;}
.qa-content > div:nth-child(odd) { width: 170px; padding-right: 15px; font-weight: bold; font-size: 17px; color: #0a439c; text-align: right;}
.qa-content > div:nth-child(even) { width: calc(100% - 170px); font-weight: bold; font-size: 16px; color: #181818; text-align: left;}

/*catalog*/
.catalog-list { display: flex;flex-direction: row; flex-wrap: wrap; }
.catalog-list > div { width: 33.33%; margin-bottom: 50px; padding: 0 20px; }
.catalog-data { max-width: 270px; margin: 0 auto;}
.catalog-pto { line-height: 0; margin-bottom: 15px;}
.catalog-name { text-align: center; color: #002c6b; line-height: 120%; font-weight: bold;}

/*contact*/
.contact-qr { position: relative; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-end; margin-bottom: 30px; margin-top: -50px;}
.contact-qr > div { padding: 0 5px 10px 5px;}

.contact-top {display: flex;flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.contact-top > div:nth-of-type(1) { font-weight: bold; color: #152677; font-size: 20px;}
.contact-top > div:nth-of-type(2) { font-weight: bold; color: #181818; font-size: 16px;}

.contact-main {display: flex; flex-direction: row; flex-wrap: wrap; font-size: 16px; line-height: 28px; color: #181818;}
.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 { font-size: 16px; border-width:1px; border-style: solid; border-color: #afafaf; margin: 0px 0 0 0; width: 100%; padding: 10px; color:#181818; background: none; font-family: 'Lato', sans-serif; margin-bottom: 20px; }
.contact-main textarea { height:200px; padding:10px; letter-spacing: 1px; resize: none;}
.contact-main select{  margin: 0px 0 0 0; min-width: 80px; width:100%; background-image: url(../img/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:1px; border-style: solid; border-color: #afafaf; mwidth: 100%; color:#fff; font-family: 'PT Sans', sans-serif; height: 54.5px; padding: 0 35px 0 0;  letter-spacing: 1px;}
.contact-main option { padding:1px 5px;}
.contact-main select::-ms-expand {
    display: none;
}
.contact-note2 { padding-bottom: 10px; margin-top: 0px; display: inline-block;position: relative;padding-left: 28px; padding-right: 15px; cursor: pointer; -webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.contact-note2 input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.checkmark {position: absolute;top: 3px;left: 0;height: 20px;width: 20px;background-color: #fff; border: 1px solid #afafaf;}
.contact-note2:hover input ~ .checkmark {background-color: #fff;}
.contact-note2 input:checked ~ .checkmark {background-color: #2196F3;}
.checkmark:after {content: "";position: absolute;display: none;}
.contact-note2 input:checked ~ .checkmark:after {display: block;}
.contact-note2 .checkmark:after {left: 7px;top: 2px;width: 3px;height: 10px;border: solid white;border-width: 0 3px 3px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}


.form-type { border: 1px solid #afafaf; padding: 10px 10px 0 10px; display: flex; flex-direction: row; flex-wrap: nowrap; width: 100%; margin-bottom: 20px;}
.form-type > div:nth-of-type(1) { width: 165px;}
.form-type > div:nth-of-type(2) { width: calc(100% - 165px);}

.products-detail-btn-2 {display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; margin-bottom: 70px; margin-top: 30px; }
.products-detail-btn-2 > a { display: inline-block;background: #192e84; color: #ffffff; font-size: 17px; font-weight: bold; line-height: 40px; padding: 0 18px; border-right: 1px solid #fff;}
.products-detail-btn-2 > a:first-child { border-radius: 5px 0 0 5px;}
.products-detail-btn-2 > a:last-child { border-radius: 0 5px 5px 0;}
.products-detail-btn-2 > a i { display: inline-block; padding: 0 3px;}
.products-detail-btn-2 > a:hover { opacity: 0.6;}
.btn-back2 { border-right: 0px solid #fff; background: #2e2e2e !important;}

/*download*/
.download-list { display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 30px; border-top: 1px solid #0d1861; border-left: 1px solid #0d1861;}
.download-list > a { width: 25%; display: block; padding: 14px; font-size: 16px; font-weight: bold; color: #002c6b;border-right: 1px solid #0d1861; border-bottom: 1px solid #0d1861; line-height: 110%;text-align: center;}
.download-list > a:hover, .download-list > a.current { color: #fff; background: #0d1861;}

.download-menu { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; margin-bottom: 40px;}
.download-menu > a { display: inline-block; margin: 0 25px 15px 25px; position: relative; color: #0d1861; font-size: 16px; font-weight: bold;}
.download-menu > a:before { content: ""; position: absolute; width: 0%; height: 2px; left: 0; bottom: -8px; background: #fc0113;transition: all 0.4s ease-out 0s;}
.download-menu > a:hover:before, .download-menu > a.current:before { width: 100%; }

.download-list2 { display: flex; flex-direction: row; flex-wrap: wrap; }
.download-list2 > a { width: 25%; padding: 0 10px 60px 10px; }
.download-data { max-width: 160px; margin: 0 auto; text-align: center;}
.download-pto { line-height: 0; margin-bottom: 5px;}
.download-name { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center;}
.download-name > div { padding: 0 4px; font-size: 16px; font-weight: bold; color: #0d1861;}
.download-name > div img { width: 33px;}

.btn-logout { text-align: right; padding-bottom: 5px;}

/*sitemap*/
.sitemap-menu-1 > a { display: block; color: #002c6b; border-bottom: 1px solid #002c6b; padding-bottom: 10px; margin-bottom: 20px; font-weight: bold;}
.sitemap-menu-2 { padding: 0 12px 0 12px;}
.sitemap-menu-2 > a { display: block; color: #002c6b; padding-left: 30px; padding-bottom: 10px; position: relative;}
.sitemap-menu-2 > a:before { content: ""; position: absolute; top: 10px; left: 0; height: 3px; width: 18px; background: #002c6b; display: block;}
.sitemap-menu-3 { padding-left:40px;}
.sitemap-menu-3 > a { display: inline-block; padding: 0 25px 10px 0; color: #fc0214;}

@media only screen and (max-width:  2165px) {
	.banner2 {
		height:301px;
	}
}

@media only screen and (max-width:  1715px) {
	.banner2 {
		height:260px;
	}
	.banner-image{
		background-position:top right 50%;
		}
}


@media only screen and (max-width:  1279px) {
	#content { padding-top: 60px;}
	
	.main-box:before {left: -40px;}
	.main-box:after { display:  none;}
	.banner2 {
		height:200px;
	}
	.banner-title-block,
	.banner-title-block-back{
		width:50%;
		background-position:top right;
		background-size: auto;
	}
	
	
}
@media only screen and (max-width: 980px) {
	.banner { background-position: top center; height: 100px;}
	.banner-title { display: none;}
	
	.title01 h1, .title01 span { font-size: 19px;}

	.banner2 {height: 100px;}
	.banner-title-text { text-shadow: 0 0 2px #000000;}
	.banner-image{
		background-position:top right;
		}
}
@media only screen and (max-width: 768px) {
	.products-list > div { width: 50%; padding: 0 10px 25px 10px;}
	
	aside { margin-bottom: 40px; padding-left: 0px; margin-top: -30px; justify-content: center; }
	aside a { margin: 0 10px 20px 10px;}
	
	.products-detail-top > div { width: 100%; padding-bottom: 30px;}
	.responsive3 .slick-slide img {max-width: 100%;}
	
	.qa-list > div { margin-bottom: 0px;}
	.qa-list > div > div:nth-of-type(1) { width: 100%; padding: 0; order: 2;}
	.qa-list > div > div:nth-of-type(2) { width: 100%; order: 1; margin-bottom: 15px;}

	.catalog-list > div { width: 50%; padding: 0 10px; }
	
	.contact-qr { justify-content: flex-start; margin-top: 0px;}
	
	.download-list { margin-bottom: 15px;}
	.download-list > a { width: 50%; padding: 10px; font-size: 14px;}
}
@media only screen and (max-width: 640px) {
	.form-type { flex-wrap: wrap; }
	.form-type > div:nth-of-type(1) { width: 100%;}
	.form-type > div:nth-of-type(2) { width: calc(100% - 0px);}
	.banner-image{
		background-position:top right 50%;
		}
	
}
@media only screen and (max-width: 570px) {
	.news-data > div:nth-of-type(1) { width: 100%; text-align: center;}
	.news-data > div:nth-of-type(2) { width: 100%; padding-left:0px;}
	
	.download-menu > a { display: block; text-align: left; width: 100%; margin: 0 0 8px 0; position: relative; color: #0d1861; font-size: 16px; font-weight: bold;}
	
	.download-list2 > a { width: 50%;}
	.banner-title-text{font-size:20px;}
}

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

}

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

}