@import url("../css/_banner-section.css");
@import url("../css/_sample-intro-section.css");
@import url("../css/_common-panel-section.css");


h1 span{color: #ffffff;}
span.optional-text{margin-bottom: 41px;}
p:not(:last-child){margin-bottom: 27px;}

.about-us-section{z-index: 1;}
.about-us-main.no_video{padding-top: 118px; margin-top: 0;}
.about-us-main{padding: 0 0 104px;}
.about-us-bg{left: -575px; top: -150px; width: 785px; position: absolute; z-index: -1;}
span.number{font-size: 62px; line-height: 50px; font-family: 'Gotham-Black', sans-serif; display: block;}
span.green{color: #8bc53f;}
span.blue{color: #00b5b5;}
span.orange{color: #e58924;}
.about-us-list h2{margin-top: 13px; margin-bottom: 16px; font-size: 21px; line-height: 28px; font-family: 'Gotham-Bold', sans-serif; }
.about-us-desc{font-size: 18px; line-height: 34px;}

.our-products-title{padding: 83px 0 106px;}
.products-title-image{max-width: 674px; margin-bottom: 30px;}
.our-products-title h2{margin-bottom: 17px;}
.our-careers-post{margin-bottom: 40px;}
.our-careers-pos{padding: 120px 115px 118px; height: 100%; color: #ffffff;}
.our-careers-text h2{color: #ffffff; margin-bottom: 13px;}
.our-careers-text .button{min-width: 193px;}
.careers-grid-text{color: #ffffff;}
.careers-grid-text h3{color: #ffffff; margin-bottom: 1px;}
.careers-grid-text p:not(:last-child){margin-bottom: 19px;}


/*-- media css starts here --*/
@media only screen and (min-width: 768px){
    .hero-banner-text h1{margin-bottom: 29px;}
    .about-us-heading{max-width: 638px; margin-bottom: 64px;}
    .our-careers-pos{max-width: 745px; min-height: 477px;}
    .careers-grid-pos{padding: 70px; min-height: 353px; align-items: flex-end;}
}
@media only screen and (min-width: 1024px){
    .hero-banner-main{max-width: 843px; min-height: 836px; padding-top: 0;}
    .default-video{margin-bottom: 109px; margin-top: 0;}
    .about-us-main{margin-top: -118px;}
    .about-us-lists{width: 472px; padding-top: 7px;}
    .about-us-list{width: 50%; padding-right: 18px; padding-bottom: 23px;}
    .about-us-desc{width: calc(100% - 472px); }
    .our-careers-grid{width: calc(50% - 20px); margin: 0 20px 40px;}
    .our-careers-grid:nth-child(odd){margin-left: 0;}
    .our-careers-grid:nth-child(even){margin-right: 0;}
    .our-careers-text p:not(:last-child){margin-bottom: 36px;}
    .sample-intro-main{padding: 64px 0 50px;}
    .sample-intro-text h2{margin-bottom: 20px;}
    .our-products-title{max-width: 800px;}
}
@media only screen and (max-width: 1299px) and (min-width: 1024px){
    .our-careers-pos{padding: 121px 70px 118px;}
}
@media only screen and (max-width: 1023px) and (min-width: 768px){
    .hero-banner-main{padding-top: 256px; min-height: 747px;}
    .hero-banner-text{padding: 0 9px;}
    .hero-banner-text h1{margin-bottom: 18px;}
    .hero-banner-text h1 span{font-size: 77px;}
    .default-video{margin: -98px auto 115px; max-width: 671px;}
    .about-us-main{margin-top: -58px; padding: 0 0 100px;}
    .about-us-heading{max-width: 100%; margin-bottom: 38px;}
    .about-us-list{width: 33.3333%; padding-right: 20px; margin-bottom: 23px;}
    .about-us-list span{margin-bottom: 11px;}
    .about-us-desc{max-width: 563px;}
    .about-us-desc p:not(:last-child){margin-bottom: 31px;}
    .our-products-title{padding: 31px 0 22px;}
    .our-products-title h2{margin-bottom: 10px;}
    .our-products-title p:not(:last-child){margin-bottom: 34px;}
    .products-title-image{margin-bottom: 48px; max-width: 528px;}
    .our-careers-post-wrap{width: 100%; padding: 0 0 60px; flex-direction: column-reverse; align-items: flex-start; display: flex;}
    .our-careers-post{height: 619px; margin-bottom: 18px;}
    .our-careers-pos{padding: 121px 62px 62px; align-items: flex-end;}
    .our-careers-text{max-width: 525px;}
    .our-careers-text h2{margin-bottom: 7px;}
    .our-careers-text p:not(:last-child){margin-bottom: 25px;}
    .our-careers-grid{width: calc(50% - 9px); margin: 0 9px 40px;}
    .our-careers-grid:nth-child(odd){margin-left: 0;}
    .our-careers-grid:nth-child(even){margin-right: 0;}
    .careers-grid-pos{padding: 20px 37px 43px; height: 100%;}
    .careers-grid-text{font-size: 15px; line-height: 30px;}
    .careers-grid-text h3{line-height: 38px;}
}
@media only screen and (max-width: 767px) and (min-width: 480px){
    .hero-banner-text{max-width: 345px;}
    .default-video{margin-top: -51px;}
    .default-video-img{height: 270px;}
    .about-us-list:nth-child(3n+3){width: 100%;}
    .our-products-title .products-title-image{margin: 0 auto 50px; position: static; transform: none;}
}
@media only screen and (max-width: 767px) and (min-width: 200px){
    .hero-banner-main{min-height: 611px; padding-top: 121px;}
    .hero-banner-text h1{margin-bottom: 35px;}
    .default-video{margin-top: -20px; margin-bottom: 92px;}
    span.optional-text{margin-bottom: 28px;}
    .about-us-main{padding: 0 0 80px;}
    .about-us-bg{left: -312px; top: 23px; width: 593px; height: 502px;}
    .about-us-province{display: block;}
    .about-us-lists{margin-bottom: 19px;}
    .about-us-list h2{padding-top: 1px;}
    .about-us-heading{margin-bottom: 49px;}
    .about-us-list:first-child{min-width: 188px;}
    .about-us-list{margin-bottom: 8px;}
    .our-products-title{padding: 34px 0 80px;}
    .our-products-title h2{margin-bottom: 20px;}
    .our-products-title p:not(:last-child){margin-bottom: 32px;}
    .products-title-image {width: 475px;margin-bottom: 50px;left: 50%;position: relative;transform: translateX(-50%);}
    .our-careers-post{min-height: 647px; margin-bottom: 15px;}
    .our-careers-post picture.object-fit img{object-position: 0 0; -o-object-position: 0 0;}
    .our-careers-pos{padding: 121px 43px 40px 39px; min-height: 647px; align-items: flex-end;}
    .our-careers-text{line-height: 30px;}
    .our-careers-text h2{font-size: 28px; margin-bottom: 11px;}
    .our-careers-text p:not(:last-child){margin-bottom: 20px;}
    .our-careers-grids{display: block;}
    .our-careers-grid{margin-bottom: 15px; min-height: 363px;}
    .careers-grid-text{line-height: 30px;}
    .careers-grid-pos{padding: 30px; min-height: 363px; align-items: flex-end;}
    .sample-intro-main{padding: 66px 0 6px;}
    .sample-intro-text{margin-bottom: 50px;}
    .sample-intro-text p:not(:last-child){margin-bottom: 21px;}
}