/* 1ST SECTION: ABOUT US LANDING PAGE  */

.aboutuslanding {
    background-color: #efe8dc;
    padding: 1.5% 0% 2% 0%;
}

.aboutuslandingcontentcontainer {
    display: grid;
    /* grid-template-rows: 1fr 1fr; */
    position: relative;
    height: 85vh;
}

.aboutuslandingcontent {
    display: grid;
    grid-area: 1 / 1 / 1 / 1;
    grid-template-columns: 1fr 1fr;
    z-index: 1;

}

.aboutuslandingbackground {
    grid-area: 1 / 1 / 1 / 1;
    display: grid;
    grid-template-rows: 1fr 1fr;

}


.aboutuslandingcaptiontitle {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
}



.aboutustitle {
    display: flex;
    align-items: center;
    padding-left: 19%;
    padding-bottom: 20%;
}

.aboutustitle h1 {
    font-weight: 300;
    letter-spacing: 1.5rem;
    color: #f03b1c;
    font-size: 2.6rem;
}

.aboutuscaption1 {
    text-align: left;
    color: #1a1a1a;
    font-size: 1rem;
    padding: 5% 10% 10% 25%;
    line-height: 1.4rem;
}

.aboutuscaptiontext1 {
    font-weight: 500;

}


.aboutustitlejapancontainer {
    display: flex;
    justify-content: center;
    padding-left: 1rem;
    padding-top: 2%;
}


.aboutustitlejapan {
    max-width: 160px;

}

.aboutustitlejapan h1 {
    font-family: 'Zen Antique Soft', serif;
    writing-mode: vertical-rl;
    text-orientation: upright;
    font-size: 2.8rem;
    letter-spacing: 10px;
    color: #f03b1c;
}



.aboutusbackgroundelementcontainer1 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
    z-index: 6;
}

.aboutusbackgroundelement1 {
    position: absolute;
    max-width: 400px;
    left: -3%;
    top: 60%;
}

.aboutusbackgroundelement1 img {
    width: 100%;
}

.aboutusmountainicon1 {
    display: flex;
    position: absolute;
    max-width: 150px;
    left: 85%;
    top: 40%;
    opacity: 0.1;
}

.aboutusmountainicon1 img {
    width: 100%;
}

.aboutusmountainicon2 {
    display: flex;
    position: absolute;
    max-width: 150px;
    left: 9%;
    top: 25%;
    opacity: 0.25;
}

.aboutusmountainicon2 img {
    width: 100%;
}

.aboutusmountainicon3 {
    display: flex;
    position: absolute;
    max-width: 180px;
    left: 73%;
    top: 0%;
    margin-right: -10%;
    opacity: 0.2;
}

.aboutusmountainicon3 img {
    width: 100%;
}

.aboutusmountainicon4 {
    display: flex;
    position: absolute;
    max-width: 200px;
    left: -2%;
    opacity: 0.1;
    top: 30%;
}

.aboutusmountainicon4 img {
    width: 100%;
}

.aboutusmountainicon5 {
    display: flex;
    position: absolute;
    max-width: 240px;
    left: 65%;
    top: 20%;
    opacity: 0.15;
    margin-left: -1%;
}

.aboutusmountainicon5 img {
    width: 100%;
}

.aboutusbackgroundelementcontainer2 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
}

.aboutusbackgroundelement2 {
    max-width: 450px;
    display: flex;
    justify-self: end;
    align-items: baseline;
    margin-right: -6%;
    position: absolute;
    top: 5%;
    right: 4%;
    opacity: 0.7;
}

.aboutusbackgroundelement2 img {
    width: 150%;
}

.aboutusbackgroundelement3 {
    max-width: 450px;
    display: flex;
    justify-self: end;
    align-items: baseline;
    margin-right: -6%;

}

.aboutusbackgroundelement3 img {
    width: 100%;
}

