*{
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
    margin: 0;
    max-width: 2143px;
    padding: 0;
}
section{
    margin-bottom: .1em;
}

/* Top section */

.header-top-color{
    background-color: #1A2D2C; 
}
.header-top{
    height: 43px;
    margin: 0 5em 0 3em;
    padding: 9px;
}
.header-top a{
    color: white;
    text-decoration: none;
}
.header-top-left{
    float: left;
}
.header-top-right{
    float: right;
}
.header-top-right a{
    padding-left: 10px;
}
.header-bottom-color{
    background-color: #FFF; 
}
.header-bottom{
    background-color: #FFF;
    display:flex;
    height: 69px;
    margin: -1.5em 5em 0 3em;
}
.header-bottom-text{
    background-color: #FFF;
    color: black;
    flex: 1 1 120px;
    padding: 2em .3em;
    text-decoration: none;
    text-align: center;
}
.header-bottom .inquiry{
    background-color: #B98307;
    width: 150px;
}
.header-bottom a:active{
    border-left: 2px solid rgba(255, 0, 53, 0.699);
    color: rgba(255, 0, 53, 0.699);
}
.header-bottom a:hover{
    border-left: 2px solid rgba(255, 0, 0, 0.815);
    color: rgba(255, 0, 0, 0.815);
}

.top-banner-color{
    background-color: #B3C9C7;
}
.top-banner-color h4{
    background-color: #C3D0CA;
    display: inline-block;
    margin-left: 3em;
    padding: 10px 12px;
}
.top-banner{
    background-color: #B3C9C7;
    height: auto;
    margin: -.1rem 3rem 0;
    overflow: hidden;
    padding: 6em .2em 4em;
}
.top-banner-text{
    background-color: #B3C9C7;
    color: #1A2D2C;
    float: left;
}
.top-banner-text h3{
    background-color: #B3C9C7;
    font-size: 2em;
}
.top-banner-text h1{
    background-color: #B3C9C7;
    color: #B9AEA9;
    font-size: 4.8em;
}
.top-banner-text p{
    background-color: #B3C9C7;
    padding-bottom: 1em;
}
.top-banner-text button{
    background-color: #B3C9C7;
    border-left: 8px solid #B98307;
    cursor: pointer;
    height: 49px;
    margin-top: 1.7em;
    outline:2px solid #2B2423;
    width: 165px;
}
.top-banner-img{
    float: right;
    margin: .5em 5em;
    width: 380px;
}
.top-banner-img img{
    height: auto;
    width: 100%;
}

/* second section */

.second-banner-color{
    background-color: #C3D0CA;
}
.second-banner{
    background-color: #C3D0CA;
    height: auto;
    margin: -.1em 5em 0 3em;
    overflow: hidden;
    padding-bottom: 5em;
}
.second-banner-nav{
    background-color: #1A2D2C;
    display: flex;
    height: 93px;
    margin-bottom: 2em;
    text-align: center;
}
.second-banner-nav-item{
    border-right: 1px solid lightgray;
    color: #A89C98;
    flex: 1 1 auto;
    padding: 44px 5px 38px;
    text-decoration: none;
}
.second-banner-nav-item:hover{
    border-left: 3px solid #AE7B0A;
    color: #AE7B0A;
}
.second-banner-text{
    background-color: #C3D0CA;
    float: left;
    overflow: hidden;
}
.second-banner-text .second-banner-text-tag{
    background-color: #C3D0CA;
    border-left: 6px solid  #AE7B0A;
    margin-bottom: 1.4em;
    padding: 5px;
}
.second-banner-text-tag p{
    background-color: #C3D0CA;
    font-size: 1.2em;
}
.second-banner-text-tag h3{
    background-color: #C3D0CA;
    font-size: 2em;
    margin-top: -25px;
}
.second-banner-text p{
    background-color: #C3D0CA;
    margin-bottom: 1.5em;
}
.second-banner-text-flex{
    background-color: #B9AEA9;
    display: flex;
    max-width: 470px;
    padding: 15px;
}
.second-banner-text-flex a{
    background-color: #B9AEA9;
    color: #2B2423;
    flex: 1 1 150px;
    text-decoration: none;
}
.second-banner-text-flex a span{
    background-color: #B9AEA9;
    font-size: 1.6em;
}
.second-banner-text button{
    background-color: #C3D0CA;
    border-left: 8px solid #B93520;
    cursor: pointer;
    height: 49px;
    margin-top: 1.7em;
    outline:2px solid #2B2423;
    width: 165px;
}
.second-banner-img{
    background-color: #C3D0CA;
    background-size: cover;
    float: right;
}
.second-banner-img-first{
    background-color: #C3D0CA;
    border: 1px solid lightgray;
    height: 374px;
    left: 200px;
    max-width: 412px;
    position: relative;
    top: 0;
}
.second-banner-img-second{
    background-color: #C3D0CA;
    border: 1px solid lightgray;
    max-width: 208px;
    max-height: 175px;
    position: relative;
    right: 320px;
    top: 80px;
}

