/* =====================================
   HERO
===================================== */

.blind-hero{

    position:relative;

    width:100%;

    height:720px;

    background:url("/new/img/blind/blind-hero-bg.jpg") center center no-repeat;

    background-size:cover;

    overflow:hidden;

}

.blind-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.30);

}

.blind-hero .innerV{

    position:relative;

    z-index:2;

    width:100%;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-hero .hero-text{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-hero .hero-small{

    display:block;

    margin-bottom:22px;

    color:#42A5FF;

    font-size:15px;

    font-weight:700;

    letter-spacing:4px;

}

.blind-hero h1{

    font-size:76px;

    font-weight:700;

    line-height:1.05;

    margin-bottom:34px;

}

.blind-hero p{

    width:1050px;

    max-width:90%;

    margin:0 auto 50px;

    font-size:22px;

    line-height:1.8;

}

.blind-hero .btn-basic{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    width:240px;

    height:68px;

    background:#00569d;

    color:#fff;

    font-size:20px;

    font-weight:700;

    text-decoration:none;

    border-radius:0;

    transition:.3s;

}

.blind-hero .btn-basic:hover{

    background:#003f75;

}


/* =====================================
   Mobile
===================================== */

@media (max-width:768px){

.blind-hero{

    height:420px;

}

.blind-hero .hero-text{

    width:90%;

}

.blind-hero .hero-small{

    font-size:12px;

    letter-spacing:2px;

    margin-bottom:14px;

}

.blind-hero h1{

    font-size:42px;

    margin-bottom:20px;

}

.blind-hero p{

    max-width:100%;

    font-size:14px;

    line-height:1.2;

    margin-bottom:32px;

}

.blind-hero .btn-basic{

    width:190px;

    height:54px;

    font-size:16px;

}

}

/* =====================================
   WHY BLIND SPOT SAFETY
===================================== */

.blind-intro{

    width:100%;

    margin-top:120px;

}

.blind-intro-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/why-blind-bg.jpg") center center no-repeat;

    background-size:cover;

    overflow:hidden;

}

.blind-intro-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.35);

}