.aboutusbackgroundelement4 {
    max-width: 500px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    right: 10%;
    top: 25%;
    opacity: 0.4;
}

.aboutusbackgroundelement4 img {
    width: 100%;
}

/* END OF 1ST SECTION  */


/* 2ND SECTION: ABOUT US 2ND PAGE  */

.aboutus2landing {
    background-color: #efe8dc;
    padding: 1.5% 0% 2% 0%;
}

.aboutus2contentcontainer {
    display: grid;
    /* grid-template-rows: 1fr 1fr; */
    position: relative;
    height: 85vh;
}

.aboutus2content {
    display: grid;
    grid-area: 1 / 1 / 1 / 1;
    grid-template-rows: 1fr 1fr;
    z-index: 1;
    height: 70vh;
}

.aboutus2landingbackground {
    grid-area: 1 / 1 / 1 / 1;
    display: grid;
    grid-template-rows: 1fr 1fr;

}

/* CONTENT  */


.aboutuscupiconcontainer {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 0% 50% 3% 10%;
}

.aboutuscupicon {
    max-width: 150px;
    display: grid;
    justify-self: center;
    align-items: center;
}

.aboutuscupicon img {
    width: 100%;
}

.cup2-1 {
    padding-bottom: 80%;
}

.cup2-2 {
    padding-top: 60%;
}

.cup2-3 {
    padding-top: 0%;
}


.aboutuscaption2 {
    text-align: right;
    color: #1a1a1a;
    font-size: 1rem;
    padding: 5% 10% 7% 60%;
    line-height: 1.4rem;
}

.aboutuscaptiontext2 {
    font-weight: 500;

}






/* BACKGROUND */

.aboutus2backgroundelementcontainer1 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
    z-index: 6;
}

.aboutus2backgroundelement1 {
    position: absolute;
    max-width: 400px;
    left: 20%;
    top: 0%;
}

.aboutus2backgroundelement1 img {
    width: 100%;
}

.aboutus2mountainicon1 {
    display: flex;
    position: absolute;
    max-width: 150px;
    left: 85%;
    top: 40%;
    opacity: 0.1;
}

.aboutus2mountainicon1 img {
    width: 100%;
}

.aboutus2mountainicon3 {
    display: flex;
    position: absolute;
    max-width: 180px;
    left: 73%;
    top: 0%;
    margin-right: -10%;
    opacity: 0.2;
}

.aboutus2mountainicon3 img {
    width: 100%;
}

.aboutus2mountainicon4 {
    display: flex;
    position: absolute;
    max-width: 300px;
    left: -2%;
    opacity: 0.1;
    top: 0%;
}

.aboutus2mountainicon4 img {
    width: 100%;
}

.aboutus2mountainicon5 {
    display: flex;
    position: absolute;
    max-width: 240px;
    left: 65%;
    top: 40%;
    opacity: 0.15;
    margin-left: -1%;
}

.aboutus2mountainicon5 img {
    width: 100%;
}

.aboutus2backgroundelementcontainer2 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
}

.aboutus2backgroundelement2 {
    max-width: 450px;
    display: flex;
    justify-self: end;
    align-items: baseline;
    margin-right: -6%;
    position: absolute;
    top: 5%;
    right: 4%;
    opacity: 0.7;
}

.aboutus2backgroundelement2 img {
    width: 150%;
}

.aboutus2backgroundelement3 {
    max-width: 450px;
    display: flex;
    justify-self: end;
    align-items: baseline;
    margin-right: -6%;

}

.aboutus2backgroundelement3 img {
    width: 100%;
}

.aboutus2backgroundelement4 {
    max-width: 500px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    right: 2%;
    top: 32%;
    opacity: 0.4;
}

.aboutus2backgroundelement4 img {
    width: 100%;
}

.aboutus2backgroundelement5 {
    max-width: 450px;
    display: flex;
    position: relative;
    margin-right: -6%;
    top: -80%;
    left: 4%;
    opacity: 0.5;
}

