@font-face {font-family: "NotoSansJP-fallback";size-adjust: 113.55999999999995%;ascent-override: 82%;src:local("Arial")}
@font-face {font-family: "NotoSansJP";src: url("../includes/NotoSansJP-Regular");font-display:swap}
body{ font-family: Montserrat, Montserrat-fallback, Sans Serif, Verdana;padding:0;margin:0;background:#EFEFEF;color:#1A1A1A;letter-spacing:.3px}
main{width:100%;float:left;position:relative;background:#FBFBFB;padding-bottom:70px}
.container{max-width:1200px;height:auto;position:relative;margin:0 auto;padding:40px 20px}
.container img{max-width:100%;object-fit:contain;border-radius:15px;height:auto}
.container a{color:#880000;text-decoration:none;position:relative;border-bottom: 1px solid #D5D5D5}
img, .container img{object-fit:contain}
input, textarea, select{width:100%;max-width:350px;margin:10px 0;border:1px solid #ddd;border-radius:5px;padding:10px;font-size:18px;margin-bottom:2px;box-sizing:border-box}
#call{margin-bottom:18px !important}
textarea{height:200px}
input[type="submit"]{background:#657398; border:0; color:#FFF}
label{color:#1A1A1A}
.send{position:relative;padding:20px 30px;font-weight:bold;top:80px;margin:auto;width:200px;background-color:#FFF;border-radius:10px;line-height:24px}
.button{font-size:18px;font-weight:normal;border:0;background:#4346ca;font-weight:bold;padding:10px 25px;color:#FFF;border-radius:10px;display:inline-block;cursor:pointer;text-decoration:none;color:#FFF !important}
.button:hover{background:#5F62E5}
.call{position: relative;left:calc(100% - 814px);top:7px}
.telegram{position: relative;left:calc(100% - 920px);top:11px}
.footer{width:100%;padding:20px 15px;float:left;position:relative;box-sizing:border-box}
.footer img{position:relative;top:12px}
.footer a{color:#333 !important}
.centerDiv{max-width:900px;margin:0 auto;position:relative}
.centerDiv a{color:#880000;margin-right:10px;border-bottom: 1px solid #D3D3D3;text-decoration:none}
.nap{margin-top:24px;font-style:italic;color:#333}
.nap a{margin:0;padding:0 !important;text-decoration:none}
.faq, .ctaBox{width:100%;padding:18px 18px 26px 18px;height:auto;margin:30px 0;background:#FFF;color:#000 !important;border-radius:10px;box-sizing:border-box;border:1px solid #F2F2F2}
.faq h3, .ctaBox h2{margin:0;padding:0;line-height:24px;font-size:20px;color:#000}
.error{color:red;font-size:0.9em;margin-top:4px;margin-bottom:14px;font-style:italic}
.success{color:green;font-size:1em;margin-top:10px}
#alsja{display:none}
.text-container{border-radius:10px;background-color:#fff;padding:30px;width:100%;height:auto;margin:40px 0;border:1px solid #ddd;box-sizing:border-box}
.center-text-container{margin:0 auto;width:100%;max-width:1000px;margin-top:40px;margin-bottom:50px;line-height:26px}
.width150{width:150px}
.width150Calc{width:calc(100% - 130px);max-width:232px}
.banner-content { max-width:420px;z-index:2;left:calc(100% - 96%);position:relative }
.logo-size{width:145px;height:65px;object-fit: cover;}
.t30{top:30px}
.t50{top:50px}
.w900{max-width:900px}
h1{color:#262A7F;margin:10px 0 20px 0}

.button-outline {
    background: transparent;
    color: #000;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 12px 18px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s ease;
    margin: 10px 10px 0 0;
}




.error {
    color: red;
    font-size: 13px;
    margin-top: 4px;
}

.input-error {
    border: 1px solid red;
}


.banner {
    position: relative;
    width: 100%;
    height: 576px;
    background: linear-gradient(135deg, #8FC948, #C9C249);
    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: center; 

    padding: 0 8%;
    box-sizing: border-box;
}


.banner-inner {
    display: flex;
    align-items: center;
    gap: 60px;
}

    .banner-content h1 {
        font-size: 38px;
	margin:10px 0 0 0;
    }

.banner-content p{margin: 15px 0 20px 0;font-size:20px;line-height:24px}
   

    color: white;
    max-width: 500px;
}


.banner-img {
    width: 740px;
    height: auto;
}


.cta-button {
    display: inline-block;
    padding: 14px 28px;
    background: #4346ca;
    color: #FFF;
    text-decoration: none;
    font-weight: bold;
    border-radius: 6px;
    transition: 0.3s;
    cursor:pointer;
}

.cta-button:hover {
    background: #8e57d5;
}



@media (max-width: 768px) {



    .banner {
        position: relative;
        height: 340px;
        padding: 0 20px;
    }

    .banner-inner {
        position: relative;
        flex-direction: column;
        align-items: center;
    }


    .banner-img {
        position: absolute;
        bottom: 0;
        right: -40px;
        width: 320px;
        z-index: 1;
    }


    .banner-content {
        position: absolute;
        left: 20px;
        right: 20px;
	top:90px;
        z-index: 2;
        width: 230px;
        text-align: left;
    }

    .banner-content h1 {
        font-size: 20px;
	margin:15px 0 5px 0;
    }

.banner-content p{margin: 0 0 10px 0;font-size:17px}

}








.margin-top20{margin-top:20px}

.product-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;}

.product-box {
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    line-height:25px;
    padding: 20px;
    background: #fff;
    border:1px solid #ddd;
    flex: 1 1 30%;
}

.product-box p {
    margin: 0 0 15px 0;
}

.product-box .price {
    font-size:12px;
}

.product-box-bottom {
    margin-top: auto;
}

.product-box h2, h2{
    font-weight:bold;
    font-size:18px;
    color:#262A7F !important;
    margin:10px 0 15px 0;
    line-height:34px;
}

.product-box h2{text-transform: uppercase}
h2{font-size:32px}

.product-box:hover {
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}

.responsive-video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.responsive-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  border: 0px;
}

@media (max-width: 1280px) {
    .product-container {
        grid-template-columns: repeat(2, 1fr);
    }

    .product-box:nth-child(3) {
        grid-column: 1 / -1;
    }
}


@media (max-width:768px){

    .product-container {
        grid-template-columns: 1fr;
    }

    .product-box:nth-child(3) {
        grid-column: auto;
    }

.logo-size{width:120px;height:54px}
.logo{top:8px}

.h2{padding-left:7px}
.call{left:calc(100% - 260px)}
.telegram{left:calc(100% - 346px)}
.centerDiv{width:100%}
.centerDiv a{display:block;margin:2px 0;padding:2px 0;width:fit-content}
}
@media (max-width:1280px){
.header-image{background:url('../header-image-medium.jpg');width:100%;height:257px;top:65px}
.usp, .usp2{left: 260px;top:90px;position:relative;font-size:30px;width:calc(100% - 300px)}
.usp2{width:380px;top:106px}
}

@media (max-width: 500px) {

    .banner-img {
        right:-60px;
    }

    .banner-content {
	top:80px;
    }




.button{ text-align: center;box-sizing: border-box}
.header-image{background:url('../header-image-small.jpg');width:100%;height:133px;top:62px}
}
.dropbtn{display:none}
.dropdown{display:inline-block}
.dropdown-content{display:block;position:relative}
.dropdown-content a{color:black;padding:12px 16px;text-decoration:none;display:block}
.dropdown-content a:hover {background-color: #820000}
.dropdown:hover .dropdown-content{display:block}
.dropdown:hover .dropbtn{background-color:#5f62e5}
.header a{color:#4346c5}
.header{background-color:#4346ca;box-shadow:1px 1px 4px 0 rgba(0,0,0,.1);position:fixed;width:100%;z-index:9999}
.header ul{margin:0;padding:0;list-style:none;overflow:hidden;background-color:#4346ca}
.header li a{display:block;padding:20px 20px;text-decoration:none;color:#fff}
.header li a:hover,
.header .menu-btn:hover{background-color:#5f62e5;color:#FFF}
.header .logo{display:block;float:left;font-size:2em;padding-left:10px;text-decoration:none;position:relative}
.header .menu{clear:both;max-height:0;transition:max-height .2s ease-out}
.header .menu-icon{cursor:pointer;display:inline-block;float:right;padding:38px 34px;position:relative;user-select:none}
.header .menu-icon .navicon{background:#FFF;display:block;height:2px;position:relative;transition:background .2s ease-out;width:18px}
.header .menu-icon .navicon:before,.header .menu-icon .navicon:after{background:#FFF;content:'';display:block;height:100%;position:absolute;transition:all .2s ease-out;width:100%}
.header .menu-icon .navicon:before{top:5px}
.header .menu-icon .navicon:after{top:-5px}
.header .menu-btn {display:none}
.header .menu-btn:checked ~ .menu{max-height:700px}
.header .menu-btn:checked ~ .menu-icon .navicon{background:transparent}
.header .menu-btn:checked ~ .menu-icon .navicon:before{transform:rotate(-45deg)}
.header .menu-btn:checked ~ .menu-icon .navicon:after{transform:rotate(45deg)}
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after{top:0}
@media (min-width: 48em) {
.dropbtn{color:#FFF;padding:33px 30px;font-size:16px;border:none;cursor:pointer;background:#4346ca;display:block}	
.dropdown-content{display:none;position:absolute;background-color:#5f62e5;min-width:160px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);z-index:1}	
.header li{float:left}
.header li a{padding:33px 30px}
.header .menu{clear:none;float:right;max-height:none}
.header .menu-icon{display:none;}.header .logo{padding-left:20px;top:7px}
}

@media (min-width: 1915px ) {
.header-image{background:url('/images/homepage-banner.jpg');background-color:#8FC948;width:100%;height:530px;position:relative;top:88px;background-repeat:no-repeat;background-position:center center}
}