.blind-intro-hero .innerV{

    position:relative;

    z-index:2;

    width:100%;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-intro-text{

    width:100%;

    max-width:1100px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-intro-text h2{

    font-size:64px;

    font-weight:700;

    margin-bottom:35px;

    line-height:1.15;

}

.blind-intro-text p{

    width:950px;

    max-width:90%;

    margin:0 auto;

    font-size:20px;

    line-height:1.9;

}


/* =====================================
   Mobile
===================================== */

@media (max-width:768px){

.blind-intro{

    margin-top:80px;

}

.blind-intro-hero{

    height:340px;

}

.blind-intro-text{

    width:90%;

}

.blind-intro-text h2{

    font-size:40px;

    margin-bottom:20px;

}

.blind-intro-text p{

    width:100%;
    font-size:14px;
    line-height:1.2;

}

}

/* =====================================
   REPRESENTATIVE BLIND SPOT SAFETY SOLUTIONS
===================================== */

.blind-solution-intro{

    margin-top:120px;

    background:#fff;

    text-align:center;

}

.blind-solution-intro h2{

    font-size:60px;

    font-weight:700;

    line-height:1.2;

    margin-bottom:40px;

    color:#111;

}

.blind-solution-intro h3{

    font-size:28px;

    font-weight:700;

    line-height:1.5;

    margin-bottom:35px;

    color:#00569d;

}

.blind-solution-intro p{

    width:1000px;

    max-width:90%;

    margin:0 auto;

    font-size:20px;

    line-height:1.9;

    color:#777;

}


/* =====================================
   Mobile
===================================== */

@media (max-width:768px){

.blind-solution-intro{
    margin-top:80px;
}

.blind-solution-intro h2{

    font-size:38px;

    margin-bottom:25px;

}

.blind-solution-intro h3{

    font-size:24px;

    margin-bottom:24px;

}

.blind-solution-intro p{

    width:100%;

    font-size:16px;

    line-height:1.8;

}

}

.blind-solution-intro .btn-basic{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    width:260px;

    height:70px;

    margin-top:70px;

    background:#00569d;

    color:#fff;

    font-size:22px;

    font-weight:700;

    text-decoration:none;

    border-radius:0;

    transition:.3s;

}

.blind-solution-intro .btn-basic:hover{

    background:#003f75;

}

@media (max-width:768px){

.blind-solution-intro .btn-basic{

    width:220px;

    height:58px;

    margin-top:45px;

    font-size:18px;

}

}

/* =====================================
   BLIND SPOT SAFETY PRODUCTS
===================================== */

.blind-product{

    margin-top:120px;

    background:#fff;

}

.blind-product-wrap{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    border-top:1px solid #ddd;

    border-bottom:1px solid #ddd;

}

.blind-product .solution-box{

    padding:60px 40px;

    text-align:center;

    border-right:1px solid #ddd;

}

.blind-product .solution-box:first-child{

    border-left:1px solid #ddd;

}

.blind-product .solution-box figure{

    height:280px;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:35px;

}

.blind-product .solution-box img{

    max-width:100%;

    max-height:100%;

}

.blind-product .solution-box h3{

    font-size:34px;

    font-weight:700;

    margin-bottom:18px;

}

.blind-product .solution-box strong{

    display:block;

    font-size:18px;

    margin-bottom:22px;

}

.blind-product .solution-box p{

    color:#777;

    font-size:16px;

    line-height:1.9;

    margin-bottom:35px;

}

.blind-product .btn-basic{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    width:210px;

    height:58px;

    background:#00569d;

    color:#fff;

    font-size:18px;

    font-weight:700;

    text-decoration:none;

    transition:.3s;

}

.blind-product .btn-basic:hover{

    background:#003f75;

}


/* =====================================
   Mobile
===================================== */

@media (max-width:768px){

.blind-product{

    margin-top:80px;

}

.blind-product-wrap{

    grid-template-columns:1fr;

}

.blind-product .solution-box{

    padding:20px 30px;

    border-left:1px solid #ddd;

    border-right:1px solid #ddd;

    border-bottom:1px solid #ddd;

}

.blind-product .solution-box figure{

    height:220px;

}

.blind-product .solution-box h3{

    font-size:28px;

}

.blind-product .btn-basic{

    width:200px;

    height:54px;

    font-size:16px;

}

}

/* =====================================
   WHAT BLIND SPOT SAFETY DETECTS
===================================== */

.blind-detect{

    margin-top:120px;

    width:100%;

    background:#fff;

}

.blind-detect-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/detect-bg.jpg") center center no-repeat;

    background-size:cover;

    overflow:hidden;

}

.blind-detect-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.35);

}