.aboutus2backgroundelement5 img {
    width: 100%;
}

.aboutus2backgroundelement6 {
    max-width: 500px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    left: 2%;
    top: 32%;
}

.aboutus2backgroundelement6 img {
    width: 100%;
}

/* END OF 2ND SECTION  */


/* 3RD SECTION: ABOUT US 3RD PAGE  */

.aboutus3landing {
    background-color: #efe8dc;
    padding: 1.5% 0% 2% 0%;
}

.aboutus3contentcontainer {
    display: grid;
    /* grid-template-rows: 1fr 1fr; */
    position: relative;
    height: 85vh;
}

.aboutus3content {
    display: grid;
    grid-area: 1 / 1 / 1 / 1;
    grid-template-rows: 1fr 1fr;
    z-index: 1;
}

.aboutus3landingbackground {
    grid-area: 1 / 1 / 1 / 1;
    display: grid;
    grid-template-rows: 1fr 1fr;

}

/* CONTENT  */

.aboutuspeopleiconcontainer {
    padding: 10% 0% 0% 0%;
}

.aboutuspeopleicon {
    display: grid;
    max-width: 80px;
    justify-self: left;
    align-items: end;
    position: relative;
    margin-left: -25%;
}


.aboutuspeopleicon img {
    width: 100%;
}


.aboutuscaption3 {
    text-align: left;
    color: #1a1a1a;
    font-size: 1rem;
    padding: 5% 62% 7% 10%;
    line-height: 1.4rem;
}

.aboutuscaptiontext3 {
    font-weight: 500;
}


/* BACKGROUND */

.aboutus3backgroundelementcontainer1 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
    z-index: 6;
}

.aboutus3backgroundelement1 {
    position: absolute;
    max-width: 400px;
    left: 60%;
    top: 0%;
}

.aboutus3backgroundelement1 img {
    width: 100%;
}

.aboutus3mountainicon1 {
    display: flex;
    position: absolute;
    max-width: 150px;
    left: 25%;
    top: 40%;
    opacity: 0.1;
}

.aboutus3mountainicon1 img {
    width: 100%;
}

.aboutus3mountainicon3 {
    display: flex;
    position: absolute;
    max-width: 180px;
    left: 15%;
    top: 0%;
    margin-right: -10%;
    opacity: 0.2;
}

.aboutus3mountainicon3 img {
    width: 100%;
}

.aboutus3mountainicon4 {
    display: flex;
    position: absolute;
    max-width: 300px;
    right: -2%;
    opacity: 0.1;
    top: 17%;
}

.aboutus3mountainicon4 img {
    width: 100%;
}

.aboutus3mountainicon6 {
    display: flex;
    position: absolute;
    max-width: 200px;
    left: -2%;
    opacity: 0.1;
    top: 12%;
}

.aboutus3mountainicon6 img {
    width: 100%;
}

.aboutus3mountainicon5 {
    display: flex;
    position: absolute;
    max-width: 400px;
    left: 35%;
    top: 0%;
    opacity: 0.15;
    margin-left: -1%;
}

.aboutus3mountainicon5 img {
    width: 100%;
}

.aboutus3backgroundelementcontainer2 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
}

.aboutus3backgroundelement2 {
    max-width: 450px;
    display: flex;
    justify-self: end;
    align-items: baseline;
    margin-right: -6%;
    position: absolute;
    top: 5%;
    left: -4%;
    opacity: 0.7;
}

.aboutus3backgroundelement2 img {
    width: 150%;
}

.aboutus3backgroundelement3 {
    max-width: 450px;
    display: flex;
    position: absolute;
    /* justify-self: end;
    align-items: baseline; */
    left: 2%;
    top: 30%;

}

.aboutus3backgroundelement3 img {
    width: 100%;
}