/* third section */

.third-banner-color{
    background-color: #B9AEA9;
    margin-top: -.1em;
    overflow: hidden;
}
.third-banner{
    background-color: #B9AEA9;
    height: auto;
    margin: 2em 5em 5em 3em;
    overflow: hidden;
    padding-bottom: 5em;
}
.third-top-banner{
    background-color: #B9AEA9;
    border-bottom: 1px solid gray;
    display: flex;
}
.third-top-banner-1{
    border-left: 6px solid  #AE7B0A;
    background-color: #B9AEA9;
    font-size: 1.2em;
    padding: .5em;
    
}
.third-top-banner-2{
    background-color: #B9AEA9;
    padding: .5em 2em .5em 1em;
    word-spacing: 3px;
}
.third-top-banner-3{
    background-color: #B9AEA9;
    padding-left: 1em;
}
.third-body-banner, .third-body-banner-1 a, .third-body-banner-2, .third-body-banner-2 p, .third-body-banner-3, .third-body-banner-3 p {
    background-color: #B9AEA9;
}
.third-body-banner{
    display: grid;
    grid-template-columns: 2fr 5fr 3fr;
    grid-template-rows: 100px;
    height: auto;
    margin-top: 2em;
    padding-bottom: 10em;
}
.third-body-banner-1{
    background-color: #E5E8ED;
    display: grid;
    font-size: 1.5em;
    height: 350px;
    text-decoration: none;
}
.third-body-banner-1 a:hover:after{
    content:'NEW';
    text-decoration: none;
    background-color: rgb(136, 6, 6);
    color: rgb(230, 225, 225);
    height: 50px;
    padding: 5px;
    width: 180px;
}
.third-body-banner-2 img{
    background-color: #B9AEA9;
    height: auto;
    max-width: 100%;
    margin-bottom: -.2em;
}
.third-body-banner-2 p, .third-body-banner-3 p{
    background-color: #B9AEA9;
    color: black;
    display: inline-block;
    padding: 10px;
}
.third-body-banner-3{
    height: auto;
    width: 100%;
}
.third-body-banner-3 img{
    width: 100%;
    height: 128px;
}

/* fourth section */

.fourth-banner-color{
    background-color: #BBCECA;
}
.fourth-banner{
    background-color: #BBCECA;
    height: auto;
    margin: -.1em 3em 0;
    overflow: hidden;
    padding: 5em 0;
}
.fourth-banner-top-title{
    background-color: #CCA309;
    display: flex;
    margin: 2em 0 3em;
}
.fourth-banner-top-title .item{
    background-color: #CCA309;
    flex: 1 1 auto;
}
.fourth-banner-top-title img{
    /* background-color: #CCA309; */
    margin: 0 auto;
    position: relative;
    top: -80px;
}
.fourth-banner-top-title p, h4, button{
    background-color: #CCA309;
    color: white;
}
.fourth-banner-top-title-2{
    padding: 1em;
}
.fourth-banner-top-title-3{
    padding : 1em 1em 1em 0;
}
.fourth-banner-top-title-3 button{
    border-left: 8px solid #B93520;
    cursor: pointer;
    height: 49px;
    outline:2px solid #2B2423;
    width: 165px;
}
.fourth-banner-title{
    background-color: #BBCECA;
    margin-bottom: 4em;
    text-align: center;
}
.fourth-banner-title p{
    background-color: #BBCECA;
    font-size: 1.5em;
}
.fourth-banner-title h3{
    background-color: #BBCECA;
    border-bottom: 6px solid #CCA309;
    display: inline-block;
    font-size: 2.5em;
}
.fourth-banner-body{
    background-color: #BBCECA;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 50px;
    margin: 1em auto 30em;
    padding: 2em 3em;
}
.fourth-banner-body-1, .fourth-banner-text-1 p, .fourth-banner-text-1 h4, .fourth-banner-text-2 p, .fourth-banner-text-2 h4{
    background-color: #CCD9D3;
}
.fourth-banner-text-1{
    background-color: #CCD9D3;
    padding: 25px;
    text-align: center;
}
.fourth-banner-text-2{
    background-color: #CCD9D3;
    padding: 25px;
    text-align: center;
}
.fourth-banner-body-1 .img-1, .fourth-banner-body-1 .img-2{
    height: 63px;
    left: 20px;
    position: relative;
    top: -160px;
    width: 71px;
}
.fourth-banner-body-2{
    background-color: #CCD9D3;
    margin: 0 auto;
}
.fourth-banner-body-2 img{
    background-color: #BBCECA;
    max-height: 400px;
    max-width: 250px;
}
.fourth-banner-body-3 .img-3, .fourth-banner-body-3 .img-4{
    height: 63px;
    left: 340px;
    position: relative;
    top: -160px;
    width: 71px;
    
}