.blind-detect-hero .innerV{

    position:relative;

    z-index:2;

    width:100%;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-detect-title{

    width:100%;

    max-width:1100px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-detect-title h2{

    font-size:64px;

    font-weight:700;

    line-height:1.15;

    margin-bottom:35px;

}

.blind-detect-title p{

    width:900px;

    max-width:90%;

    margin:0 auto;

    font-size:20px;

    line-height:1.9;

}

@media (max-width:768px){

.blind-detect{

    margin-top:80px;

}

.blind-detect-hero{

    height:340px;

}

.blind-detect-title{

    width:90%;

}

.blind-detect-title h2{

    font-size:42px;

    margin-bottom:20px;

}

.blind-detect-title p{

    width:100%;

    font-size:16px;

    line-height:1.2;

}

}

/* =====================================
   BSD
===================================== */

.bsd-section{

    padding:120px 0;

    background:#23232F;

}

.bsd-wrap{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:80px;

}

.bsd-text{

    width:28%;

    color:#fff;

}

.bsd-text h2{

    font-size:54px;

    font-weight:700;

    margin-bottom:18px;

}

.bsd-text p{

    font-size:30px;

    color:#ddd;

}

.bsd-image{

    width:72%;

}

.bsd-image img{

    width:100%;

    display:block;

}

/* =====================================
   BSD
===================================== */

.bsd-section{

    position:relative;

    margin-top:120px;
	
    width:100%;

    height:640px;

    background:#23232F url("/new/img/blind/bsd-range.jpg") center center no-repeat;

    background-size:cover;

}

.bsd-section .innerV{

    position:relative;

    height:100%;

}

.bsd-text{

    position:absolute;

    left:0;

    top:50%;

    transform:translateY(-50%);

    width:340px;

    color:#fff;

    z-index:10;

}

.bsd-text h2{

    font-size:60px;

    font-weight:700;

    margin-bottom:20px;

    line-height:1;

}

.bsd-text p{

    font-size:34px;

    color:#d8d8d8;

    line-height:1.4;

}

/* =====================================
   RCCW
===================================== */

.rccw-section{

    position:relative;
    margin-top:120px;
    width:100%;

    height:640px;

    background:#23232F url("/new/img/blind/rccw-bg.jpg") center center no-repeat;

    background-size:cover;

}

.rccw-section .innerV{

    position:relative;

    height:100%;

}

.rccw-text{

    position:absolute;

    left:0;

    top:50%;

    transform:translateY(-50%);

    width:360px;

    color:#fff;

}

.rccw-text h2{

    font-size:60px;

    font-weight:700;

    margin-bottom:20px;

}

.rccw-text p{

    font-size:34px;

    color:#d8d8d8;

}

/* =====================================
   PAS
===================================== */

.pas-section{

    position:relative;
    margin-top:120px;
    width:100%;

    height:640px;

    background:#fff url("/new/img/blind/pas-bg.jpg") center center no-repeat;

    background-size:cover;

}

.pas-section .innerV{

    position:relative;

    height:100%;

}

.pas-section .banner-text{

    position:absolute;

    left:0;

    top:50%;

    transform:translateY(-50%);

    width:360px;

    color:#111;

}

.pas-section .banner-text h2{

    font-size:60px;

    font-weight:700;

    margin-bottom:20px;

    color:#111;

}

.pas-section .banner-text p{

    font-size:34px;

    color:#444;

}

/* =====================================
   BSIS
===================================== */

.bsis-section{

    position:relative;
    margin-top:120px;
    width:100%;

    height:640px;

    background:#23232F url("/new/img/blind/bsis-bg.jpg") center center no-repeat;

    background-size:cover;

}

.bsis-section .innerV{

    position:relative;

    height:100%;

}

.bsis-section .banner-text{

    position:absolute;

    left:0;

    top:50%;

    transform:translateY(-50%);

    width:360px;

    color:#fff;

}

.bsis-section .banner-text h2{

    font-size:60px;

    font-weight:700;

    margin-bottom:20px;

    color:#fff;

}

.bsis-section .banner-text p{

    font-size:34px;

    color:#d8d8d8;

}

/* =====================================
   ETC
===================================== */

.etc-section{

    position:relative;
    margin-top:120px;
    width:100%;

    height:640px;

    background:#23232F url("/new/img/blind/etc-bg.jpg") center center no-repeat;

    background-size:cover;

}

.etc-section .innerV{

    position:relative;

    height:100%;

}

.etc-section .banner-text{

    position:absolute;

    left:0;

    top:50%;

    transform:translateY(-50%);

    width:360px;

    color:#111;

}

.etc-section .banner-text h2{

    font-size:60px;

    font-weight:700;

    margin-bottom:20px;

    color:#111;

}

.etc-section .banner-text p{

    font-size:34px;

    color:#111;

}

/* =====================================
   PLATFORM ARCHITECTURE
===================================== */

.blind-platform{

    margin-top:120px;
    padding-bottom:120px;

    width:100%;

    background:#fff;

}

.blind-platform-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/platform-bg.jpg") center center no-repeat;

    background-size:cover;

}

.blind-platform-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.25);

}