.aboutus3backgroundelement4 {
    max-width: 500px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    right: 15%;
    top: 32%;
    opacity: 0.4;
}

.aboutus3backgroundelement4 img {
    width: 100%;
}

.aboutus3backgroundelement5 {
    max-width: 200px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    left: 85%;
    top: 50%;
}

.aboutus3backgroundelement5 img {
    width: 100%;
}

.aboutus3backgroundelement6 {
    max-width: 500px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    left: 75%;
    top: 25%;
}

.aboutus3backgroundelement6 img {
    width: 100%;
}

/* END OF 3RD SECTION  */


/* 4TH SECTION: ABOUT US 4TH PAGE  */

.aboutus4landing {
    background-color: #efe8dc;
    padding: 1.5% 0% 2% 0%;
}

.aboutus4contentcontainer {
    display: grid;
    /* grid-template-rows: 1fr 1fr; */
    position: relative;
    height: 85vh;
}

.aboutus4content {
    display: grid;
    grid-area: 1 / 1 / 1 / 1;
    z-index: 1;
}

.aboutus4landingbackground {
    grid-area: 1 / 1 / 1 / 1;
    display: grid;
    grid-template-rows: 1fr 1fr;

}

/* CONTENT  */

.aboutussuniconcontainer {
    padding: 10% 0% 0% 15%;
}

.aboutussunicon {
    display: grid;
    max-width: 80px;
    justify-self: left;
    align-items: end;
    position: relative;
    margin-left: -25%;
    rotate: 30deg;
}


.aboutussunicon img {
    width: 100%;
}


.aboutuscaption4 {
    text-align: right;
    color: #1a1a1a;
    font-size: 1rem;
    padding: 0% 10% 7% 60%;
    line-height: 1.4rem;
}

.aboutuscaption4 h3 {
    text-align: right;
    color: #f03b1c;
    font-size: 1.3rem;
    margin-top: 5%;
}

.aboutuscaption4 a:link {
    color: #f03b1c;
}

.aboutuscaption4 a:visited {
    color: #f03b1c;
}

.aboutuscaption4 a:hover {
    color: rgb(162, 162, 162);
}

.aboutuscaption4 a:active {
    color: #f03b1c;
}

.aboutuscaptiontext4 {
    font-weight: 500;
}

.aboutuscaptiontextbold4 {
    font-weight: 700;
}


/* BACKGROUND */

.aboutus4backgroundelementcontainer1 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
    z-index: 6;
}

.aboutus4backgroundelement1 {
    position: relative;
    max-width: 260px;
    left: -6%;
    top: 0%;
}

.aboutus4backgroundelement1 img {
    width: 100%;
}

.aboutus4mountainicon1 {
    display: flex;
    position: absolute;
    max-width: 200px;
    left: -2%;
    top: 20%;
    opacity: 0.1;
}

.aboutus4mountainicon1 img {
    width: 100%;
}

.aboutus4mountainicon3 {
    display: flex;
    position: absolute;
    max-width: 230px;
    left: 10%;
    top: 0%;
    margin-right: -10%;
    opacity: 0.2;
}

.aboutus4mountainicon3 img {
    width: 100%;
}

.aboutus4mountainicon4 {
    display: flex;
    position: absolute;
    max-width: 300px;
    right: -2%;
    opacity: 0.1;
    top: 40%;
}

.aboutus4mountainicon4 img {
    width: 100%;
}

.aboutus4mountainicon6 {
    display: flex;
    position: absolute;
    max-width: 150px;
    right: -2%;
    opacity: 0.1;
    top: 20%;
}

.aboutus4mountainicon6 img {
    width: 100%;
}

.aboutus4mountainicon5 {
    display: flex;
    position: absolute;
    max-width: 400px;
    left: 35%;
    top: 0%;
    opacity: 0.15;
    margin-left: -1%;
}

.aboutus4mountainicon5 img {
    width: 100%;
}

