/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */button,hr,input{overflow:visible}progress,sub,sup{vertical-align:baseline}[type=checkbox],[type=radio],legend{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}details,main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}[hidden],template{display:none}
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-smooth [data-lenis-prevent]{-ms-scroll-chaining:none;overscroll-behavior:contain}.lenis.lenis-stopped{overflow:clip}.lenis.lenis-smooth iframe{pointer-events:none}
h2.noWrap {
    white-space: nowrap;
}
:root {
    --space: calc(100vw / 12);
    --spaceX: calc(var(--space) * 1);
    --spaceXX: calc(var(--space) * 2);
    --spaceS: calc(var(--space) * 0.5);
    --spaceXS: calc(var(--space) / 8);
    --headerHeight: 5.5rem;
    --spaceY:5.5625rem;
    --spaceHalf: 2.125rem;
    --white:#fff;
    --white60:rgb(255 255 255 / 60%);
    --backColor: #F5F6F7;
    --black:#000;
    --blue:#00546B;
    --pale-blue:rgba(0, 84, 107, 0.40);
    --brown:#E6b160;
    --yellow:#EF0;
    --green: #2A3230;
    --lightGreen: #719F94;
    --textColor: #231f20;
    --radius-box: 2.125rem;
    --font-size: 15px;
    --enFont:'Geomatrix', sans-serif;
    --img-width: 190px;
    --img-ratio: 1.1;
    --img-offset-x: 20px;
    --img-offset-y: 20px;
    --img-border-radius: 7px;
}
*, ::before, ::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;
}
@media (max-width: 699px) {
    :root {
        --font-size: 15px
    }
}

@media (min-width: 700px) and (max-width: 1024px) {
    :root {
        --font-size: 15px
    }
}

@media (min-width: 1025px) and (max-width: 1199px) {
    :root {
        --font-size: 15px
    }
}

@media (min-width: 1200px) and (max-width: 1599px) {
    :root {
        --font-size: 15px
    }
}

@media (min-width: 1600px) and (max-width: 1999px) {
    :root {
        --font-size: 17px
    }
}

@media (min-width: 2000px) and (max-width: 2399px) {
    :root {
        --font-size: 19px
    }
}