.blind-platform-hero .innerV{

    position:relative;

    z-index:2;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-platform-title{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-platform-title h2{

    font-size:76px;

    font-weight:700;

    line-height:1.1;

    margin-bottom:35px;

}

.blind-platform-title p{

    width:1100px;

    max-width:95%;

    margin:0 auto;

    font-size:22px;

    line-height:1.8;

}

/* =====================================
   CORE RADAR ARCHITECTURE
===================================== */

.blind-technology{

    width:100%;

    background:#fff;

}

.technology-row{

    display:grid;

    grid-template-columns:1fr 1fr;

    min-height:520px;

}

.technology-row.reverse .technology-image{

    order:2;

}

.technology-row.reverse .technology-content{

    order:1;

}

.technology-image{

    overflow:hidden;

}

.technology-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

}

.technology-content{

    display:flex;

    align-items:center;

    background:#fff;

}

.technology-inner{

    width:100%;

    margin:0 auto;

    padding:60px;

    max-width:620px;

}

.technology-inner h3{

    font-size:46px;

    font-weight:700;

    line-height:1.2;

    color:#00569d;

    margin-bottom:35px;

}

.technology-inner p{

    font-size:18px;

    color:#777;

    line-height:2;

}



/* =====================================
   Mobile
===================================== */

@media (max-width:768px){

.blind-technology{

    margin-top:80px;

}

.technology-row{

    grid-template-columns:1fr;

    min-height:auto;

}

.technology-row.reverse .technology-image,
.technology-row.reverse .technology-content{

    order:unset;

}

.technology-image{

    height:280px;

}

.technology-content{

    padding:50px 30px;

}

.technology-inner{

    max-width:100%;

    padding:0;

}

.technology-inner h3{

    font-size:34px;

    margin-bottom:24px;

}

.technology-inner p{

    font-size:16px;

    line-height:1.8;

}

}

/* =====================================
   REAL-WORLD DRIVING SCENARIOS
===================================== */

.blind-real{

    margin-top:120px;

    width:100%;

    background:#fff;

}

.blind-real-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/real-bg.jpg") center center no-repeat;

    background-size:cover;

}

.blind-real-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.35);

}

.blind-real-hero .innerV{

    position:relative;

    z-index:2;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-real-title{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-real-title h2{

    font-size:76px;

    font-weight:700;

    line-height:1.1;

    margin-bottom:35px;

}

.blind-real-title p{

    width:1000px;

    max-width:95%;

    margin:0 auto;

    font-size:22px;

    line-height:1.8;

}

/* =====================================
   LANE CHANGES
===================================== */

.blind-lane{

    margin-top:120px;

    width:100%;

    background:#fff;

}

.blind-lane-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/lane-change-bg.jpg") center center no-repeat;

    background-size:cover;

}

.blind-lane-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.38);

}

.blind-lane-hero .innerV{

    position:relative;

    z-index:2;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-lane-title{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-lane-title h2{

    font-size:76px;

    font-weight:700;

    line-height:1.1;

    margin-bottom:35px;

}

.blind-lane-title p{

    max-width:1000px;

    margin:0 auto;

    font-size:22px;

    line-height:1.8;

}

/* =====================================
   REVERSING IN TIGHT SPACES
===================================== */

.blind-reverse{

    margin-top:120px;

    width:100%;

    background:#fff;

}

.blind-reverse-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/reversing-bg.jpg") center center no-repeat;

    background-size:cover;

}

.blind-reverse-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.38);

}

.blind-reverse-hero .innerV{

    position:relative;

    z-index:2;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-reverse-title{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-reverse-title h2{

    font-size:76px;

    font-weight:700;

    line-height:1.1;

    margin-bottom:35px;

}

.blind-reverse-title p{

    max-width:1000px;

    margin:0 auto;

    font-size:22px;

    line-height:1.8;

}

/* =====================================
   PARKING AND LOW-SPEED MANEUVERS
===================================== */

.blind-parking{

    margin-top:120px;

    width:100%;

    background:#fff;

}

.blind-parking-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/parking-bg.jpg") center center no-repeat;

    background-size:cover;

}

.blind-parking-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.35);

}

.blind-parking-hero .innerV{

    position:relative;

    z-index:2;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-parking-title{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-parking-title h2{

    font-size:76px;

    font-weight:700;

    line-height:1.1;

    margin-bottom:35px;

}

.blind-parking-title p{

    max-width:1000px;

    margin:0 auto;

    font-size:22px;

    line-height:1.8;

}

/* =====================================
   TURNING NEAR VULNERABLE ROAD USERS
===================================== */

.blind-turning{

    margin-top:120px;

    width:100%;

    background:#fff;

}

.blind-turning-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/turning-bg.jpg") center center no-repeat;

    background-size:cover;

}

.blind-turning-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.35);

}

