:root {
    --vh: 100%;
}

body,
html {
    margin: 0;
    padding: 0;
    font-family: 'LG Smart', sans-serif;
}

body * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: 300;
}

ul,
dl,
dt,
dd {
    margin: 0;
    padding: 0;
    list-style: none;
}

ol {
    margin: 0;
}

a {
    text-decoration: none;
    color: #333;
}
a:hover {
    text-decoration: none;
}

input,
select,
textarea,
fieldset,
button {
    outline: none;
    margin: 0;
    padding: 0;
    width: auto;
    min-width: auto;
    border: 0;
    cursor: pointer;
}

/*
input::placeholder, textarea::placeholder {
  color: $gray-two;
}
*/
table {
    border-collapse: collapse;
}

em {
    font-style: italic;
}

strong {
    font-weight: bold;
}

strong > * {
    font-weight: bold;
}

b {
    font-weight: bold;
}

b > * {
    font-weight: bold;
}

strong em {
    font-weight: bold;
}

textarea {
    resize: none;
}

.hidden {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    clip: rect(1px, 1px, 1px, 1px);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    display: inline-block;
    margin: 0;
}

img {
    max-width: 100%;
}

p {
    margin: 0;
}

label {
    font-weight: 400;
}

input {
    font-size: 1.625rem;
    font-weight: 400;
    /*
  color: $gray-two;
  */
    line-height: 2.25rem;
}

/* #### Generated By: http://font.download #### */
@font-face {
    font-family: 'LG Smart';
    font-style: normal;
    font-weight: 300;
    src: url('../../../../lib/external/font/LGSmartLight.woff') format('woff');
}
@font-face {
    font-family: 'LG Smart';
    font-style: normal;
    font-weight: 400;
    src: url('../../../../lib/external/font/LGSmartRegular.woff') format('woff');
}
@font-face {
    font-family: 'LG Smart';
    font-style: italic;
    font-weight: 400;
    src: url('../../../../lib/external/font/LGSmartRegularItalic.woff')
        format('woff');
}
@font-face {
    font-family: 'LG Smart';
    font-style: normal;
    font-weight: 600;
    src: url('../../../../lib/external/font/LGSmartSemiBold.woff')
        format('woff');
}
@font-face {
    font-family: 'LG Smart';
    font-style: normal;
    font-weight: 700;
    src: url('../../../../lib/external/font/LGSmartBold.woff') format('woff');
}
@font-face {
    font-family: 'LG Smart';
    font-style: italic;
    font-weight: 700;
    src: url('../../../../lib/external/font/LGSmartBoldItalic.woff')
        format('woff');
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-Thin.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-Thin.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-Thin.woff2')
            format('woff2');
    font-weight: 100;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-ExtraLight.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-ExtraLight.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-ExtraLight.woff2')
            format('woff2');
    font-weight: 200;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-Light.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-Light.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-Light.woff2')
            format('woff2');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-Regular.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-Regular.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-Regular.woff2')
            format('woff2');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-Medium.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-Medium.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-Medium.woff2')
            format('woff2');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-SemiBold.otf')
            format('otf'),
        url('../fonts/suit/SUIT-SemiBold.ttf') format('ttf'),
        url('../fonts/suit/SUIT-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-Bold.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-Bold.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-Bold.woff2')
            format('woff2');
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-ExtraBold.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-ExtraBold.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-ExtraBold.woff2')
            format('woff2');
    font-weight: 800;
    font-display: swap;
}
@font-face {
    font-family: 'suit';
    src:
        url('../../../../lib/external/font/suit/otf/SUIT-Heavy.otf')
            format('otf'),
        url('../../../../lib/external/font/suit/ttf/SUIT-Heavy.ttf')
            format('ttf'),
        url('../../../../lib/external/font/suit/woff2/SUIT-Heavy.woff2')
            format('woff2');
    font-weight: 900;
    font-display: swap;
}
@media (min-width: 46.9375rem) {
    .btn {
        display: inline-block;
        min-width: 3.125rem;
        padding: 0.625rem 1.5rem;
        font-size: 1.5rem;
        font-weight: 500;
        text-align: center;
    }
    .btn.btn-primary {
        padding: 1.25rem 1.875rem;
        background-color: #00abce;
        color: #ffffff;
    }
    .btn.btn-round {
        border-radius: 6.25rem;
    }
    .btn.btn-large {
        font-weight: 700;
        padding: 0.8125rem 3rem;
    }
}
body.ecotalk-main {
    background: rgb(219, 245, 255);
    background: linear-gradient(
        180deg,
        rgb(238, 247, 250) 3%,
        rgba(251, 251, 251, 1) 59%
    );
}

#eco-talk {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

img {
    vertical-align: top;
}

.header {
    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: 1.8125rem 2rem;
}
.header .language {
    padding: 0.3125rem 1.125rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #d7ebf0;
    border-radius: 3.125rem;
}
.header .language .language-text {
    font-size: 0.625rem;
    font-family: 'suit', sans-serif;
    font-weight: 700;
    padding-right: 0.58rem;
    position: relative;
    background-repeat: no-repeat;
    background-position: right center;
    background-image: url(../../main/images/lang-select-arrow.png);
}
.header .language .language-select {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.header .language .language-select li {
    margin-left: 0.625rem;
    opacity: 0.3;
}
.header .language .language-select li.active {
    opacity: 1;
}

.footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 1.625rem 2rem;
    background-color: #ffffff;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.footer .email {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.footer .email span {
    white-space: nowrap;
}
.footer .email span:not(:last-child) {
    margin-right: 0.9375rem;
}

.main-container-wrap {
    width: 100%;
    position: relative;
    overflow: hidden;
    padding-top: 39.31%;
    flex: 1;
}
.main-container-wrap .main-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.main-container-wrap .main-container .content {
    position: relative;
    height: 100%;
    padding-left: 4rem;
}
.main-container-wrap .main-container .content .background {
    width: 46.95%;
    position: absolute;
    z-index: 0;
    padding-top: 37.3%;
    bottom: 0;
    right: 0;
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../../main/images/main-content-bg.png);
}
.main-container-wrap .main-container .content .title-content {
    font-size: 1.25rem;
    color: #00abce;
    font-weight: 400;
    padding: 3.625rem 0 2.25rem;
    position: relative;
    z-index: 9;
}
.main-container-wrap .main-container .content .title {
    color: #00abce;
    font-weight: 700;
    font-size: 4.5rem;
    position: relative;
    z-index: 9;
}
.main-container-wrap .main-container .content .desc {
    font-size: 1.75rem;
    line-height: 1.35;
    font-weight: 600;
    position: relative;
    z-index: 9;
}
.main-container-wrap .main-container .content .mine {
    font-size: 1.25rem;
    font-weight: 400;
    margin: 1.4375rem 0 2.75rem;
    position: relative;
    z-index: 9;
}
.main-container-wrap .main-container .content .mine strong {
    font-size: 1.25rem;
    font-weight: 700;
    color: #00abce;
}
/* loading block */
.loading-spinner {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(224, 224, 224); /* Semi-transparent backdrop */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* Ensure it is above other content */
}
.spinner {
    width: 40px;
    height: 40px;
    position: relative;
}
.double-bounce1,
.double-bounce2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #3498db;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    animation: bounce 2s infinite ease-in-out;
}
.double-bounce2 {
    animation-delay: -1s;
}
@keyframes bounce {
    0%,
    100% {
        transform: scale(0);
    }
    50% {
        transform: scale(1);
    }
}