@media (min-width: 2400px) {
    :root {
        --font-size: 21px
    }
}
html{
    min-height: 100%;
    line-height: 1.3;
    color: var(--textColor);
    background-color: var(--white);
    font-size: var(--font-size);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition: background-color .3s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: background-color .3s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: background-color .3s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    width: 100%;
}
body {
    margin: 0;
    line-height: normal;
}
html,body,h1,h2,h3,h4,h5,h6,a,p,span,ul li,ol li,input,textarea{
    font-family: "AbarLowFaNum", sans-serif;
}
p.hasSpace {
    margin-bottom: 1rem !important;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    font-family: "AbarLowFaNum", sans-serif !important;
}
*:focus,*:focus-visible{
    outline: none !important;
}
a{
    color: inherit;
    text-decoration: none;
}
a:hover{
    text-decoration: none;
}
img,
video {
    max-width: 100%;
    height: auto;
}
strong.hasTop {
    margin-top: 1rem;
    display: block;
}
::-moz-selection{
    background-color: var(--blue);
    color: var(--white);
}
::selection{
    background-color: var(--blue);
    color: var(--white);
}
::-moz-selection{
    background-color: var(--blue);
    color: var(--white);
}
span.icon-arrow-btn {
    color: var(--white);
}
.text_item{
    font-size: 0.875rem;
    font-weight: 400;
}
.title_item{
    font-size: 3rem;
    font-weight: 800;
    line-height: normal;
}
.padding-s {
    padding-right: var(--spaceS);
    padding-left: var(--spaceS);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.padding-xs {
    padding-right: var(--spaceXS);
    padding-left: var(--spaceXS);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.padding-x {
    padding-right: var(--spaceX);
    padding-left: var(--spaceX);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.padding-xx {
    padding-right: var(--spaceXX);
    padding-left: var(--spaceXX);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
body {
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
html::-webkit-scrollbar {
    width: 6px;
}
html::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px var(--white);
    box-shadow: inset 0 0 6px var(--white);
}
html::-webkit-scrollbar-thumb {
    background-color: var(--blue);
    outline: 1px solid var(--blue);
    border-radius: 10px;
}
audio {
    display: none;
    visibility: hidden;
}
/*===========BREADCRUMB===========*/
.breadcrumb-wrapper {
    position: absolute;
    right: calc(var(--spaceX) + 1.87rem);
    z-index: 1;
    top: 9rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 400;
    color: #fff;
    margin-bottom: 1.5rem;
    mix-blend-mode: difference;
}
.breadcrumb-wrapper span:not(:last-child) {
    border: solid #ffffff;
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 3px;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    margin: .5rem;
    opacity: 1;
}
.breadcrumb-wrapper span {
    opacity: .6;
}
/*===========BREADCRUMB===========*/
/*===========HEADER===========*/
header {
    position: fixed;
    top: 3.37rem;
    left: var(--spaceX);
    width: calc(100vw - var(--spaceX) * 2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    z-index: 99;
    border-radius: 7.5rem;
    padding: 0 1.87rem;
    height: 4.5rem;
}
header::before {
    content: '';
    position: absolute;
    border-radius: 7.5rem;
    background: rgba(255, 255, 255, 0.20);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
}
header.changeLogoColor::before{
    background: rgba(0, 84, 107, 0.20);
}
header .identity{
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.header_nav_links_catalogue_wrapper {
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-column-gap: 4rem;
    -moz-column-gap: 4rem;
    column-gap: 4rem;
}
header .identity img {
    vertical-align: middle;
    width: 12.31438rem;
    -webkit-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
}
.header_nav_link_wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    height: 2.5rem;
    cursor: pointer;
}
.header_menu_wrap {
    width: 2.5rem;
    height: 100%;
    border-radius: 1.875rem 1.875rem 1.875rem 0rem;
    background: var(--brown);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    row-gap: 4px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
}
.header_menu_wrap span {
    width: 55%;
    background-color: var(--blue);
    display: block;
    height: 1px;
    -webkit-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
}
.header_nav_link_wrap p {
    font-size: 0.75rem;
    color: var(--brown);
    -webkit-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
}
.header_download_wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
    padding: 5px 1.5rem;
    background-color: var(--blue);
    border-radius: 1.6875rem;
}
.header_download_wrap span {
    font-size: 0.75rem;
    display: block;
    color: var(--brown);
}
header.changeLogoColor .identity img {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}
header.changeLogoColor .header_menu_wrap {
    background-color: var(--blue);
}
header.changeLogoColor .header_menu_wrap span {
    background-color: var(--brown);
}
header.changeLogoColor .header_nav_link_wrap p {
    color: var(--blue);
}
.header_nav_links_wrapper {
    position: relative;
}
.socialMediaWrapper {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-column-gap: .5rem;
    -moz-column-gap: .5rem;
    column-gap: .5rem;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.socialMediaWrapper img {
    width: 1.1rem;
}
.header_nav_links_body_wrapper {
    position: absolute;
    right: 2.5rem;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    /*border-radius: 0 0 0 3.125rem;*/
    background: rgba(230,177,96,0.68);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
    opacity: 0;
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
    pointer-events: none;
}

header.changeLogoColor .header_nav_links_body_wrapper {
    background: rgba(0, 84, 107, 0.50);
}

.header_nav_links_body_wrapper ul {
    list-style: none;
    margin: 0;
    padding: 1rem 2rem 1rem 4rem;
}

.header_nav_links_body_wrapper ul li a {
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 700;
    position: relative;
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
    color: var(--blue);
}
header.changeLogoColor .header_nav_links_body_wrapper ul li a {
    color: var(--white);
}
.header_nav_links_body_wrapper ul li a.current::before {
    content: '';
    width: 0.75rem;
    height: 0.75rem;
    position: absolute;
    right: -.5rem;
    top: 3px;
    background-color: var(--blue);
    border-radius: 1.875rem 1.875rem 1.875rem 0;
    -webkit-transform: translate(100%, 0);
    -ms-transform: translate(100%, 0);
    transform: translate(100%, 0);
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
}
header.changeLogoColor .header_nav_links_body_wrapper ul li a.current::before {
    background-color: var(--brown);
}
.header_nav_links_body_wrapper.open {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    pointer-events: auto;
}
.header_nav_link_wrap.active .header_menu_wrap span {
    opacity: 0;
}

.header_nav_link_wrap.active .header_menu_wrap span:first-child {
    opacity: 1;
    -webkit-transform: rotate(45deg) translate(4px, 3px);
    -ms-transform: rotate(45deg) translate(4px, 3px);
    transform: rotate(45deg) translate(4px, 3px);
}

.header_nav_link_wrap.active .header_menu_wrap span:last-child {
    opacity: 1;
    -webkit-transform: rotate(-45deg) translate(4px, -3px);
    -ms-transform: rotate(-45deg) translate(4px, -3px);
    transform: rotate(-45deg) translate(4px, -3px);
}

.header_nav_links_body_wrapper ul li a:hover {
    opacity: .5;
}
/*===========HEADER===========*/
/*===========HERO SECTION===========*/
section.heroVideoSection {
    position: relative;
    width: 100%;
    height: 100dvh;
    margin-bottom: 5rem;
}
section.heroVideoSection video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
#scroll .line {
    width: 100%;
    height: 70px;
    background-color: var(--brown);
    margin: 0 auto .5rem;
    overflow: hidden;
}
#scroll .line:after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 5px;
    height: 15px;
    background-color: var(--blue);
    -webkit-animation: 1.5s linear infinite forwards scrolldown;
    animation: 1.5s linear infinite forwards scrolldown;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
@-webkit-keyframes scrolldown {
    0% {
        top: -15px
    }

    100% {
        top: calc(100% + 10px)
    }
}
@keyframes scrolldown {
    0% {
        top: -15px
    }

    100% {
        top: calc(100% + 10px)
    }
}
#scroll_wrap {
    position: absolute;
    bottom: 2rem;
    right: var(--spaceX);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    row-gap: 1rem;
    mix-blend-mode: multiply;
}
#scroll_wrap span {
    font-size: .75rem;
    color: var(--blue);
}
#scroll {
    z-index: 2;
    height: 70px;
    overflow: hidden;
    width: 2px;
    position: relative;
}
main.pageWrapper {
    padding-top: 10rem;
}
main.pageWrapper section.sliderSectionWrapper {
    -webkit-column-gap: 5rem;
    -moz-column-gap: 5rem;
    column-gap: 5rem;
}
.sliderSectionInfoMediaWrapper p {
    margin-top: 0;
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 900;
    text-align: justify;
    margin-bottom: 0;
    line-height: 2;
}
.sliderSectionInfoWrapper .content_text p {
    margin: 0;
    text-align: justify;
    line-height: 2
}
.sliderSectionInfoMediaWrapper p.enText {
    text-align: left;
}
.sliderSectionInfoMediaWrapper > img {
    /* margin: 1.5rem auto; */
    display: block;
    /* border-radius: 3.125rem 3.125rem 3.125rem 0rem; */
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    height: 100%;
}
.sliderSectionTitle {
    margin-bottom: 1rem;
}

.sliderSectionTitle .title_item {
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 900;
    color: #719F94;
    position: relative;
}
.sliderSectionTitle .content_item p {
    font-weight: 400;
}
.sliderSectionInfoMediaWrapper .videoWrap {
    margin-top: 2rem;
    border-radius: 3.125rem 3.125rem 3.125rem 0;
    position: relative;
    width: 100%;
    height: 42vh;
}

.sliderSectionInfoMediaWrapper .videoWrap video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 3.125rem 3.125rem 3.125rem 0;
}