.blind-turning-hero .innerV{

    position:relative;

    z-index:2;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-turning-title{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-turning-title h2{

    font-size:76px;

    font-weight:700;

    line-height:1.1;

    margin-bottom:35px;

}

.blind-turning-title p{

    max-width:1000px;

    margin:0 auto;

    font-size:22px;

    line-height:1.8;

}

/* =====================================
   HEAVY COMMERCIAL VEHICLE OPERATION
===================================== */

.blind-commercial{

    margin-top:120px;

    width:100%;

    background:#fff;

}

.blind-commercial-hero{

    position:relative;

    width:100%;

    height:620px;

    background:url("/new/img/blind/heavy-commercial-bg.jpg") center center no-repeat;

    background-size:cover;

}

.blind-commercial-hero .hero-mask{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.38);

}

.blind-commercial-hero .innerV{

    position:relative;

    z-index:2;

    height:100%;

    display:flex;

    justify-content:center;

    align-items:center;

}

.blind-commercial-title{

    width:100%;

    max-width:1200px;

    margin:0 auto;

    text-align:center;

    color:#fff;

}

.blind-commercial-title h2{

    font-size:76px;

    font-weight:700;

    line-height:1.1;

    margin-bottom:35px;

}

.blind-commercial-title p{

    max-width:1000px;

    margin:0 auto;

    font-size:22px;

    line-height:1.8;

}

/* =====================================
   DETECT LIST
===================================== */

.blind-detect-wrap{

    display:grid;

    grid-template-columns:repeat(6,1fr);

    border-top:1px solid #ddd;

    border-bottom:1px solid #ddd;

}

.detect-box{

    min-height:410px;

    padding:70px 35px;

    text-align:center;

    border-right:1px solid #ddd;

}

.detect-box:first-child{

    border-left:1px solid #ddd;

}

.detect-box h3{

    font-size:24px;

    font-weight:700;

    color:#111;

    margin-bottom:40px;

}

.detect-box p{

    font-size:16px;

    color:#777;

    line-height:2;

}

/* =====================================
   FINAL MOBILE OPTIMIZATION
===================================== */
@media (max-width:768px){
.bsd-section,.rccw-section,.pas-section,.bsis-section,.etc-section{margin-top:80px;height:340px;background-position:center;background-size:cover;}
.bsd-text,.rccw-text,.banner-text{position:relative;top:auto;left:auto;transform:none;width:90%;margin:0 auto;padding-top:40px;text-align:center;}
.bsd-text h2,.rccw-text h2,.banner-text h2{font-size:36px;margin-bottom:15px;}
.bsd-text p,.rccw-text p,.banner-text p{font-size:20px;line-height:1.5;}
.blind-platform{margin-top:80px;padding-bottom:80px;}
.blind-platform-hero,.blind-real-hero,.blind-lane-hero,.blind-reverse-hero,.blind-parking-hero,.blind-turning-hero,.blind-commercial-hero{height:340px;}
.blind-platform-title,.blind-real-title,.blind-lane-title,.blind-reverse-title,.blind-parking-title,.blind-turning-title,.blind-commercial-title{width:90%;}
.blind-platform-title h2,.blind-real-title h2,.blind-lane-title h2,.blind-reverse-title h2,.blind-parking-title h2,.blind-turning-title h2,.blind-commercial-title h2{font-size:42px;margin-bottom:20px;}
.blind-platform-title p,.blind-real-title p,.blind-lane-title p,.blind-reverse-title p,.blind-parking-title p,.blind-turning-title p,.blind-commercial-title p{font-size:16px;line-height:1.2;}
.technology-image{height:260px;}
.technology-image img{object-fit:cover;}
.blind-parking-title h2,.blind-turning-title h2,.blind-commercial-title h2{line-height:1.2;}
}