/* fifth section */

.fifth-banner-color{
    background-color: #CCD9D3;
}
.fifth-banner{
    height: 1000px;
    margin: -.1em 3em 0;
    overflow: hidden;
    padding: 5em 0;
}
.fifth-top-banner, .fifth-body-banner{
    display: flex;
}
.fifth-top-banner .fifth-1, .fifth-body-banner .fifth-2{
    flex: 1 1 auto;
}
.fifth-top-banner .fifth-top-img img{
    height: auto;
    width: 100%;
}
.fifth-top-banner .fifth-top-text{
    background-color: #1A2D2C;
    height: auto;
    padding: 2em 5em 3em 4em;
    width: 100%;
}
.fifth-top-text h3{
    border-left: 6px solid #CCA309;
    color: white;
    margin-bottom: .7em;
    padding-left: 1em;
    word-spacing: 4px;
}
.fifth-top-text p{
    color: white;
    padding-right: auto;
    margin-bottom: 1em;
}
.fifth-top-text button{
    background-color: #CC4228;
    color: white;
    cursor: pointer;
    font-size: 1.2em;
    height: 51px;
    width: 168px;
}
.fifth-body-banner .fifth-body-text{
    height: auto;
    padding: 5em 2em 0 0;
    width: 100%;
}
.fifth-body-text h3{
    color: #CC4228;
    font-size: 1.4em;
    margin-bottom: 1em;
    word-spacing: .5em;
}
.fifth-body-text .p{
    font-size: 2em;
}
.fifth-body-text input{
    background-color: #CCD9D3;
    height: 2em;
    max-width: 450px;
    margin-bottom: 2em;
}
.fifth-body-text button{
    border-left: 6px solid #CC4228;
    background-color: #CCD9D3;
    cursor: pointer;
    color: black;
    height: 51px;
    font-size: 1.2em;
    width: 168px;
}
.fifth-body-banner .fifth-body-img{
    max-width: 540px;
    max-height: 460px;
}
.fifth-body-banner .fifth-body-img img{
    height: auto;
    margin-left: 2em;
    width: 100%;
}

/* sixth section */

.sixth-banner-color{
    background-color: #ACA5A2;
}
.sixth-banner{
    height: 500px;
    margin: -.1em 3em 0;
    overflow: hidden;
    padding: 5em 0;
}
.sixth-banner-text{
    font-size: 1.2em;
    text-align: center;
    margin-bottom: 3em;
}
.sixth-banner-text h3{
    border-bottom: .3em solid #CC4228;
    display: inline-block;
}
.sixth-banner-body{
    text-align: center;
}
.sixth-banner-body img{
    height: 80px;
    padding: 10px;
    width: 180px;
}

/* Footer section */

.footer-banner-color{
    background-color: #1A2D2C;
}
.footer-banner{
    height: auto;
    margin: -.1em 3em 0;
    overflow: hidden;
    padding: 5em 0;
}
.footer-top-title{
    color: white;
    display: flex;
    margin-bottom: 3em;
}
.footer-top-title img{
    height: 69px;
    width: 69px;
}
.footer-top-title .footer-top-item{
    flex: 0 1 250px;
    margin: 1em auto;
}
.footer-top-title .first{
    margin: 1em auto 1em .3em;
    padding: 0 1em;
}
.footer-top-title a{
    color: white;
    text-decoration: none;
}
.footer-banner .footer-body{
    color: white;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 2em;
    margin-bottom: 12em;
    word-spacing: 3px;
}
.footer-body span{
    font-size: 1.5em;
    padding: .3em;
    cursor: pointer;
}
.footer-body span:hover{
    color: #CCA309;
}
.footer-body-2 a, .footer-body-3 a{
    color: white;
    display: block;
    padding: 1em;
    text-decoration: none;
}
.footer-body-2 a:hover, .footer-body-3 a:hover{
    border-left: 2px solid #CCA309;
    color: #CCA309;
}
.footer-banner .footer-bottom{
    background-color: #261E1B;
    color: white;
    overflow: hidden;
    padding: 15px;
    text-align: center;
}