.sliderSectionTitle .title_item::before {
    content: '';
    width: 1.375rem;
    height: 1.375rem;
    position: absolute;
    border-radius: 1.875rem 1.875rem 1.875rem 0;
    background: #E5B35B;
    right: -.5rem;
    top: 0;
    -webkit-transform: translate(100%, 0);
    -ms-transform: translate(100%, 0);
    transform: translate(100%, 0);
}
.sliderSectionInfoMediaWrapper .imgWrapper {
    width: 85%;
    display: block;
    margin-left: 0;
    margin-right: auto;
}
section.sliderSectionWrapper {
    position: relative;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: .5fr .5fr;
    grid-template-columns: .5fr .5fr;
    margin-bottom: 5.5rem;
}

.sliderSectionInfoWrapper h2, section.sliderArchetypeContainer h2, section.imageTrailWrapper h2, section.colorsContainer h2, section.chartContainer h2,section.jingleBrandsContainer h2,section.sliderSectionContainer h1 {
    margin-top: 0;
    font-size: 3rem;
    line-height: 1.3;
    font-weight: 900;
    margin-bottom: 2.5rem;
    color: var(--blue);
}
section.sliderSectionContainer h1 {
    text-align: center;
    margin-bottom: 3.5rem;
}
.sliderSectionInfoWrapper .content_text {
    font-size: 0.875rem;
    text-align: justify;
}
.sliderSectionInfoMediaWrapper > video {
    width: 85%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
    margin-right: auto;
    margin-left: 0;
    display: block;
    /*border-radius: 3.125rem 3.125rem 3.125rem 0;*/
    margin-top: 5rem;
}
.sliderFooterSection {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 2rem;
    padding-bottom: 2rem;
    border: 1px solid var(--black);
    border-left: none;
    border-right: none;
}
.sliderFooterSection.full {
    width: calc(100% - var(--spaceXX) * 2);
    margin: 0 auto;
}
.sliderFooterSection a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
}
section.sliderSectionWrapper.first {
    margin-bottom: 3.5rem;
}
.sliderFooterSection a.nextSlide {
    background-color: var(--blue);
    padding: 7px 21px;
    border-radius: 1.6875rem;
    color: var(--brown);
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
}
.sliderFooterSection .prevPage {
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    color: var(--blue);
}
.sliderSectionInfoMediaWrapper .imgWrapper img {
    margin: 0;
}
.sliderFooterSection a.prevPage svg {
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
}
.sliderFooterSection a.prevPage svg path {
    fill: var(--blue);
}
section.sliderSectionWrapper.second {
    grid-gap: 1rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
section.sliderSectionWrapper.second.home h3 {
    font-size: 1.5rem;
    margin-bottom: 4rem;
    margin-top: 0;
    font-weight: 800;
    color: var(--blue);
}

.text-wrap {
    margin-bottom: 1.5rem;
}
.text-wrap > p:not(.text-box) {
    font-weight: 700;
    margin-bottom: 5px;
    /* color: var(--blue); */
}
.text-wrap p.text-box {
    padding-right: 9px;
    margin-top: 0;
}
.sliderSectionInfoWrapper video {
    /* border-radius: 3.125rem 3.125rem 3.125rem 0; */
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

/*===========HERO SECTION===========*/
/*===========TAB CONTAINER===========*/
section.sliderTabContainer {
    position: relative;
    width: 100%;
    display: block;
    margin-top: 8rem;
    margin-bottom: 6rem;
}
section.sliderTabContainer .sliderTabInfoWrapper {
    position: relative;
    width: 100%;
    /* height: 41vh; */
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap {
    text-align: center;
    color: var(--blue);
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    padding-bottom: 1rem;
    top: 0;
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap:nth-of-type(2) {
    position: relative;
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0;
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap p.enText {
    font-size: 4rem;
    font-style: normal;
    font-weight: 700;
    margin: 0;
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap .content_text_wrap {
    width: 55%;
    margin: 0 auto;
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap .content_text_wrap p {
    font-size: 1.25rem;
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap:first-child .content_text_wrap p {
    font-size: 0.875rem;
}
.slider_svg_container {
    position: relative;
    width: calc(100% - 10rem);
    margin: 0 auto;
}
.slider_svg_container img:not(:first-child) {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -o-object-fit: contain;
    object-fit: contain;
}
.slider_svg_container img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    vertical-align: middle;
    opacity: 0;
}
.slider_tab_box_wrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.slider_tab_box_wrapper .slider_tab_box_wrap {
    width: 10rem;
    text-align: center;
    background-color: var(--blue);
    color: var(--brown);
    border-radius: 1.6875rem;
    padding: 9px 0;
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
}
.apexcharts-tooltip {
    background: #f3f3f3 !important;
}
.slider_tab_box_wrapper .slider_tab_box_wrap p {
    margin: 0;
}
section.sliderTabContainer .sliderTabInfoWrapper::before {
    content:'';
    bottom: 0;
    left: 0;
    position: absolute;
    height: 0.125rem;
    width: 100%;
    background: -o-linear-gradient(left, rgba(113, 159, 148, 0.00) 0%, #719F94 43.5%, rgba(113, 159, 148, 0.00) 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(113, 159, 148, 0.00)), color-stop(43.5%, #719F94), to(rgba(113, 159, 148, 0.00)));
    background: linear-gradient(90deg, rgba(113, 159, 148, 0.00) 0%, #719F94 43.5%, rgba(113, 159, 148, 0.00) 100%);
}

/*===========TAB CONTAINER===========*/
/*===========ARCHETYPE CONTAINER===========*/
section.sliderArchetypeContainer {
    position: relative;
    width: 100%;
    display: block;
    margin-bottom: 3.88rem;
}
.sliderArchetypeWrapper {
    position: relative;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1.25rem 1fr;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1.25rem;
}
.verbal-tone-wrapper {
    text-align: center;
    width: 35vw;
    margin: 1rem auto 0;
}
.verbal-tone-wrapper img {
    width: 100%;
    height: auto;
}
.sliderArchetypeWrap {
    /*border-radius: 6.25rem 6.25rem 6.25rem 0;*/
    /* color: var(--white); */
    /* text-align: center; */
}
.sliderArchetypeWrap:nth-of-type(even) {
    /* background-color: var(--lightGreen); */
    width: 100%;
    height: auto;
}
.sliderArchetypeWrap:nth-of-type(odd) {
    /* background-color: var(--blue); */
}
.sliderArchetypeWrap h3 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 0;
}
.sliderArchetypeWrap h4 {
    font-size: 3rem;
    font-weight: 700;
    margin-top: 0;
}
.sliderArchetypeWrap p {
    /* font-size: 1.25rem; */
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
}
.sliderArchetypeWrap .logo-wrap {
    width: 100%;
    height: 7rem;
    margin-bottom: 3rem;
}
.sliderArchetypeWrap .logo-wrap img {}
/*===========ARCHETYPE CONTAINER===========*/
/*===========IMAGE TRAIL==========*/
section.imageTrailContainer {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 80vh;
}
section.imageTrailContainer h3 {
    font-size: 11.1vw;
    white-space: nowrap;
    margin: 0;
    color: var(--blue);
    pointer-events: none;
}
.imageTrailContainer .content {
    position: relative;
    width: 100%;
    height: 100%;
}
.img-wrapper .visible {
    opacity: 1 ;
    visibility: visible;
}
.img-wrapper .hidden {
    display: none;
}
.img-wrapper img {
    -o-object-fit: cover;
    object-fit: cover;
    visibility: hidden;
    -webkit-transition: 0.6s ease-out all;
    -o-transition: 0.6s ease-out all;
    transition: 0.6s ease-out all;
    position: absolute;
    max-width: 250px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transform-origin: bottom;
    -ms-transform-origin: bottom;
    transform-origin: bottom;
}
.img-wrapper .grow-scale {
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: 0.5s all ease-in-out;
    -o-transition: 0.5s all ease-in-out;
    transition: 0.5s all ease-in-out;
}
section.imageTrailContainer iframe {
    width: 100%;
    height: 100%;
}
section.imageTrailWrapper h2 {
    margin-bottom: 0
}
section.imageTrailWrapper {
    position: relative;
    width: 100%;
    display: block;
}
/*===========IMAGE TRAIL==========*/
/*===========PLAY FULL SCREEN VIDEO==========*/
section.videoContainer {
    position: relative;
    width: 100%;
    min-height: 70vh;
    margin-bottom: 5.5rem;
    height: auto;
}
section.videoContainer .video_play_wrap {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 0;
}
#playFullVideo {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 7rem;
    height: 7rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1;
    -webkit-transition: all ease-in-out 0.4s;
    -o-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
}
#playFullVideo .icon-play {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
#playFullVideo .icon-play img {
    vertical-align: middle;
    width: 1.85rem;
}
#playFullVideo:hover {
    -webkit-transform: translate(-50%, -50%) scale(1.15);
    -ms-transform: translate(-50%, -50%) scale(1.15);
    transform: translate(-50%, -50%) scale(1.15);
}
section.videoContainer .video_play_wrap video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
#playFullVideo .outerImg {
    width: 100%;
    height: 100%;
}
#playFullVideo .outerImg img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
    -webkit-animation: rotateC 8s linear infinite;
    animation: rotateC 8s linear infinite;
}
@-webkit-keyframes rotateC{
    to{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}
@keyframes rotateC{
    to{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}
#modalVideoContainer {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 100;
    pointer-events: none;
    background-color: var(--backColor);
    opacity: 0;
    -webkit-transition: all ease-in-out 0.35s;
    -o-transition: all ease-in-out 0.35s;
    transition: all ease-in-out 0.35s;
}
#modalVideoContainer .video_wrap {
    width: 100%;
    height: 100%;
}
#modalVideoContainer .video_wrap video {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
#modalVideoContainer.show {
    opacity: 1;
    pointer-events: auto;
}
#closeModalVideo {
    position: absolute;
    z-index: 1;
    top: 1rem;
    right: 1rem;
    width: 2rem;
    height: 3rem;
    cursor: pointer;
}
#closeModalVideo img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
section.videoAutoplayContainer {
    position: relative;
    width: 100%;
    height: auto;
    margin-bottom: 5.5rem;
    min-height: 70vh;
}
section.videoAutoplayContainer video {
    width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
}
/*===========PLAY FULL SCREEN VIDEO==========*/
.fonts-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 3.5rem;
}
.fonts-wrapper p {
    font-size: 8rem;
    font-style: normal;
    font-weight: 700;
    margin: 0;
    color: var(--blue);
}
.fonts-wrapper p.enText {
    font-family: var(--enFont);
}
.font-input {
    /* width: 70%; */
    font-style: normal;
    margin-bottom: 1rem;
}