.aboutus4backgroundelementcontainer2 {
    display: grid;
    /* grid-template-columns: 1fr 1fr; */
    overflow-x: hidden;
    position: relative;
}

.aboutus4backgroundelement2 {
    max-width: 450px;
    display: flex;
    justify-self: end;
    align-items: baseline;
    margin-right: -6%;
    position: absolute;
    top: 5%;
    left: -4%;
    opacity: 0.7;
}

.aboutus4backgroundelement2 img {
    width: 150%;
}

.aboutus4backgroundelement3 {
    max-width: 200px;
    display: flex;
    position: absolute;
    /* justify-self: end;
    align-items: baseline; */
    left: 20%;
    top: 30%;

}

.aboutus4backgroundelement3 img {
    width: 100%;
}

.aboutus4backgroundelement4 {
    max-width: 500px;
    position: relative;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    left: -2%;
    top: -40%;
    opacity: 0.4;
}

.aboutus4backgroundelement4 img {
    width: 100%;
}

.aboutus4backgroundelement5 {
    max-width: 300px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    left: 82%;
    top: 40%;
    opacity: 0.5;
}

.aboutus4backgroundelement5 img {
    width: 100%;
}

.aboutus4backgroundelement6 {
    max-width: 500px;
    position: absolute;
    /* display: flex; */
    /* justify-self: end;
    align-items: baseline; */
    left: 75%;
    top: 25%;
}

.aboutus4backgroundelement6 img {
    width: 100%;
}

.aboutus4backgroundelement7 {
    position: absolute;
    max-width: 260px;
    left: 60%;
    top: 0%;
}

.aboutus4backgroundelement7 img {
    width: 100%;
}



/* END OF 4TH SECTION  */



/* RESPONSIVE SECTION */

/* BIG IPAD 1100PX */

@media only screen and (max-width:1100px) {
    .aboutustitle {
        align-items: baseline;
        padding-top: 80%;
        padding-left: 0%;
    }

    .aboutuslandingcontent {
        grid-template-columns: 2fr 1fr;
    }

    .aboutustitlejapancontainer {
        justify-content: end;
        align-self: end;
        padding-right: 10%;
    }

    .aboutuslandingcontentcontainer {
        height: auto;
    }

    .aboutuscaption1 {
        padding-bottom: 0%;
    }

    .aboutuscaption2 {
        padding: 5% 10% 7% 40%;
    }

    .aboutus2contentcontainer {
        height: 60vh;
    }

    .aboutus2content {
        height: 60vh;
        display: flex;
        flex-direction: column;
        padding-top: 10%;
    }

    .aboutus2backgroundelement1 {
        position: relative;
        top: 0%;
        max-width: 300px;
        left: 5%;
    }

    .aboutus2backgroundelement5 {
        top: 0%;
    }

    .aboutus2backgroundelement6,
    .aboutus2mountainicon3 {
        display: none;
    }

    .aboutus3contentcontainer {
        height: 60vh;
    }

    .aboutuscaption3 {
        padding: 5% 47% 7% 10%;
    }

    .aboutuspeopleicon {
        margin-right: 90%;
    }

    .aboutus4contentcontainer {
        height: 60vh;
    }

    .aboutuscaption4 {
        padding: 5% 10% 7% 45%;
    }

    .aboutussunicon {
        margin-left: -50%;
    }
}