.font-input input {
    width: 100%;
    font-size: 3.5vw;
    font-style: normal;
    font-weight: 700;
}

.font-input.en input {
    font-family: var(--enFont);
}

.font-input.en {
    direction: ltr;
}
.font-input.en input {
    font-size: 4vw;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: var(--black);
}
::-moz-placeholder { /* Firefox 19+ */
    color: var(--black);
}
:-ms-input-placeholder { /* IE 10+ */
    color: var(--black);
}
:-moz-placeholder { /* Firefox 18- */
    color: var(--black);
}
section.imageTrailWrapper.fonts {
    margin-bottom: 4rem;
}
.sliderArchetypeWrapper.align-end {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.sliderArchetypeWrap:nth-of-type(even) video {
    width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
}
section.colorsContainer {
    position: relative;
    width: 100%;
    margin-top: 5.5rem;
    margin-bottom: 5.5rem;
}

section.colorsContainer h2 {}

.colorsWrapper {
    position: relative;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1rem 1fr 1rem 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    direction: ltr;
    grid-gap: 1rem;
}

.colorsWrapper .colorsWrap:first-child {
    background-color: var(--blue);
    -ms-grid-column-span: 3;
    grid-column: span 3 / span 3;
    height: calc(((100vw - var(--spaceXX) * 2) / 3 - 3rem));
    height: 40vh;
    padding: 1rem var(--spaceX);
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.colorsWrapper .colorsWrap:nth-of-type(2) {
    background-color: var(--lightGreen);
}

.colorsWrapper .colorsWrap:nth-of-type(3) {
    background-color: var(--brown);
}

.colorsWrapper .colorsWrap:nth-of-type(4) {
    background-color: var(--black);
}

.colorsWrapper .colorsWrap {
    color: var(--white);
}

.colorsWrapper .colorsWrap:not(:first-child) {
    height: calc(((100vw - var(--spaceXX) * 2) / 3 - 4rem));
    height: 38vh;
    padding: 2rem 3rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.color_title_wrap {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    text-align: right;
}
.type-it {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.type-it span {
    display: block;
    font-weight: 600;
    color: var(--blue);
    font-size: .875rem;
}
.colorsWrapper .colorsWrap p {
    margin: 0;
}

.color_title_wrap h3 {
    margin-top: 0;
    font-size: 3rem;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 0;
}

.color_title_wrap p {
    font-size: 1.25rem;
}
.colorsWrapper .colorsWrap.shining {
    -webkit-animation: shine .2s linear;
    animation: shine .2s linear;
}
@-webkit-keyframes shine {
    to{
        opacity:0
    }
}
@keyframes shine {
    to{
        opacity:0
    }
}
.color_info_wrap {
    font-size: 1.25rem;
    width: 100%;
}

.color_info_wrap a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 0.5rem;
    -moz-column-gap: 0.5rem;
    column-gap: 0.5rem;
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.enText {
    font-family: var(--enFont);
}

.color_info_wrap .name-color p {
    font-family: var(--enFont);
    padding: 1rem 0;
    border-top: 1px solid var(--white);
    margin: 1rem 0 !important;
    border-bottom: 1px solid var(--white);
}

.colorCMYBWrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
}

.colorCMYBWrap span {
    display: block;
    font-family: var(--enFont);
}

.colorCMYBWrap span:nth-of-type(1) {
    font-weight: 700;
}

.colorCMYBWrap span:nth-of-type(2) {
    font-weight: 300;
}
.color_info_wrap a span {
    position: absolute;
    bottom: 100%;
    font-size: 12px;
    background: var(--white);
    color: var(--blue);
    border-radius: 4px;
    padding: 7px 16px;
    opacity: 0;
    font-weight: 600;
    font-variation-settings: "wght" 600;
    visibility: hidden;
    -webkit-transform: translate(-50%, -12px);
    -ms-transform: translate(-50%, -12px);
    transform: translate(-50%, -12px);
    transition: opacity .3s ease-out, visibility 0s .3s ease-out, background 0s .3s ease-out, transform .3s ease-out, -webkit-transform .3s ease-out !important;
    white-space: pre;
    left: 50%;
}
strong.hasSpace {
    display: block;
    margin-bottom: 1.125rem;
}
.color_info_wrap a span::before {
    content: '';
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid var(--white);
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
section.imageTrailContainer .slogan_box {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    pointer-events: none;
    mix-blend-mode: multiply;
}

section.imageTrailContainer .slogan_box h4 {
    margin: 0;
    color: var(--blue);
    font-size: 2.5rem;
}
.color_info_wrap a:hover span {
    opacity: 1;
    visibility: visible;
}
.colorsWrapper .colorsWrap:nth-of-type(2) .color_info_wrap a span {
    color: var(--lightGreen);
}

.colorsWrapper .colorsWrap:nth-of-type(3) .color_info_wrap a span {
    color: var(--brown);
}
section.chartContainer #chart {
    width: 40vw;
    margin: 0 auto;
}
.colorsWrapper .colorsWrap:nth-of-type(4) .color_info_wrap a span {
    color: var(--black);
}
section.chartContainer {
    position: relative;
    width: 100%;
    display: block;
}
section.jingleBrandsContainer {
    position: relative;
    width: 100%;
    display: block;
    margin-bottom: 5.5rem;
    padding-top: calc(var(--headerHeight) + 4rem);
}

.jingleBrandsWrap {
    border-radius: 3.125rem;
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--white);
    padding: 1.5rem;
}

.jingleBrandsWrapper {
    position: relative;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr .62rem 1fr .62rem 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: .62rem;
}
.jingleBrandsWrap h3 {
    font-family: var(--enFont);
    text-transform: capitalize;
    font-size: 3rem;
    font-style: normal;
    font-weight: 900;
    margin: 0 0 1.81rem 0;
    text-align: center;
}
.jingleBrandsWrap span {
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    display: block;
}
.jingleBrandsWrap .play-audio {
    width: 4.25rem;
    height: 4.25rem;
    position: relative;
    background-color: var(--blue);
    border-radius: 15px;
    margin-top: 1rem;
    cursor: pointer;
}
.jingleBrandsWrap .play-audio img {
    width: 0.75rem;
    height: 0.75rem;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all linear 0.1s;
    -o-transition: all linear 0.1s;
    transition: all linear 0.1s;
}
.jingleBrandsWrap .play-audio.play img:first-child {
    opacity: 0;
}
.jingleBrandsWrap .play-audio.play img:last-child {
    opacity: 1;
}
.jingleBrandsWrap .play-audio img:last-child {
    opacity: 0;
}
/*===========Footer===========*/
footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 2rem;
    padding-bottom: 2rem;
}
footer p.copy_right {
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 400;
    margin: 0;
}
footer .dokmeh_copy_right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 2rem;
    direction: ltr;
    font-size: 10px;
    font-family: var(--enFont);
}
footer .dokmeh_copy_right img {
    vertical-align: middle;
    height: 29px;
    padding-left: 6px;
}
.slider_svg_container img:first-child {
    opacity: 1;
}
section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap:first-child {
    opacity: 1;
}
/*===========Footer===========*/
section.sliderSectionWrapper.second.home h3 {
    -ms-grid-column-span: 3;
    grid-column: span 3 / span 3;
}
section.sliderSectionWrapper.second.home .text-wrap.image-box {
    width: 100%;
    margin: 0;
}
section.sliderSectionWrapper.second.home .text-wrap.image-box img {
    width: 100%;
}
@media only screen and (max-width: 768px) {
    :root {
        --spaceXS: 1.25rem;
        --spaceX: 1.25rem;
        --spaceXX: calc(var(--space) / 2);
    }
    .breadcrumb-wrapper {
        top: 7rem;
    }
    /*===========HEADER============*/
    section.sliderSectionWrapper.second.home h3 {
        -ms-grid-column-span: 1;
        grid-column: span 1 / span 1;
        margin-bottom: 1rem;
    }
    header {
        height: 3.5rem;
        top: 2rem;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        border-radius: 1.5rem;
        padding: 0 .87rem;
    }
    .header_nav_link_wrap p {
        display: none;
    }
    header::before {
        border-radius: 1.25rem;
    }
    .header_nav_links_catalogue_wrapper {
        -webkit-column-gap: 1.25rem;
        -moz-column-gap: 1.25rem;
        column-gap: 1.25rem;
        position: static;
    }
    .header_download_wrap span {
        font-size: .6rem;
    }
    header .identity img {
        width: 6.31438rem;
    }
    .header_download_wrap {
        -webkit-column-gap: .5rem;
        -moz-column-gap: .5rem;
        column-gap: .5rem;
        padding: 5px .875rem;
    }
    .header_download_wrap img {
        width: 13px;
        height: 13px;
        -o-object-fit: contain;
        object-fit: contain;
    }
    .header_menu_wrap {
        width: 2.125rem;
        row-gap: 3px;
    }
    .header_nav_link_wrap {
        height: 2.125rem;
    }
    .header_menu_wrap span {
        width: 50%;
    }
    .header_nav_links_body_wrapper {
        right: calc(2.125rem + .87rem);
        top: calc(3.5rem);
        width: calc(100% - (2.125rem + .87rem) - 1rem);
    }
    .header_nav_links_wrapper {
        position: static;
    }
    /*===========HEADER============*/
    /*===========SLIDER SECTION============*/
    section.heroVideoSection {
        height: 53dvh;
        margin-bottom: 3rem;
    }
    #scroll_wrap {
        display: none;
    }
    section.sliderSectionWrapper,.sliderArchetypeWrapper.align-end {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        grid-row-gap: 1rem;
        margin-bottom: 2rem;
    }
    .sliderSectionInfoWrapper h2, section.sliderArchetypeContainer h2, section.imageTrailWrapper h2, section.colorsContainer h2, section.chartContainer h2, section.jingleBrandsContainer h2,section.sliderSectionContainer h1 {
        font-size: 1.5rem;
        line-height: normal;
        margin-bottom: 1.125rem;
    }
    .sliderSectionInfoWrapper .content_text {
        font-size: 1rem;
    }
    .sliderSectionInfoMediaWrapper > video {
        width: 100%;
    }
    .sliderFooterSection {
        padding: 1.5rem 0;
    }
    .sliderFooterSection a.nextSlide {
        font-size: .875rem;
        padding: 6px 16px;
        -webkit-column-gap: .5rem;
        -moz-column-gap: .5rem;
        column-gap: .5rem;
    }
    .sliderSectionInfoMediaWrapper p {
        font-size: 1rem;
    }
    main.pageWrapper {
        padding-top: 8rem;
    }
    .sliderFooterSection .prevPage {
        font-size: .875rem;
    }
    .sliderFooterSection a svg {
        width: .78rem;
    }
    .sliderSectionTitle .title_item {
        font-size: 1rem;
    }

    .sliderSectionTitle .title_item p {
        padding-right: 1.3rem;
    }
    section.imageTrailContainer .slogan_box h4 {
        font-size: 1.875rem;
    }
    .sliderSectionTitle .title_item::before {
        right: 0;
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0);
        width: 1rem;
        height: 1rem;
    }
    .sliderSectionInfoMediaWrapper .imgWrapper {
        width: 100%;
    }
    .sliderSectionInfoMediaWrapper .videoWrap {
        height: auto;
    }
    .sliderSectionInfoWrapper video {
        height: auto;
    }

    section.videoContainer {
        height: auto;
        margin-bottom: 3.5rem;
        min-height: auto;
    }

    #playFullVideo {
        width: 5rem;
        height: 5rem;
    }

    #playFullVideo .icon-play img {
        width: 1rem;
    }

    section.videoAutoplayContainer {
        height: auto;
        margin-bottom: 3.5rem;
        min-height: auto;
    }

    .fonts-wrapper p {
        font-size: 3rem;
    }

    .fonts-wrapper {
        margin-top: 1.5rem;
    }

    .font-input input {
        font-size: 4.5vw;
    }

    .font-input.en input {
        font-size: 6vw;
    }
    .colorsWrapper {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    }

    .colorsWrapper .colorsWrap:first-child {
        -ms-grid-column-span: 1;
        grid-column: span 1 / span 1;
    }

    .color_title_wrap h3 {
        font-size: 1.125rem;
    }

    .color_title_wrap p {
        font-size: .875rem;
    }

    .color_info_wrap {
        font-size: 1rem;
    }

    .color_info_wrap .name-color p {
        margin: .75rem 0 !important;
        padding: .75rem 0;
    }
    section.colorsContainer {
        margin-top: 3.5rem;
        margin-bottom: 3.5rem;
    }

    section.chartContainer #chart {
        width: calc(100% - var(--spaceX)*2);
        margin: 0 auto;
    }
    .colorsWrapper .colorsWrap:not(:first-child) {
        padding: 2rem var(--spaceX);
    }
    section.chartContainer {
        margin-bottom: 0;
    }
    .jingleBrandsWrapper {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    }
    .jingleBrandsWrap h3 {
        font-size: 2.5rem;
    }
    section.jingleBrandsContainer {
        margin-bottom: 3.5rem;
        padding-top: calc(var(--headerHeight) + 2rem);
    }
    .jingleBrandsWrap .play-audio {
        width: 3.875rem;
        height: 3.875rem;
    }
    section.imageTrailContainer h3 {
        font-size: 14vw;
    }
    section.imageTrailContainer {
        height: 42vh;
    }
    section.sliderTabContainer {
        margin-top: 3rem;
        margin-bottom: 3rem;
    }
    h2.hasNoMargin {
        margin-bottom: 0 !important;
        line-height: 1 !important;
    }
    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap h2 {
        font-size: 1.125rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap .content_text_wrap {
        width: 100%;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap p.enText {
        font-size: 1.5rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap .content_text_wrap p {
        font-size: .875rem;
    }

    .slider_tab_box_wrapper .slider_tab_box_wrap {
        font-size: .75rem;
        width: 6rem;
    }

    .slider_svg_container {
        width: calc(100% - 8rem);
    }
    .verbal-tone-wrapper {
        width: 100%;
    }
    /*===========SLIDER SECTION============*/
    /*===========FOOTER SECTION============*/
    footer{
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
    }
    footer p.copy_right{
        width:100%;
    }
    /*===========FOOTER SECTION============*/
}
@media only screen and (min-width: 640px) and (max-width: 768px) {
    .colorsWrapper {
        -ms-grid-columns: 1fr 1rem 1fr 1rem 1fr;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .colorsWrapper .colorsWrap:first-child {
        -ms-grid-column-span: 3;
        grid-column: span 3 / span 3;
        height: 28vh;
    }
    .jingleBrandsWrapper {
        -ms-grid-columns: 1fr .62rem 1fr;
        grid-template-columns: 1fr 1fr;
    }
    .colorsWrapper .colorsWrap:not(:first-child) {
        height: 28vh;
    }
}
@media only screen and (min-width: 769px) and (max-width: 1199px) {
    :root{
        --spaceX: calc(var(--space)* 0.75);
        --spaceXX: calc(var(--space)* 0.75);
    }
    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap h2 {
        font-size: 1.875rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap p.enText {
        font-size: 2.5rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap .content_text_wrap p {
        font-size: 1rem;
    }
    header .identity img {
        width: 9.31438rem;
    }
    section.imageTrailContainer {
        height: 56vh;
    }
    .verbal-tone-wrapper {
        width: 70vw;
    }
    .sliderSectionInfoWrapper h2, section.sliderArchetypeContainer h2, section.imageTrailWrapper h2, section.colorsContainer h2, section.chartContainer h2, section.jingleBrandsContainer h2,section.sliderSectionContainer h1 {
        font-size: 2.5rem;
        margin-bottom: 1.5rem;
        line-height: normal;
    }

    .sliderSectionInfoWrapper .content_text {
        /* font-size: 1.125rem; */
    }

    .sliderFooterSection a.nextSlide,.sliderFooterSection a.prevPage {
        font-size: 1rem;
    }
    .sliderSectionInfoWrapper .content_text p {
        line-height: 1.5;
    }

    .sliderSectionInfoMediaWrapper p {
        font-size: 1.125rem;
    }

    main.pageWrapper section.sliderSectionWrapper {
        -webkit-column-gap: 2rem;
        -moz-column-gap: 2rem;
        column-gap: 2rem;
        margin-bottom: 3.5rem;
    }
    footer {
        margin-top: auto;
    }
    body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        min-height: 100dvh;
    }
    section.videoContainer {
        height: auto;
        margin-bottom: 3.5rem;
    }

    #playFullVideo {
        width: 6rem;
        height: 6rem;
    }

    #playFullVideo .icon-play img {
        width: 1.125rem;
    }

    section.videoAutoplayContainer {
        height: auto;
        margin-bottom: 3.5rem;
    }

    .fonts-wrapper p {
        font-size: 5rem;
    }

    .colorsWrapper .colorsWrap:first-child {
        height: 28vh;
    }

    .colorsWrapper .colorsWrap:not(:first-child) {
        height: 24vh;
        padding: 2rem 2rem;
    }

    .color_title_wrap h3 {
        font-size: 2rem;
    }

    .color_title_wrap p {
        font-size: 1rem;
    }

    .color_info_wrap {
        font-size: 1rem;
    }

    .color_info_wrap .name-color p {
        margin: .875rem 0 !important;
        padding: .875rem 0;
    }

    section.chartContainer #chart {
        width: 65vw;
    }

    .jingleBrandsWrap h3 {
        font-size: 2rem;
    }

    .jingleBrandsWrap .play-audio {
        width: 3.25rem;
        height: 3.25rem;
    }

    section.chartContainer {
        margin-bottom: 3.5rem;
    }

    section.colorsContainer {
        margin-top: 3.5rem;
        margin-bottom: 3.5rem;
    }
}
@media only screen and (min-width: 1200px) and (max-width: 1400px) {
    header .identity img {
        width: 9.31438rem;
    }
    .header_download_wrap {
        -webkit-column-gap: 1.5rem;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem;
    }
    .header_download_wrap {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
    }
    .verbal-tone-wrapper {
        width: 40vw;
    }
    section.imageTrailContainer .slogan_box h4 {
        font-size: 2.125rem;
    }
    .sliderSectionInfoWrapper h2, section.sliderArchetypeContainer h2, section.imageTrailWrapper h2, section.colorsContainer h2, section.chartContainer h2, section.jingleBrandsContainer h2,section.sliderSectionContainer h1 {
        font-size: 2.25rem;
        margin-bottom: 1.5rem;
        line-height: normal;
    }
    .sliderSectionInfoWrapper .content_text {
        /* font-size: 1.25rem; */
    }
    .sliderSectionInfoWrapper .content_text p {
        line-height: 1.5;
    }
    .sliderFooterSection a.nextSlide,.sliderFooterSection a.prevPage {
        font-size: 1rem;
    }
    .sliderFooterSection a svg {
        width: .875rem;
    }
    .sliderSectionInfoMediaWrapper p {
        font-size: 1.25rem;
        line-height: 1.5;
    }
    main.pageWrapper section.sliderSectionWrapper {
        -webkit-column-gap: 2rem;
        -moz-column-gap: 2rem;
        column-gap: 2rem;
        margin-bottom: 3.5rem;
    }
    section.videoContainer {
        height: 60vh;
        margin-bottom: 3.5rem;
    }

    #playFullVideo .icon-play img {
        width: 1.25rem;
    }

    section.videoAutoplayContainer {
        height: 68vh;
        margin-bottom: 3.5rem;
    }

    .fonts-wrapper p {
        font-size: 5rem;
    }

    .fonts-wrapper {
        margin-top: 1.5rem;
    }

    .color_title_wrap h3 {
        font-size: 2rem;
    }

    .colorsWrapper .colorsWrap p {
        font-size: 1rem;
    }

    section.colorsContainer {
        margin-top: 3.5rem;
        margin-bottom: 3.5rem;
    }

    .colorsWrapper .colorsWrap:first-child {
        padding: 1rem 3rem;
        height: 45vh;
    }

    .color_info_wrap {
        font-size: 1rem;
    }

    .colorsWrapper .colorsWrap:not(:first-child) {
        padding: 2rem 2rem;
        height: 42vh;
    }

    section.chartContainer {
        margin-bottom: 3.5rem;
    }

    section.chartContainer #chart {
        width: 50vw;
    }

    .jingleBrandsWrap h3 {
        font-size: 2rem;
    }

    .jingleBrandsWrap .play-audio {
        width: 3.75rem;
        height: 3.75rem;
    }
    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap h2 {
        font-size: 2rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap p.enText {
        font-size: 3rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap .content_text_wrap p {
        font-size: 1rem;
    }
}
@media only screen and (min-width: 1401px) and (max-width: 1700px) {
    header .identity img {
        width: 10.31438rem;
    }
    .header_download_wrap {
        -webkit-column-gap: 1.5rem;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem;
    }
    section.imageTrailContainer .slogan_box h4 {
        font-size: 2.25rem;
    }
    .verbal-tone-wrapper {
        width: 40vw;
    }
    .header_download_wrap {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
    }
    .sliderSectionInfoWrapper h2, section.sliderArchetypeContainer h2, section.imageTrailWrapper h2, section.colorsContainer h2, section.chartContainer h2, section.jingleBrandsContainer h2,section.sliderSectionContainer h1 {
        font-size: 2.3rem;
        margin-bottom: 1.5rem;
        line-height: normal;
    }
    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap h2 {
        font-size: 2rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap p.enText {
        font-size: 3rem;
    }

    section.sliderTabContainer .sliderTabInfoWrapper .sliderTabInfoWrap .content_text_wrap p {
        font-size: 1rem;
    }
    .sliderSectionInfoWrapper .content_text {
        /* font-size: 1.25rem; */
    }
    .sliderSectionInfoWrapper .content_text p {
        line-height: 1.5;
    }
    .sliderFooterSection a.nextSlide,.sliderFooterSection a.prevPage {
        font-size: 1rem;
    }
    .sliderFooterSection a svg {
        width: .875rem;
    }
    .sliderSectionInfoMediaWrapper p {
        font-size: 1.25rem;
        line-height: 1.5;
    }
    main.pageWrapper section.sliderSectionWrapper {
        -webkit-column-gap: 2rem;
        -moz-column-gap: 2rem;
        column-gap: 2rem;
    }
    #playFullVideo .icon-play img {
        width: 1.25rem;
    }
    .fonts-wrapper p {
        font-size: 5rem;
    }
    .font-input input {
        font-size: 3vw;
    }
    .font-input.en input {
        font-size: 3.5vw;
    }
    .colorsWrapper .colorsWrap:first-child {
        padding: 1rem 4rem;
        height: 45vh;
    }
    .color_title_wrap h3 {
        font-size: 2.25rem;
    }
    .color_title_wrap p {
        font-size: 1rem;
    }
    .color_info_wrap {
        font-size: 1rem;
    }
    .colorsWrapper .colorsWrap:not(:first-child) {
        height: 42vh;
        padding: 2rem 2rem;
    }
    .jingleBrandsWrap h3 {
        font-size: 2.25rem;
    }
    .jingleBrandsWrap .play-audio {
        width: 3.875rem;
        height: 3.875rem;
    }
}