/* MEDIUM PHONE  */

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

    .aboutuslandingcaptiontitle {
        display: flex;
    }

    .aboutuslandingcontent {
        display: flex;
        flex-direction: column-reverse;
    }

    .aboutustitle {
        padding-left: 8%;
        padding-bottom: 2%;
        padding-top: 40%;

    }

    .aboutustitle h1 {
        font-size: 1.6rem;
        letter-spacing: 1rem;
    }

    .aboutuscaption1 {
        font-size: 0.7rem;
        padding: 10% 10% 0% 0%;
        line-height: 1rem;
    }

    .aboutuscaption2 {
        font-size: 0.7rem;
        padding: 10% 10% 20% 30%;
        line-height: 1rem;
    }

    .aboutuscaption3 {
        font-size: 0.7rem;
        padding: 0% 30% 0% 10%;
        line-height: 1rem;
    }

    .aboutuscaption4 {
        font-size: 0.7rem;
        padding: 10% 10% 0% 30%;
        line-height: 1rem;
    }

    .aboutus2landingbackground {
        grid-template-rows: initial;
    }

    .aboutus3contentcontainer {
        height: 45vh;
    }

    .aboutuspeopleicon {
        max-width: 40px;
        margin-left: -100%;
    }

    .aboutus4contentcontainer {
        height: 45vh;
    }

    .aboutus4content {
        display: initial;
    }

    .aboutussunicon {
        max-width: 40px;
        margin-left: -100%;
    }

    .aboutuscupiconcontainer {
        padding: 0% 30% 3% 20%;
    }

    .aboutusmountainicon1 {
        display: none;

    }

    .aboutusmountainicon2 {
        top: 15%;
        left: 15%;
        max-width: 130px;
    }

    .aboutusbackgroundelement1 {
        left: 35%;
        top: 15%;
        max-width: 200px;
    }

    .aboutusbackgroundelement4 {
        top: 0%;
    }

    .aboutusbackgroundelement2 {
        top: 45%;
        max-width: 200px;
    }

    .aboutusbackgroundelement3 {
        max-width: 200px;
        display: flex;
        justify-self: end;
        align-items: baseline;
        margin-right: -6%;
        margin-top: 30%;
    }

    .aboutus2backgroundelement1 {
        max-width: 200px;
        left: -20%;
    }

    .aboutus2mountainicon4 {
        max-width: 150px;
        left: 15%;
    }

    .aboutus2backgroundelement4 {
        display: none;
    }

    .aboutus2backgroundelement2 {
        top: 0%;
        max-width: 250px;
        right: 10%;
        opacity: 0.4;
    }

    .aboutus2backgroundelement3 {
        margin-top: 30%;
        max-width: 170px;

    }

    .aboutus2backgroundelement5 {
        max-width: 270px;
        opacity: 0.3;
    }

    .aboutus3backgroundelement1 {
        left: 80%;
        right: -40%;
        max-width: 170px;
    }

    .aboutus3mountainicon4 {
        max-width: 150px;
    }

    .aboutus3mountainicon6 {
        max-width: 150px;
        top: 0%;
    }

    .aboutus3backgroundelement2 {
        max-width: 150px;
        opacity: 0.3;
    }

    .aboutus3backgroundelement3 {
        max-width: 180px;
    }

    .aboutus3backgroundelement6 {
        display: none;
    }

    .aboutus3backgroundelement5 {
        top: 45%;
        left: 65%;
    }

    .aboutus3mountainicon5 {
        max-width: 100px;
    }

    .aboutus3mountainicon1 {
        max-width: 150px;
    }

    .aboutus3mountainicon3 {
        display: none;
    }

    .aboutus4backgroundelement1 {
        left: -40%;
    }

    .aboutus4backgroundelement7 {
        top: 5%;
        left: 50%;
        opacity: 0.3;
    }

    .aboutus4mountainicon4 {
        max-width: 120px;
        top: 70%;
        right: -10%;
    }

    .aboutus4backgroundelement4 {
        max-width: 200px;
    }

    .aboutus4backgroundelement5 {
        display: none;
    }

    .aboutus4backgroundelement3 {
        left: 60%;
        top: 13%;
        max-width: 150px;
    }

    .aboutus4mountainicon3{
        max-width: 150px;
        top: 10%;
    }

    .aboutus4mountainicon1{
        max-width: 100px;
        top: 0%;
    }

    
}