/*
Main Stylesheets
*/

/* INITIAL CSS */
* {box-sizing: border-box;}
html {font-size: 10px;}
html .gen-anm {visibility: hidden;}

@media only screen and (min-width: 1500px) {
  html {font-size: 12px;}
}
@media only screen and (min-width: 1900px) {
  html {font-size: 14px;}
}
@media only screen and (min-width: 2400px) {
  html {font-size: 18px;}
}
@media only screen and (max-width: 1024px) {
  html {font-size: 9px;}
}

body {color: #1A1A1A; font-family: 'GeneralFont', Arial, Verdana; font-size: 1.5rem; line-height: 2.5rem; position: relative; overflow-x: hidden;}

b, strong {font-family: 'BoldFont', Arial, Verdana;}
i, em {font-family: 'ItalicFont', Arial, Verdana;}
b i, i b, b em, em b, strong i, i strong, strong em, em strong {font-family: 'BoldItalicFont', Arial, Verdana;}

.ft-light {font-family: 'LightFont', Arial, Verdana !important;}
.ft-medium {font-family: 'MediumFont', Arial, Verdana !important;}
.ft-semibold {font-family: 'SemiBoldFont', Arial, Verdana !important;}
.ft-bold {font-family: 'BoldFont', Arial, Verdana !important;}
.ft-extrabold {font-family: 'ExtraBoldFont', Arial, Verdana !important;}

h1, h2, h3, h4, h5 {font-family: 'TitleFont', Arial, Verdana; color: #1A1A1A;}
h1 b, h2 b, h3 b, h4 b, h5 b, h1 strong, h2 strong, h3 strong, h4 strong, h5 strong {font-family: 'TitleBoldFont', Arial, Verdana; font-weight: bold;}
h1 i, h2 i, h3 i, h4 i, h5 i, h1 em, h2 em, h3 em, h4 em, h5 em{font-family: 'TitleItalicFont', Arial, Verdana;}
h1 b i, h2 b i, h3 b i, h4 b i, h5 b i,
h1 i b, h2 i b, h3 i b, h4 i b, h5 i b,
h1 b em, h2 b em, h3 b em, h4 b em, h5 b em,
h1 em b, h2 em b, h3 em b, h4 em b, h5 em b,
h1 strong i, h2 strong i, h3 strong i, h4 strong i, h5 strong i,
h1 i strong, h2 i strong, h3 i strong, h4 i strong, h5 i strong,
h1 strong em, h2 strong em, h3 strong em, h4 strong em, h5 strong em,
h1 em strong, h2 em strong, h3 em strong, h4 em strong, h5 em strong {font-family: 'TitleBoldItalicFont', Arial, Verdana; font-weight: bold;}

h1 {font-size: 4.2rem; line-height: 5.2rem; margin-bottom: 2.5rem;}
h2 {font-size: 3.8rem; line-height: 4.8rem; margin-bottom: 2.5rem;}
h3 {font-size: 3.0rem; line-height: 4.0rem; margin-bottom: 2.5rem;}
h4 {font-size: 2.2rem; line-height: 3.0rem; margin-bottom: 2.5rem;}
h5 {font-size: 1.7rem; line-height: 2.5rem; margin-bottom: 2.5rem;}
h1:only-child, h2:only-child, h3:only-child, h4:only-child, h5:only-child,
h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child  {margin-bottom: 0;}

.ov-hidden {overflow: hidden;}

.cl-black, .cl-black a {color: #000 !important;}
.cl-white, .cl-white a {color: #fff !important;}
.cl-secondary, .cl-secondary a {color: #FCD600 !important;}
.cl-secondary-2, .cl-secondary-2 a {color: #FFF09A !important;}
.cl-secondary-3, .cl-secondary-3 a {color: #FEF3B2 !important;}
.cl-gray, .cl-gray a {color: #4D4D4D !important;}
.cl-gray-2, .cl-gray-2 a {color: #B3B3B3 !important;}

.text-shadow {text-shadow: 0.3rem 0.3rem 0.3rem #444;}
.text-bg-wrapper {padding: 2.5rem; background: #FFF09A;}
.text-bg-wrapper.secondary {background: #FCD600;}

p, p a {font-size: 1.5rem; color: #1A1A1A; line-height: 2.5rem;}
p.small {font-size: 1.2rem; line-height: 2.2rem;}
p a:hover {text-decoration: underline; color: #FCD600;}

a {color: #FCD600; font-size: 1.5rem; line-height: 2.5rem; text-decoration: none;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
a:hover {color: #00A0E4; text-decoration: underline;}
a.und {display: inline-block; border-bottom: 0.1rem solid #fff;}
a.und:hover {text-decoration: none;}

img {display: block; max-width: 100%;
backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden;}
img.full-width {width: 100%; display: block;}
img.centered {margin: 0 auto; display: block; max-width: 100%; height: auto;}
img.round-border {border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}

.gen-img-wrap {margin-bottom: 3rem; position: relative;}
.gen-img-wrap.no-mb {margin-bottom: 0;}
.gen-img-wrap img {max-width: 100%; display: block;}
.gen-img-wrap img.centered {margin-left: auto; margin-right: auto;}

.full-img-wrap {position: relative;}
.full-img-wrap img {width: 100%; display: block;}

.ta-center {text-align: center;}
.ta-left {text-align: left;}
.ta-right {text-align: right;}
.ta-justify {text-align: justify;}

.fl-left {float: left;}
.fl-right {float: right;}
.fl-clear {clear: both;}

.sfw {float: left; width: 100%; position: relative;}

.mt-0 {margin-top: 0 !important;}
.mt-1 {margin-top: 1rem !important;}
.mt-2 {margin-top: 2rem !important;}
.mt-3 {margin-top: 3rem !important;}
.mt-4 {margin-top: 4rem !important;}
.mb-0 {margin-bottom: 0 !important;}
.mb-1 {margin-bottom: 1rem !important;}
.mb-2 {margin-bottom: 2rem !important;}
.mb-3 {margin-bottom: 3rem !important;}
.mb-4 {margin-bottom: 4rem !important;}
.mb-6 {margin-bottom: 6rem !important;}

.rnd-corner {border-radius: 1rem;}

.lh-small {line-height: 1.25;}

.d-none {display: none;}
.d-block {display: block;}

@media only screen and (max-width: 1024px) {
  h1 {font-size: 4.0rem; line-height: 5.2rem;}
  h2 {font-size: 3.6rem; line-height: 4.8rem;}
  h3 {font-size: 3.0rem; line-height: 4.2rem;}
  h4 {font-size: 2.4rem; line-height: 3.4rem;}
  h5 {font-size: 1.8rem; line-height: 2.8rem;}
}

@media only screen and (max-width: 768px) {
  h1 {font-size: 3.6rem; line-height: 4.6rem;}
  h2 {font-size: 3.2rem; line-height: 4.2rem;}
  h3 {font-size: 2.8rem; line-height: 3.8rem;}
  h4 {font-size: 2.4rem; line-height: 3.2rem;}
  h5 {font-size: 1.8rem; line-height: 2.6rem;}
}

@media only screen and (max-width: 500px) {
  h1 {font-size: 3.2rem; line-height: 4.2rem;}
  h2 {font-size: 2.8rem; line-height: 3.8rem;}
  h3 {font-size: 2.4rem; line-height: 3.4rem;}
  h4 {font-size: 2.1rem; line-height: 3.1rem;}
  h5 {font-size: 1.8rem; line-height: 2.8rem;}
}

@media only screen and (max-width: 420px) {
  h1 {font-size: 3.0rem; line-height: 3.8rem;}
  h2 {font-size: 2.6rem; line-height: 3.4rem;}
  h3 {font-size: 2.2rem; line-height: 3.0rem;}
  h4 {font-size: 1.9rem; line-height: 2.7rem;}
  h5 {font-size: 1.7rem; line-height: 2.5rem;}

}
/* /INITIAL CSS */


/* GENERAL LAYOUT CSS */
header {}
main {min-height: 30rem;}
footer {}

section {z-index: 100; padding: 0; margin: 0;}
section.with-bg {padding: 8rem 0;}
section.with-bg.no-ptb {padding: 0;}
main > section {margin-bottom: 12rem;}
main > section + section.mt-min {margin-top: -8rem;}
main > section.no-bg + section.no-bg {margin-top: 20rem;}
main > section.with-bg + section.with-bg {margin-top: -12.2rem;}
main > section:first-of-type {margin-top: 8rem;}
main > section:first-of-type.no-bg {margin-top: 14rem;}
main > section:first-of-type.with-bg {margin-top: 0;}
main > section:last-of-type.with-bg {margin-bottom: 0;}

.flex {display: flex; justify-content: space-between; width: 100%; flex-wrap: wrap;}
.flex.start {justify-content: flex-start;}
.flex.end {justify-content: flex-end;}
.flex.rtl {flex-direction: row-reverse;}
.flex.centered {justify-content: center;}
.flex.align-centered {align-items: center;}
.flex.two-cols .left, .flex.two-cols .right {width: 48%;}

.grid {display: grid; justify-content: space-between; width: 100%; }
.grid.rtl {direction: rtl;}
.grid.rtl > div {direction: ltr;}
.grid.align-centered {align-items: center;}
.grid.align-bottom {align-items: end;}
.grid.col-6 {grid-template-columns: repeat(6, 1fr); column-gap: 1.5rem;}
.grid.col-10 {grid-template-columns: repeat(10, 1fr); column-gap: 1.5rem;}
.grid.col-12 {grid-template-columns: repeat(12, 1fr); column-gap: 1.5rem;}
.grid .colspan-1 {grid-column: span 1;}
.grid .colspan-2 {grid-column: span 2;}
.grid .colspan-3 {grid-column: span 3;}
.grid .colspan-4 {grid-column: span 4;}
.grid .colspan-5 {grid-column: span 5;}
.grid .colspan-6 {grid-column: span 6;}
.grid .colspan-7 {grid-column: span 7;}
.grid .colspan-8 {grid-column: span 8;}
.grid .colspan-9 {grid-column: span 9;}
.grid .colspan-10 {grid-column: span 10;}
.grid .colspan-11 {grid-column: span 11;}
.grid .colspan-12 {grid-column: span 12;}
.grid .colspan-fw {grid-column: 1 / -1;}

#grid-ruler {position: fixed; top: 0; width: 100%; z-index: 1000;}
#grid-ruler .grid-unit {height: 100vh; background: rgba(255, 0, 0, 0.05); position: relative; grid-column: span 1;}
#grid-ruler .grid-unit p {position: absolute; right: 1.5rem; bottom: 0.5rem; font-size: 1rem; color: #7f7f7f;}

.container {margin: 0 auto; width: 92%; margin-bottom: 6rem;}
.container-small {margin: 0 auto; width: 70%; margin-bottom: 6rem;}
.container-fluid {margin: 0 auto; width: 100%; margin-bottom: 6rem;}
.container:last-child, .container-small:last-child, .container-fluid:last-child {margin-bottom: 0;}

.row {margin-bottom: 3rem;}
.row:last-child {margin-bottom: 0;}

@media only screen and (min-width: 1600px) {
  .container {width: 90%;}
}

@media only screen and (max-width: 1024px) {
  .grid.col-12 {grid-template-columns: repeat(6, 1fr); column-gap: 2rem;}

  section.with-bg {padding: 6rem 0;}
  main > section {margin-bottom: 8rem;}
  main > section.no-bg + section.no-bg {margin-top: 16rem;}
  main > section.with-bg + section.with-bg {margin-top: -8.2rem;}

  main > section + section.mt-min {margin-top: -5rem;}
}

@media only screen and (max-width: 768px) {
  .container, .container-small {width: 90%;}

  main > section {margin-bottom: 6rem;}
  main > section.no-bg + section.no-bg {margin-top: 12rem;}
  main > section.with-bg + section.with-bg {margin-top: -6.2rem;}

  main > section + section.mt-min {margin-top: -3rem;}
}

@media only screen and (max-width: 600px) {
  .grid.col-12 {grid-template-columns: repeat(4, 1fr); column-gap: 2rem;}
}
/* /GENERAL LAYOUT CSS */


/* WYSIWYG CONTENT */
.wysiwyg-content, .wysiwyg-content p, .wysiwyg-content a, .wysiwyg-content ul li, .wysiwyg-content ol li {font-size: 1.5rem; color: #1A1A1A; line-height: 2.5rem; font-family: 'GeneralFont', Arial, Verdana;}
.wysiwyg-content.white, .wysiwyg-content.white p, .wysiwyg-content.white a, .wysiwyg-content.white ul li, .wysiwyg-content.white ol li {color: #fff;}
.wysiwyg-content.color, .wysiwyg-content.color p, .wysiwyg-content.color a, .wysiwyg-content.color ul li, .wysiwyg-content.color ol li {color: #FCD600;}
.wysiwyg-content.big, .wysiwyg-content.big p, .wysiwyg-content.big a, .wysiwyg-content.big ul li, .wysiwyg-content.big ol li {font-size: 1.8rem; line-height: 2.6rem; font-family: 'GeneralFont', Arial, Verdana;}
.wysiwyg-content ul li {margin-left: 0; padding-left: 3.6rem; background: url(../images/icon/arrow-right-color.svg) no-repeat top -0.1rem left; background-size: 2.4rem auto; margin-bottom: 1.5rem; line-height: 2.3rem;}
.how-it-works-section-1 .wysiwyg-content ul li {background: url(../images/icon/arrow-right-black.svg) no-repeat top 0.1rem left; background-size: 2.0rem auto; font-family: 'SemiBoldFont', Arial, Verdana !important;}
.wysiwyg-content ul li:last-child {margin-bottom: 0;}
.wysiwyg-content img {width: 100%; height: auto;}
.wysiwyg-content img.fr-dib {display: block; margin: 0 auto;}
.wysiwyg-content img.fr-dib.fr-fil {text-align: left;}
.wysiwyg-content img.fr-dib.fr-fir {text-align: right;}
.wysiwyg-content img.fr-dii {}
.wysiwyg-content img.fr-dii.fr-fil {float: left; margin-right: 30px;}
.wysiwyg-content img.fr-dii.fr-fir {float: right; margin-left: 30px;}
.wysiwyg-content p {margin-block-start: 1em; margin-block-end: 1em;}
.wysiwyg-content a, .wysiwyg-content caption {text-decoration: underline;}
.wysiwyg-content caption {text-align: center; font-weight: bold;}


ul.default-icon {}
ul.default-icon li {margin-left: 0; list-style-type: none; padding-left: 2.5rem; background: url(../images/icon/bullet-general.svg) no-repeat left 0.4rem; background-size: 1.4rem !important; margin-bottom: 1.5rem;}
ul.default-icon.narrow-mb li{margin-bottom: 0.5rem;}
ul.default-icon.white li {background: url(../images/icon/bullet-white.svg) no-repeat left 0.4rem; color: #fff;}
ul.default-icon.white.blue-dot > li {background: url(../images/icon/bullet-blue-2.svg) no-repeat left 0.4rem; color: #fff;}
ul.default-icon li:last-child {margin-bottom: 0;}
/* /WYSIWYG CONTENT */


/* TABLE */
table.gen-table {width: 100%;}
table.gen-table thead {}
table.gen-table thead tr {background: transparent;}
table.gen-table thead tr td {color: #333; vertical-align: middle; font-size: 2rem; line-height: 3rem; font-family: 'GeneralFont', Arial, Verdana; padding: 1.5rem 2rem; border-bottom: 0.1rem solid #333;}
table.gen-table tbody tr {}
table.gen-table tbody tr td {padding: 1.5rem 2rem; vertical-align: middle;}
table.gen-table tbody tr td, table.gen-table tbody tr td p, table.gen-table tbody tr td a, table.gen-table tbody tr td p a {font-size: 1.4rem; line-height: 2.2rem; color: #333; font-family: 'GeneralFont', Arial, Verdana;}
table.gen-table tbody tr td a, table.gen-table tbody tr td p a {color: #FCD600;}
table.gen-table tbody tr td a:hover, table.gen-table tbody tr td p a:hover {text-decoration: underline;}
table.gen-table tbody tr:nth-child(odd) td{background: #fff;}
table.gen-table tbody tr:nth-child(even) td{background: #EAEEF0;}
table.gen-table tbody tr td:last-child {}
table.gen-table tbody tr:last-child td {}
table.gen-table tbody tr td.vtop {vertical-align: top;}

@media only screen and (max-width: 768px) {
  table.gen-table thead tr td, table.gen-table tbody tr td {padding: 1.2rem 1.5rem;}
  table.gen-table thead tr td {font-size: 1.8rem; line-height: 2.6rem;}
}

@media only screen and (max-width: 500px) {
  table.gen-table thead tr td {font-size: 1.6rem; line-height: 2.4rem;}
  table.gen-table tbody tr td, table.gen-table tbody tr td p, table.gen-table tbody tr td a, table.gen-table tbody tr td p a  {font-size: 1.3rem; line-height: 1.9rem;}
}
/* /TABLE */


/* FORM */
form.gen-form {}
form.gen-form .gen-form-row {display: flex; display: flex; justify-content: space-between; width: 100%; flex-wrap: wrap; margin-bottom: 3rem;}
form.gen-form .gen-form-row.captcha-row, form.gen-form .gen-form-row:last-child {margin-bottom: 0;}
form.gen-form .gen-form-row .gfr-half {width: 45%;}
form.gen-form .gen-form-row .gfr-full {width: 100%;}

input[type=text], input[type=email], input[type=password], textarea {font-family: 'GeneralFont', Arial, Verdana; height: 4rem; font-size: 1.5rem; line-height: 2.2rem; color: #fff; width: 100%; border-bottom: 0.1rem solid #fff; background: none;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
input[type=text]:hover, input[type=text]:focus, input[type=email]:hover, input[type=email]:focus, input[type=password]:hover, input[type=password]:focus, textarea:hover, textarea:focus {outline: 0;}
textarea {padding: 1.5rem; min-height: 14rem; border: 0.1rem solid #fff;
border-radius: 0.4rem; -webkit-border-radius: 0.4rem; -moz-border-radius: 0.4rem; -o-border-radius: 0.4rem;}
textarea.no-resize {resize: none;}
input[type=text].datepicker {padding-right: 1.7rem; background: url(../images/icon/calendar.svg) no-repeat right 15px center; background-size: auto 20px;}

select {font-family: 'GeneralFont', Arial, Verdana; font-size: 1.6rem; line-height: 2.4rem; padding: 0 3rem 0 1.2rem; color: #21252C;}
select:hover, select:focus {outline: 0;}
.styled-select-wrapper {width: 100%; overflow: hidden; border: 1px solid #7F7F7F; height: 4.5rem; background: url(../images/icon/arrow-down.svg) no-repeat right 1.5rem center #fff; background-size: 2rem auto;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}
.styled-select-wrapper select {display: block; width: 120%; border: none; background: transparent; height: 4.5rem; padding: 0 3rem 0 1.2rem;}
.styled-select-wrapper select option {background: none;}

input[type="checkbox"] {font-family: 'GeneralFont', Arial, Verdana; font-size: 0.6rem; line-height: 0.9rem;}
.styled-checkbox-wrapper {margin-bottom: 1rem;}
.styled-checkbox-wrapper input[type="checkbox"] {display: none;}
.styled-checkbox-wrapper label {font-family: 'GeneralFont'; font-size: 1.5rem; line-height: 2.3rem; color: #fff; display: inline-block; padding-left: 3.0rem; padding-top: 0.7rem; background: url(../images/icon/checkbox.svg) no-repeat left top 1.0rem; background-size: 1.6rem auto; text-align: justify;}
.styled-checkbox-wrapper label:hover {cursor: pointer;}
.styled-checkbox-wrapper label a {color: #FCD600;}
.styled-checkbox-wrapper input[type="checkbox"]:checked + label {background: url(../images/icon/checkbox-checked.svg) no-repeat left top 1.0rem; background-size: 1.6rem auto;}

input[type="radio"] {font-family: 'GeneralFont', Arial, Verdana;font-size: 15px; line-height: 24px;}
.styled-radio-wrapper{position: relative;}
.styled-radio-wrapper input[type="radio"] {display:none;}
.styled-radio-wrapper label {display:inline-block; padding: 1px 0px 0px 31px; font-size: 15px; line-height: 24px; font-family: 'GeneralFont', Arial, Verdana; background: url(../images/icon/radio-off.png) no-repeat left top 3px; cursor: pointer; background-size: 20px auto;}
.styled-radio-wrapper input[type="radio"]:checked + label {background: url(../images/icon/radio-on.png) no-repeat left top 3px; background-size: 20px auto;}

input[type="file"] {font-family: 'GeneralFont', Arial, Verdana;}
.styled-input-file-wrapper {cursor: pointer; font-size: 0.5rem; line-height: 0.7rem; color: #808080; background: #dbdbdb; border: 1px solid #dbdbdb; font-family: 'GeneralFont', Arial, Verdana; padding: 0.5rem; height: 50px; text-align: center;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;
transition: all 0.2s linear; -moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.styled-input-file-wrapper:hover {background: #282e68; color: #fff;}
.styled-input-file-wrapper input[type="file"] {display: none;}
.styled-input-file-wrapper label {}
label.upload-file-info {}
label.upload-file-info.warning {display: block; margin-top: 0.5rem; font-size: 0.4rem; line-height: 0.6rem;}

input[type="submit"], a.gen-btn {border: 0.1rem solid #1A1A1A; display: inline-block; color: #1A1A1A; font-size: 1.3rem; line-height: 2.1rem; font-family: 'BoldFont', Arial, Verdana; padding: 0.4rem 0.8rem; text-align: center; cursor: pointer; min-width: 18rem; border-radius: 0.5rem;
transition: all 0.2s linear; -moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
input[type="submit"]:hover, input[type="submit"]:focus, a.gen-btn:hover, a.gen-btn:focus {border: 0.1rem solid #FCD600; background: #FCD600; text-decoration: none;}
input[type="submit"].white, a.gen-btn.white {border-color: #fff; color: #fff;}
input[type="submit"].white:hover, input[type="submit"].white:focus, a.gen-btn.white:hover, a.gen-btn.white:focus {border-color: #FCD600; color: #1A1A1A;}
input[type="submit"].inverse, a.gen-btn.inverse {color: #FCD600; border: 1px solid #FCD600; background: transparent;}
input[type="submit"].inverse:hover, input[type="submit"].inverse:focus, a.gen-btn.inverse:hover {background: #FCD600; color: #fff;}
input[type="submit"].full-width {width: 100%;}
.gen-form input[type="submit"] {width: 15rem;}
button {font-family: 'GeneralFont', Arial, Verdana; font-size: 1.3rem; line-height: 2rem; cursor: pointer; padding: 0.5rem 1.5rem;}
a.gen-btn.disabled {color: #fff; background: #BFBFBF; cursor: default; pointer-events: none;}
a.flat-btn {display: inline-block; font-size: 1.6rem; line-height: 2.2rem;}
a.flat-btn.back {padding-left: 2.5rem; background: url(../images/icon/arrow-back.svg) no-repeat left center; background-size: 1.6rem auto;}

.gen-form-wrapper {margin-bottom: 20px;}
.gen-form-wrapper.no-mb {margin-bottom: 0;}
.gen-form-wrapper.inline {}
.gen-form-wrapper.inline .gfw-title {float: left; width: 22%; margin-right: 3%;}
.gen-form-wrapper.inline .gfw-sep {float: left; width: 3%; margin-right: 3%;}
.gen-form-wrapper.inline .gfw-input {float: left; width: 69%;}
.gen-form-wrapper.inline label {font-size: 15px; line-height: 45px;}

::placeholder {color: #5f5f5f;}

.form-notification {display: block; position: relative; padding: 0.5rem 0.6rem; margin-bottom: 0.5rem; border: 1px solid transparent;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}
.form-notification p {font-size: 0.5rem; line-height: 0.7rem; padding-right: 1rem; font-family: 'BoldFont', Arial, Verdana;}
.form-notification .close-btn {position: absolute; top: 50%; transform: translateY(-50%); right: 0.6rem; width: 0.4rem; height: 0.4rem; cursor: pointer;}
.form-notification.success {background: #d9ffd8; border: 1px solid #00b400;}
.form-notification.success p {color: #00b400;}
.form-notification.success .close-btn {background: url(../images/icon/amt-form-close-success.png) no-repeat center; background-size: 0.4rem 0.4rem;}
.form-notification.failed {background: #ffdddf; border: 1px solid #f03a17;}
.form-notification.failed p {color: #f03a17;}
.form-notification.failed .close-btn {background: url(../images/icon/amt-form-close-failed.png) no-repeat center; background-size: 0.4rem 0.4rem;}

label.form-label {font-size: 1.5rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; display: block;}
.text-required {color: #ff0000;}

input[type="text"].half-width {width: 50%;}

@media only screen and (max-width: 1024px) {
  form.gen-form .gen-form-row .gfr-half {width: 47%;}
}

@media only screen and (max-width: 500px) {
  form.gen-form .gen-form-row .gfr-half {width: 100%; margin-bottom: 3rem;}
  form.gen-form .gen-form-row .gfr-half:last-child {margin-bottom: 0;}

  .styled-checkbox-wrapper label {padding-left: 2.8rem;}
  .styled-checkbox-wrapper label, .styled-checkbox-wrapper label a {font-size: 1.4rem; line-height: 2.0rem;}
  .styled-checkbox-wrapper label, .styled-checkbox-wrapper input[type="checkbox"]:checked + label {background-position: left top 0.9rem;}
}

.error {
  color: red;
}

.alert-success {
  color: green;
}

.alert-danger {
  color: red;
}
/* /FORM */


/* HEADER */
header {position: fixed; top: 0; left: 0; width: 100%; z-index: 1000;}

#header-top-section {padding: 1.5rem 0; transition: all 0.25s ease-in;}
#header-top-section.sticky {padding: 1rem 0; background: #1A1A1A; box-shadow: 0 0 0.5rem #5f5f5f;}

#header-logo-col {grid-column: 1 / span 3; height: 4.0rem; transition: all 0.25s ease-in;}
#header-logo-col.sticky {height: 4.0rem;}
img.logo {height: 4.0rem; position: absolute; opacity: 0; transition: all 0.25s ease-in;}
img.logo.sticky {opacity: 1.0 !important; height: 4.0rem;}
#header-logo-col.regular img.logo.regular {opacity: 1.0;}
#header-logo-col.white img.logo.white {opacity: 1.0;}

#header-nav-col {grid-column: 4 / span 9;}
ul#header-nav-list {}
ul#header-nav-list > li {margin-right: 4rem; position: relative;}
ul#header-nav-list > li:last-child {margin-right: 0;}
ul#header-nav-list > li > a {display: inline-block; position: relative; cursor: pointer; font-size: 1.4rem; line-height: 2.0rem; color: #1A1A1A;}
ul#header-nav-list.white > li > a, ul#header-nav-list > li > a.sticky {color: #fff;}
ul#header-nav-list > li > a:hover {color: #FCD600; text-decoration: none;}
ul#header-nav-list > li > a.active {color: #FCD600 !important;}
ul#header-nav-list > li > a.has-sub {padding-right: 1.5rem;}
ul#header-nav-list > li > a.has-sub::before {content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: inline-block; width: 1rem; height: 1rem; background: url(../images/icon/dropdown-regular.svg) no-repeat center; background-size: 0.6rem auto !important; transition: all 0.2s linear;}
ul#header-nav-list.white > li > a.has-sub::before, ul#header-nav-list > li > a.sticky.has-sub::before {background: url(../images/icon/dropdown-white.svg) no-repeat center;}
ul#header-nav-list > li > a.has-sub:hover::before, ul#header-nav-list > li > a.has-sub.active::before {background: url(../images/icon/dropdown-color.svg) no-repeat center !important;}
ul#header-nav-list > li > a.has-sub.hovered::before {transform: translateY(-50%) rotate(180deg);}
ul#header-nav-list > li#mobile-nav {display: none;}
a.nav-with-icon {display: inline-block; padding-left: 3rem; position: relative;}
a.nav-with-icon::after {content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 2.0rem; height: 2.0rem; background-size: 2.0rem auto !important;}
a.nav-with-icon.id::after {background: url(../images/icon/flag-id.svg) no-repeat center;}
a.nav-with-icon.en::after {background: url(../images/icon/flag-en.svg) no-repeat center;}

.header-subnav-ct {position: absolute; width: 100%; padding-top: 0.5rem; display: none;}
.header-subnav-ct.lang {width: calc(100% + 1rem); margin-left: -1rem;}
ul.header-subnav-list {padding: 0.3rem; background: #fff; border-radius: 0.3rem; border: 0.1rem solid #bfbfbf;}
ul.header-subnav-list.no-pd {padding: 0;}
ul.header-subnav-list > li {}
ul.header-subnav-list > li > a {display: block; text-align: center; font-size: 1.3rem; line-height: 1.8rem; padding: 0.5rem; color: #000; border-radius: 0.3rem;}
ul.header-subnav-list > li > a.nav-with-icon {text-align: left; padding-left: 4rem;}
ul.header-subnav-list > li > a.nav-with-icon::after {left: 1rem;}
ul.header-subnav-list > li > a:hover {color: #000; background: #e0e0e0; text-decoration: none;}

#header-mobile-nav-section {display: none;}

@media only screen and (max-width: 1200px) {
  #header-logo-col {grid-column: 1 / span 3;}
  #header-nav-col {grid-column: 4 / span 9;}
  ul#header-nav-list > li {margin-right: 4rem;}
}

@media only screen and (max-width: 1024px) {
  #header-logo-col {grid-column: 1 / span 1;}
  #header-nav-col {grid-column: 2 / span 5;}
  ul#header-nav-list > li {margin-right: 2.8rem;}
  ul#header-nav-list > li > a {font-size: 1.3rem; line-height: 1.9rem;}
}

@media only screen and (max-width: 900px) {
  #header-logo-col {grid-column: 1 / span 2;}
  #header-nav-col {grid-column: 3 / span 4;}

  ul#header-nav-list > li {display: none; margin-right: 5rem;}
  ul#header-nav-list > li#mobile-nav, ul#header-nav-list > li#lang-nav {display: block;}

  #header-mobile-nav-section .cover {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 1200;}
  #header-mobile-nav-wrapper {position: fixed; top: 0; right: -30rem; width: 30rem; height: 100%; background: #fff; padding: 6rem 4rem 4rem 4rem; z-index: 1300; transition: all 0.2s linear;}
  #header-mobile-nav-wrapper.displayed {right: 0;}
  #header-mobile-nav-wrapper a.close {position: absolute; top: 1.5rem; right: 1.5rem; display: inline-block; width: 3rem; height: 3rem; background: url(../images/icon/cross.svg) no-repeat center; background-size: 2rem auto; cursor: pointer;}
  img#mobile-logo {max-height: 4.0rem;}
  ul#header-mobile-nav-list {margin-top: 4rem;}
  ul#header-mobile-nav-list:only-child {margin-top: 0;}
  ul#header-mobile-nav-list > li {margin-bottom: 1.5rem;}
  ul#header-mobile-nav-list > li:last-child {margin-bottom: 0;}
  ul#header-mobile-nav-list > li > a {display: inline-block; position: relative; font-size: 1.4rem; line-height: 2.0rem; color: #1A1A1A;}
  ul#header-mobile-nav-list > li > a:hover {color: #FCD600; text-decoration: none;}
  ul#header-mobile-nav-list > li > a.active, ul#header-mobile-nav-list > li > a.active:hover {color: #FCD600 !important; font-family: 'BoldFont', Arial, Verdana;}
  ul#header-mobile-nav-list > li > a.has-sub {padding-right: 2rem;}
  ul#header-mobile-nav-list > li > a.has-sub::after {content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: inline-block; width: 1rem; height: 1rem; background: url(../images/icon/dropdown-regular.svg) no-repeat center; background-size: 0.6rem auto !important; transition: all 0.2s linear;}
  ul#header-mobile-nav-list > li > a.has-sub.active::after {background: url(../images/icon/dropdown-color.svg) no-repeat center; background-size: 0.6rem auto !important;}
  ul#header-mobile-nav-list > li > a.has-sub.opened::after {transform: translateY(-50%) rotate(180deg);}
  .header-mobile-subnav-ct {padding: 0.5rem 1.5rem;}
  ul.header-mobile-subnav-list {}
  ul.header-mobile-subnav-list > li {margin-bottom: 0.5rem;}
  ul.header-mobile-subnav-list > li:last-child {margin-bottom: 0;}
  ul.header-mobile-subnav-list > li > a {font-size: 1.4rem; line-height: 2.0rem;}
  ul.header-mobile-subnav-list > li > a:hover {color: #FCD600;}
  ul.header-mobile-subnav-list > li > a.active {color: #FCD600 !important; font-family: 'BoldFont', Arial, Verdana;}
}

@media only screen and (max-width: 600px) {
  #header-logo-col, #header-logo-col.sticky, img.logo, img.logo.sticky {height: 3.6rem;}

  #header-logo-col {grid-column: 1 / span 2;}
  #header-nav-col {grid-column: 3 / span 2;}

  ul#header-nav-list > li {margin-right: 4rem;}
}

@media only screen and (max-width: 500px) {
  #header-mobile-nav-wrapper {right: -24rem; width: 24rem; padding: 7rem 3.5rem 3.5rem 3.5rem;}
}

@media only screen and (max-width: 420px) {
  ul#header-nav-list > li {margin-right: 2.5rem;}
}
/* /HEADER */


/* GENERAL ELEMENT */
section.top-image {padding: 0;}
section.top-image .inner {aspect-ratio: 4; background: #1A1A1A; position: relative;}
section.top-image .inner.no-bg {aspect-ratio: 4;}
section.top-image .inner.large {aspect-ratio: 3;}
section.top-image .inner img.bg {width: 100%; height: 100%; object-fit: cover;}

section.gen-title {}
section.gen-title.with-bg {background: #1A1A1A;}
section.gen-title .title-col {grid-column: 1 / -1;}
section.gen-title .title-col.narrow {grid-column: 1 / span 5;}
section.gen-title + section {margin-top: -8rem;}

.top-image-caption {position: absolute; top: 55%; left: 50%; transform: translate(-50%, -55%); width: 80%; text-align: center;}
.top-image-caption h2, .top-image-caption h3 {margin-bottom: 0;}
.top-image-caption h3 {font-size: 2.2rem;}
.top-image-caption h2 + h3 {margin-top: 1rem;}

.title-wrapper {padding-bottom: 2rem; position: relative; color: #1A1A1A;}
.title-wrapper.triquarter {width: 80%;}
.title-wrapper.narrow {width: 60%;}
.title-wrapper h2 {margin-bottom: 0; font-family: 'BoldFont', Arial, Verdana; font-size: 2.2rem; line-height: 3.0rem;}
.title-wrapper h2.small {font-size: 1.8rem; line-height: 2.6rem;}
.title-wrapper h2.medium {font-size: 3.0rem; line-height: 3.8rem;}
.title-wrapper h2.big {font-size: 3.6rem; line-height: 4.2rem;}
.title-wrapper h2.xbig {font-size: 4.2rem; line-height: 5.2rem;}
.title-wrapper h3 {margin-bottom: 0; font-family: 'SemiBoldFont', Arial, Verdana; font-size: 3.8rem; line-height: 4.8rem;}
.title-wrapper h3.small {font-size: 2.2rem; line-height: 3.0rem;}
.title-wrapper h3.xsmall {font-size: 1.8rem; line-height: 2.6rem;}
.title-wrapper h2 + h3 {margin-top: 2.5rem;}
.title-wrapper h2 + p, .title-wrapper h3 + p {margin-top: 1.5rem;}
.title-wrapper h2:only-child::after {content: ""; position: absolute; bottom: 0; left: 0; width: 20rem; height: 0.5rem; background: #FCD600;}
.title-wrapper h3::after {content: ""; position: absolute; bottom: 0; left: 0; width: 30rem; height: 0.5rem; background: #FCD600;}
.title-wrapper.center {margin: 0 auto; text-align: center; display: block;}
.title-wrapper.center h2:only-child::after, .title-wrapper.center h3::after {left: 50%; transform: translateX(-50%);}
.title-wrapper.narrow h2:only-child::after, .title-wrapper.narrow h3::after {width: 100%;}
.title-wrapper.wide-und h2:only-child::after, .title-wrapper.wide-und h3::after {width: 80%;}
.title-wrapper.no-und {padding-bottom: 0;}
.title-wrapper.no-und h2::after, .title-wrapper.no-und h3::after {display: none;}

.description-wrapper {}
.description-wrapper.center {margin: 0 auto; text-align: center;}
.description-wrapper h2:only-child {margin-bottom: 0;}
.description-wrapper .wysiwyg-content + .wysiwyg-content {margin-top: 3rem;}
.description-wrapper > img + .wysiwyg-content {margin-top: 4rem;}
.title-wrapper + .description-wrapper {margin-top: 3rem;}

.btn-link-wrapper {margin-top: 3rem;}
.btn-link-wrapper:only-child {margin-top: 0;}

@media only screen and (max-width: 1200px) {
  section.gen-title .title-col.narrow {grid-column: 1 / span 8;}

  .title-wrapper.narrow {width: 70%;}
}

@media only screen and (max-width: 1024px) {
  section.top-image .inner {aspect-ratio: auto !important; padding-top: 12rem; padding-bottom: 6rem;}
  section.top-image .inner.with-img-bg {padding-top: 0; padding-bottom: 0; height: 30rem;}
  .top-image-caption {position: relative; transform: none; top: auto; left: auto; margin: 0 auto; width: 90%;}
  section.top-image .inner.with-img-bg .top-image-caption {position: absolute; top: 60%; left: 50%; transform: translate(-50%, -60%);}

  section.gen-title .title-col.narrow {grid-column: 1 / span 4;}

  .title-wrapper h2 {font-size: 1.9rem; line-height: 2.7rem;}
  .title-wrapper h2.big {font-size: 3.2rem; line-height: 4.0rem;}
  .title-wrapper h2.xbig {font-size: 4.0rem; line-height: 4.8rem;}
  .title-wrapper h3 {font-size: 3.4rem; line-height: 4.2rem;}

  section.gen-title + section {margin-top: -5rem;}
}

@media only screen and (max-width: 768px) {
  section.gen-title .title-col.narrow {grid-column: 1 / -1;}

  .title-wrapper h2 {font-size: 1.8rem; line-height: 2.6rem;}
  .title-wrapper h2.medium, .title-wrapper h2.big {font-size: 2.8rem; line-height: 3.6rem;}
  .title-wrapper h3 {font-size: 3.2rem; line-height: 4.0rem;}

  section.gen-title + section {margin-top: -3rem;}
}

@media only screen and (max-width: 600px) {
  section.top-image .inner.with-img-bg {height: 26rem;}

  .title-wrapper.triquarter {width: 100%;}
  .title-wrapper h2.medium, .title-wrapper h2.big {font-size: 2.6rem; line-height: 3.4rem;}
  .title-wrapper h2.xbig {font-size: 3.6rem; line-height: 4.4rem;}
  .title-wrapper h3.xsmall {font-size: 1.6rem; line-height: 2.4rem;}
}

@media only screen and (max-width: 500px) {
  .title-wrapper h2 {font-size: 1.7rem; line-height: 2.5rem;}
  .title-wrapper h2.xbig {font-size: 3.4rem; line-height: 4.2rem;}
  .title-wrapper h3 {font-size: 2.8rem; line-height: 3.6rem;}
  .title-wrapper h3::after {width: 24rem;}
  .title-wrapper span.d-block {display: inline;}
}

@media only screen and (max-width: 420px) {
  .title-wrapper h2 {font-size: 1.6rem; line-height: 2.4rem;}
  .title-wrapper h3 {font-size: 2.4rem; line-height: 3.2rem;}
}
/* /GENERAL ELEMENT */


/* HOME */
section.home-slideshow {}
main > section:first-of-type.home-slideshow {margin-top: 0;}
main > section:last-of-type.home-slideshow {margin-bottom: 0;}

.slideshow-item {position: relative;}
.slideshow-item .cover {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); z-index: 200;}
.slideshow-item img {width: 100%; height: 100%; object-fit: cover; z-index: 100;}
.slideshow-item video {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; object-fit: cover;}
.slideshow-item .caption {position: absolute; bottom: 5rem; left: 4%; width: 80%; z-index: 300;}
.slideshow-item .caption h2 {font-size: 4.0rem; line-height: 5.0rem; color: #fff;}

.home-slideshow-list {}
.home-slideshow-list .slideshow-item {height: 100vh;}

section.text-image-two-cols {position: relative;}
section.text-image-two-cols.with-bg {background: #1A1A1A;}
section.text-image-two-cols.rtl .grid {direction: rtl;}
section.text-image-two-cols .description-col {grid-column: 7 / span 6; padding-top: 6rem; padding-bottom: 6rem; direction: ltr;}
section.text-image-two-cols .description-col.with-pd {padding-left: 6rem; padding-right: 0;}
section.text-image-two-cols.rtl .description-col.with-pd {padding-left: 0; padding-right: 6rem;}
section.text-image-two-cols .description-col.no-ptb {padding-top: 0; padding-bottom: 0;}
section.text-image-two-cols.wide .description-col {grid-column: 6 / span 7;}
section.text-image-two-cols.narrow .description-col {grid-column: 8 / span 5;}
section.text-image-two-cols .img-col {position: absolute; left: 0; top: 0; width: 45%; height: 100%;}
section.text-image-two-cols .img-col.with-pd {padding-top: 8rem; padding-bottom: 8rem;}
section.text-image-two-cols.wide .img-col {width: 38%;}
section.text-image-two-cols.narrow .img-col {width: 53%;}
section.text-image-two-cols.rtl .img-col {left: auto; right: 0;}
section.text-image-two-cols .container .img-col {position: relative; left: auto; top: auto; right: auto; bottom: auto; width: 100%; grid-column: 1 / span 6; padding-left: 0; padding-right: 3rem;}
section.text-image-two-cols.rtl .container .img-col {padding-left: 3rem; padding-right: 0;}
section.text-image-two-cols.wide .container .img-col {grid-column: 1 / span 5;}
section.text-image-two-cols.narrow .container .img-col {grid-column: 1 / span 7;}
section.text-image-two-cols .img-col img {width: 100%; height: 100%; object-fit: cover;}
section.text-image-two-cols .img-col.fill img {width: auto; height: auto; object-fit: fill;}
section.text-image-two-cols .container .img-col img {width: 100%; height: auto;}
section.text-image-two-cols .container .img-col img.full-height {height: 100%;}
section.text-image-two-cols img.abs-icon {position: absolute; max-height: 20rem;}
section.text-image-two-cols img.abs-icon.top {top: -6rem;}
section.text-image-two-cols img.abs-icon.right {right: 0;}

section.service {}
section.service.with-bg {background: #1A1A1A;}
section.service .title-row + .detail-row {margin-top: 6rem;}
section.service .container {width: 85%;}
section.service .title-wrapper {width: 85%;}
section.service .title-wrapper.fw {width: 100%;}
ul.service-list {margin-bottom: -3rem;}
ul.service-list > li {width: 23.5%; margin-right: 2%; margin-bottom: 3rem;}
ul.service-list > li:nth-child(4n), ul.service-list > li:last-child {margin-right: 0;}
ul.service-list > li .inner {padding: 2rem 2.5rem 3.5rem 2.5rem; background: #fff; height: 100%; box-shadow: 0.3rem 0.3rem 1.0rem #afafaf; text-align: center; border-radius: 0.5rem;}
section.service.with-bg ul.service-list > li .inner {box-shadow: none;}
ul.service-list > li .inner .img-wrap {}
ul.service-list > li .inner .img-wrap img {margin: 0 auto; height: 11rem;}
ul.service-list > li .inner .description-wrap h3 {font-size: 1.8rem; line-height: 2.6rem; font-family: 'SemiBoldFont', Arial, Verdana; min-height: 3.2rem; margin-bottom: 0;}
ul.service-list > li .inner .description-wrap p {font-size: 1.2rem; line-height: 2.0rem;}
ul.service-list > li .inner .description-wrap h3 + p {margin-top: 2rem;}
ul.service-list > li .inner .img-wrap + .description-wrap {margin-top: 2rem;}

section.call-to-action {}
section.call-to-action.with-bg {background: #1A1A1A;}
section.with-bg + section.call-to-action.with-bg .container {border-top: 0.1rem solid #FCD600; padding-top: 6rem;}
section.call-to-action .description-col {grid-column: 3 / span 8; text-align: center;}
section.call-to-action .description-col.full-width {grid-column: 1 / -1;}
section.call-to-action .description-col h3, section.call-to-action .description-col h5 {margin-bottom: 0;}
section.call-to-action .description-col h3 + h5 {margin-top: 0.5rem;}

@media only screen and (max-width: 1200px) {
  section.service .container, section.service .title-wrapper {width: 90%;}

  section.text-image-two-cols.wide .description-col {grid-column: 5 / span 8;}
  section.text-image-two-cols.wide .img-col {width: 32%;}
  section.text-image-two-cols.wide .container .img-col {grid-column: 1 / span 4;}

  section.text-image-two-cols.narrow .container .img-col img {height: 100%;}

  section.text-image-two-cols .img-col.with-pd {padding-top: 6rem; padding-bottom: 6rem;}

  section.call-to-action .description-col {grid-column: 2 / span 10;}
}

@media only screen and (max-width: 1024px) {
  .slideshow-item .caption {width: 92%;}
  .slideshow-item .caption h2 {font-size: 3.6rem; line-height: 4.4rem;}

  section.text-image-two-cols .container .img-col {grid-column: 1 / span 3;}
  section.text-image-two-cols .description-col {grid-column: 4 / span 3; padding-top: 0; padding-bottom: 0;}
  section.text-image-two-cols .container .img-col.large-resp, section.text-image-two-cols .container .description-col.large-resp {grid-column: 1 / -1 !important; margin: 0; padding: 0;}
  section.text-image-two-cols .container .img-col.large-resp + .description-col {margin-top: 4rem;}
  section.text-image-two-cols .container .img-col.large-resp img {width: auto; height: auto; object-fit: fill; margin: 0 auto; max-height: 36rem;}
  section.text-image-two-cols .container .description-col.large-resp {text-align: center; padding-left: 6rem !important; padding-right: 6rem !important;}
  section.text-image-two-cols img.abs-icon {max-height: 16rem;}

  section.text-image-two-cols.wide .description-col {grid-column: 3 / span 4;}
  section.text-image-two-cols.wide .container .img-col {grid-column: 1 / span 2;}

  section.text-image-two-cols.narrow .description-col {grid-column: 4 / span 3;}
  section.text-image-two-cols.narrow .container .img-col {grid-column: 1 / span 3;}

  ul.service-list > li {width: 48.5%; margin-right: 3% !important;}
  ul.service-list > li:nth-child(2n), ul.service-list > li:last-child {margin-right: 0 !important;}
  ul.service-list > li .inner {display: flex; justify-content: space-between; flex-wrap: wrap; padding: 3rem; text-align: left;}
  ul.service-list > li .inner .img-wrap {width: 25%;}
  ul.service-list > li .inner .img-wrap img {width: 100%; height: auto;}
  ul.service-list > li .inner .description-wrap {width: 67%;}
  ul.service-list > li .inner .description-wrap h3 {min-height: auto;}
  ul.service-list > li .inner .description-wrap h3 + p {margin-top: 1.5rem;}
  ul.service-list > li .inner .img-wrap + .description-wrap {margin-top: 0;}

  section.call-to-action .description-col {grid-column: 1 / -1;}
}

@media only screen and (max-width: 900px) {
  section.text-image-two-cols .description-col {grid-column: 3 / span 4; padding-left: 8rem; padding-right: 0;}
  section.text-image-two-cols.rtl .description-col {padding-left: 0; padding-right: 8rem;}
  section.text-image-two-cols .img-col {width: 38%;}
  section.text-image-two-cols .container .img-col {grid-column: 1 / span 3;}
  section.text-image-two-cols .container .img-col.large-resp img {max-height: 32rem;}
  section.text-image-two-cols .container .img-col + .description-col {grid-column: 4 / span 3; padding-right: 0; padding-left: 0;}
}

@media only screen and (max-width: 768px) {
  .slideshow-item .caption {left: 5%; width: 90%;}
  .slideshow-item .caption h2 {font-size: 3.2rem; line-height: 4.0rem;}
  .home-slideshow-list .slideshow-item {height: 92vh;}

  section.text-image-two-cols .img-col {position: relative; width: 100%; margin: 0 auto; width: 90%; height: 32rem; margin-bottom: 4rem}
  section.text-image-two-cols .img-col.fill {height: 40rem;}
  section.text-image-two-cols .img-col img {margin: 0 auto;}
  section.text-image-two-cols .description-col {grid-column: 1 / -1; padding-left: 0 !important; padding-right: 0 !important;}
  section.text-image-two-cols .container .img-col {grid-column: 1 / -1; height: auto;}
  section.text-image-two-cols .container .img-col img {height: auto; width: auto; margin: 0 auto; object-fit: fill; max-height: 40rem;}
  section.text-image-two-cols .container .img-col.large-resp img {max-height: 28rem;}
  section.text-image-two-cols .container .img-col img.full-height {width: 100%; height: 100%; object-fit: cover; max-height: 32rem;}
  section.text-image-two-cols .container .img-col + .description-col {grid-column: 1 / -1;}
  section.text-image-two-cols img.abs-icon {display: none;}

  section.text-image-two-cols.wide .description-col, section.text-image-two-cols.wide .container .img-col {grid-column: 1 / -1; padding-left: 0; padding-right: 0;}
  section.text-image-two-cols.narrow .description-col, section.text-image-two-cols.narrow .container .img-col {grid-column: 1 / -1; padding-left: 0; padding-right: 0;}

  ul.service-list > li {margin-bottom: 2.5rem;}
  ul.service-list > li .inner {text-align: center; display: block; padding: 2.5rem;}
  ul.service-list > li .inner .img-wrap, ul.service-list > li .inner .description-wrap {width: 100%;}
  ul.service-list > li .inner .img-wrap img {height: 10rem;}
  ul.service-list > li .inner .description-wrap h3 {min-height: 3.2rem;}
  ul.service-list > li .inner .img-wrap + .description-wrap {margin-top: 2rem;}

  section.text-image-two-cols .img-col.with-pd {padding-top: 0; padding-bottom: 0; height: 32rem;}
}

@media only screen and (max-width: 600px) {
  section.text-image-two-cols .container .description-col.large-resp {padding-left: 0 !important; padding-right: 0 !important; text-align: left;}

  section.call-to-action .description-col h3 {font-size: 2.2rem; line-height: 3.0rem;}
  section.call-to-action .description-col h5 {font-size: 1.5rem; line-height: 2.3rem;}
  section.with-bg + section.call-to-action.with-bg {margin-top: -8rem;}
  section.with-bg + section.call-to-action.with-bg .container {padding-top: 4rem;}
}

@media only screen and (max-width: 500px) {
  .slideshow-item .caption {bottom: 5rem;}
  .slideshow-item .caption h2 {font-size: 2.8rem; line-height: 3.6rem;}

  section.text-image-two-cols .img-col, section.text-image-two-cols .img-col.fill {height: 27rem;}
  section.text-image-two-cols .img-col.with-pd {height: 27rem;}
  section.text-image-two-cols .container .img-col img.full-height {max-height: 27rem;}

  ul.service-list > li {width: 100%; margin-right: 0 !important; margin-bottom: 2rem;}
  ul.service-list > li .inner {padding: 2.5rem 3rem;}
  ul.service-list > li .inner .description-wrap h3 {min-height: auto;}
  ul.service-list > li .inner .description-wrap p {font-size: 1.3rem; line-height: 2.1rem;}
  ul.service-list > li .inner .description-wrap h3 + p {margin-top: 1rem;}
}

@media only screen and (max-width: 420px) {
  .slideshow-item .caption h2 {font-size: 2.4rem; line-height: 3.2rem;}

  section.text-image-two-cols .img-col, section.text-image-two-cols .img-col.fill {height: 23rem;}
  section.text-image-two-cols .img-col.with-pd {height: 23rem;}
  section.text-image-two-cols .container .img-col img.full-height {max-height: 23rem;}
}
/* /HOME */


/* ABOUT US */
section.our-work {}
section.our-work.with-bg {background: #4D4D4D;}
section.our-work.with-bg.large-mb {padding-bottom: 30rem;}
section.our-work .inner {grid-column: 2 / span 10;}
section.our-work .inner .description-wrapper.center {width: 88%;}

section.our-partner {}
section.our-work.with-bg.large-mb + section.our-partner {margin-top: -30rem;}
section.our-partner .inner {background: #fff; border-radius: 2.5rem; box-shadow: 0 0 1rem #9f9f9f; padding: 6rem;}
section.our-partner .inner .title-wrapper {width: 85%; margin-top: 8rem;}

ul.main-partner-list {margin-top: 6rem; padding-left: 4rem; padding-right: 4rem; margin-bottom: 3rem;}
ul.main-partner-list:only-child {margin-top: 0; margin-bottom: -4rem;}
ul.main-partner-list > li {width: 50%; text-align: center; padding-left: 3rem; padding-right: 3rem; margin-bottom: 4rem;}
ul.main-partner-list > li .img-wrap {height: 7rem; position: relative; margin-bottom: 1rem;}
ul.main-partner-list > li .img-wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 95%; max-height: 95%;}
ul.main-partner-list > li .description-wrap {}
ul.main-partner-list > li .description-wrap p {font-size: 1.2rem; line-height: 2.0rem;}

div.other-partner-list > img {
  height: 10rem;
  margin: 1rem 2rem;
}
div.other-partner-list.icons-5 > img {
  height: 9rem;
}
div.other-partner-list.icons-2.icons-local_partners > img {
  height: 7rem;
}

@media only screen and (max-width: 1200px) {
  ul.other-partner-list {padding-left: 3rem; padding-right: 3rem;}
}

@media only screen and (max-width: 1024px) {
  section.our-work .inner {grid-column: 1 / -1;}

  ul.main-partner-list {padding-left: 0; padding-right: 0;}
  ul.main-partner-list > li {width: 46%; margin-right: 8%; padding-left: 0; padding-right: 0;}
  ul.main-partner-list > li:nth-child(2n), ul.main-partner-list > li:last-child {margin-right: 0;}

  ul.other-partner-list > li {width: 15%; margin-right: 2% !important; margin-bottom: 2rem;}
  ul.other-partner-list > li:nth-child(6n), ul.other-partner-list > li:last-child {margin-right: 0 !important;}
  ul.other-partner-list > li .img-wrap {height: 6rem; width: 100%; padding-left: 0; padding-right: 0;}
  ul.other-partner-list > li .img-wrap img {width: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 90%; max-height: 90%;}
}

@media only screen and (max-width: 768px) {
  section.our-partner .inner .title-wrapper {width: 100%;}

  ul.main-partner-list > li {width: 47.5%; margin-right: 5%;}

  ul.other-partner-list {padding-left: 0; padding-right: 0;}
  ul.other-partner-list > li {width: 19%; margin-right: 1.25% !important;}
  ul.other-partner-list > li:nth-child(5n), ul.other-partner-list > li:last-child {margin-right: 0 !important;}
  ul.other-partner-list > li .img-wrap {height: 8rem; width: 100%;}
  ul.other-partner-list > li .img-wrap img {max-width: 85%; max-height: 90%;}
}

@media only screen and (max-width: 600px) {
  section.our-work .inner .description-wrapper.center {width: 100%;}

  section.our-work.with-bg.large-mb {padding-bottom: 24rem;}
  section.our-work.with-bg.large-mb + section.our-partner {margin-top: -26rem;}
  section.our-partner .inner {padding: 4rem;}

  ul.main-partner-list {margin-top: 4rem;}

  ul.other-partner-list > li {width: 23.5%; margin-right: 2% !important;}
  ul.other-partner-list > li:nth-child(4n), ul.other-partner-list > li:last-child {margin-right: 0 !important;}
  ul.other-partner-list > li .img-wrap {height: 7rem;}
}

@media only screen and (max-width: 500px) {
  ul.main-partner-list > li {width: 100%; margin-right: 0;}
  ul.main-partner-list > li .img-wrap {height: 6rem;}
  ul.main-partner-list > li .description-wrap p {font-size: 1.3rem; line-height: 2.1rem;}

  ul.other-partner-list {margin-top: 2rem;}
  ul.other-partner-list > li {width: 32%; margin-right: 2% !important;}
  ul.other-partner-list > li:nth-child(3n), ul.other-partner-list > li:last-child {margin-right: 0 !important;}
}
/* /ABOUT US */


/* WHY GO SOLAR */
section.divider-image {}
section.divider-image.with-bg {padding: 0;}
section.divider-image .image-row {z-index: 200; position: relative;}
section.divider-image .image-row img {width: 100%;}
section.divider-image .caption-row {z-index: 300; position: relative;}
section.divider-image .caption-row .caption-col {grid-column: 8 / span 5; padding-right: 4rem;}
section.divider-image .caption-row .caption-col .inner {}
section.divider-image .image-row + .caption-row {margin-top: -10rem;}

@media only screen and (max-width: 1200px) {
  section.divider-image .caption-row .caption-col {grid-column: 7 / span 6;}
}

@media only screen and (max-width: 1024px) {
  section.divider-image .caption-row .caption-col {grid-column: 3 / span 4;}
}

@media only screen and (max-width: 768px) {
  section.divider-image .caption-row .caption-col {grid-column: 2 / span 5; padding-left: 4rem;}
}

@media only screen and (max-width: 600px) {
  section.divider-image .image-row {height: 24rem;}
  section.divider-image .image-row img {width: 100%; height: 100%; object-fit: cover;}

  section.divider-image .caption-row .caption-col {grid-column: 1 / -1; padding-left: 2rem; padding-right: 2rem;}
}

@media only screen and (max-width: 500px) {
  section.divider-image .image-row {height: 23rem;}
}
/* /WHY GO SOLAR */


/* HOW IT WORKS */
ul.custom-icon-list {}
ul.custom-icon-list > li {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; margin-bottom: 1.5rem;}
ul.custom-icon-list > li:last-child {margin-bottom: 0;}
ul.custom-icon-list > li .cicon-col {width: 11%;}
ul.custom-icon-list > li .cicon-col img {width: 100%;}
ul.custom-icon-list > li .cdescription-col {width: 85%;}

section.text-two-cols {}
section.text-two-cols.with-bg {background: #1A1A1A;}
section.with-bg + section.text-two-cols.with-bg {padding-top: 0.5rem;}
section.text-two-cols .title-col, section.text-two-cols .left-col {grid-column: 2 / span 5; padding-right: 1.5rem;}
section.text-two-cols .right-col {grid-column: 7 / span 5;}
section.text-two-cols.type-2 .left-col {grid-column: 1 / span 5; padding-right: 3rem;}
section.text-two-cols.type-2 .right-col {grid-column: 6 / span 7;}
section.text-image-two-cols.no-bg + section.text-two-cols.no-bg {margin-top: 0;}

@media only screen and (min-width: 1400px) {
  ul.custom-icon-list > li {margin-bottom: 2rem;}
  ul.custom-icon-list > li .cicon-col {width: 12%;}
  ul.custom-icon-list > li .cdescription-col {width: 84%;}
}

@media only screen and (max-width: 1200px) {
  section.text-two-cols .title-col, section.text-two-cols .left-col {grid-column: 1 / span 6; padding-left: 3rem; padding-right: 3rem;}
  section.text-two-cols .right-col {grid-column: 7 / span 6; padding-left: 3rem; padding-right: 3rem;}
  section.text-two-cols.type-2 .left-col {padding: 0; padding-right: 3rem;}
  section.text-two-cols.type-2 .right-col {padding: 0; padding-left: 3rem;}
}

@media only screen and (max-width: 1024px) {
  section.text-two-cols .title-col {grid-column: 1 / -1;}
  section.text-two-cols .left-col {grid-column: 1 / span 3;}
  section.text-two-cols .right-col {grid-column: 4 / span 3;}
  section.text-two-cols.type-2 .left-col, section.text-two-cols.type-2 .right-col {grid-column: 1 / -1; padding: 0; padding-left: 4rem; padding-right: 4rem; text-align: center;}
  section.text-two-cols.type-2 .left-col + .right-col {margin-top: 2rem;}

  ul.custom-icon-list > li .cicon-col {width: 13%;}
  ul.custom-icon-list > li .cdescription-col {width: 83%;}
  ul.custom-icon-list > li .cdescription-col h5 {font-size: 1.6rem; line-height: 2.2rem;}

  /* section.with-bg + section.text-two-cols.with-bg {margin-top: -8rem;}  */
  section.text-image-two-cols.no-bg + section.text-two-cols.no-bg {margin-top: -1rem;}
}

@media only screen and (max-width: 768px) {
  ul.custom-icon-list > li .cicon-col {width: 8%;}
  ul.custom-icon-list > li .cdescription-col {width: 88%;}

  /* section.with-bg + section.text-two-cols.with-bg {margin-top: -6rem;}  */
  section.text-two-cols .title-col, section.text-two-cols .left-col, section.text-two-cols .right-col {padding-left: 0; padding-right: 0;}
  section.text-two-cols.type-2 .left-col, section.text-two-cols.type-2 .right-col {padding-left: 0; padding-right: 0; text-align: left;}

  section.text-image-two-cols.no-bg + section.text-two-cols.no-bg {margin-top: 0;}
}

@media only screen and (max-width: 600px) {
  section.text-two-cols .left-col, section.text-two-cols .right-col {grid-column: 1 / -1;}
  section.text-two-cols .left-col + .right-col {margin-top: 1.2rem;}

  ul.custom-icon-list > li .cicon-col {width: 10%;}
  ul.custom-icon-list > li .cdescription-col {width: 86%;}
}

@media only screen and (max-width: 500px) {
  ul.custom-icon-list > li .cicon-col {width: 12.5%;}
  ul.custom-icon-list > li .cdescription-col {width: 83%;}
  ul.custom-icon-list > li .cdescription-col h5 {font-size: 1.5rem; line-height: 2.1rem;}
}

@media only screen and (max-width: 420px) {
  ul.custom-icon-list > li .cicon-col {width: 14%;}
  ul.custom-icon-list > li .cdescription-col {width: 80%;}
}
/* /HOW IT WORKS */


/* Project */
section.project-list {}
section.project-list.with-brdtop .container {padding-top: 8rem; border-top: 0.1rem solid #1A1A1A;}
section.project-list .project-title-row + .project-detail-row {margin-top: 6rem;}
section.project-list .project-title-row .title-col {grid-column: 1 / span 6;}
section.project-list .project-title-row .more-col {grid-column: 10 / span 3; text-align: right;}
section.project-list .project-more-row-resp {display: none;}

ul.project-category-list {margin-bottom: -2rem;}
ul.project-category-list > li {margin-right: 4rem; margin-bottom: 2rem;}
ul.project-category-list > li:last-child {margin-right: 0;}
ul.project-category-list > li > a {color: #1A1A1A; display: inline-block; border-bottom: 0.2rem solid transparent;}
ul.project-category-list > li > a:hover {color: #FCD600; text-decoration: none;}
ul.project-category-list > li > a.active, ul.project-category-list > li > a.active:hover {border-bottom: 0.2rem solid #1A1A1A;}
.title-wrapper + ul.project-category-list {margin-top: 1.5rem;}

ul.project-list {margin-bottom: -8rem;}
ul.project-list > li {justify-content: flex-start; width: 32%; margin-right: 2%; margin-bottom: 8rem;}
ul.project-list > li:nth-child(3n), ul.project-list > li:last-child {margin-right: 0;}
ul.project-list.three-latest > li:nth-child(n + 4) {display: none;}
.project-item > .img-wrap {aspect-ratio: 1.68; border-radius: 1.6rem; overflow: hidden; margin-bottom: 2rem;}
.project-item > .img-wrap img {width: 100%; height: 100%; object-fit: cover; transition: all 0.2s linear;}
.project-item > .img-wrap img:hover {transform: scale(1.1);}
.project-item > .description-wrap {}
p.project-date, .project-item > .description-wrap p {color: #797979; font-size: 1.2rem; line-height: 2.0rem;}
.project-item > .description-wrap h3, .project-item > .description-wrap h3 a {color: #1A1A1A; font-size: 1.7rem; line-height: 2.5rem; font-family: 'BoldFont', Arial, Verdana;}
.project-item > .description-wrap h3 a:hover {color: #FCD600; text-decoration: none;}
.project-item > .description-wrap h3 {margin-bottom: 0.8rem;}
.project-item > .description-wrap p.project-date + h3 {margin-top: 1.2rem;}

section.project-detail {}
section.project-detail .project-detail-col {grid-column: 1 / span 8;}
section.project-detail .project-share-col {grid-column: 10 / span 3; position: relative;}
section.project-detail .project-share-col .inner {position: sticky; top: 9rem;}

.project-detail-col > h2 {font-family: 'SemiBoldFont', Arial, Verdana;}
.project-detail-col .description-wrapper > img {margin: 0 auto; width: 100%;}

ul.project-share-list {margin-top: 2.5rem;}
ul.project-share-list:only-child {margin-top: 0;}
/*
ul.project-share-list > li {margin-right: 2rem; width: 2rem; height: 2rem; position: relative;}
*/
ul.project-share-list > li:last-child {margin-right: 0;}
ul.project-share-list > li > a {cursor: pointer;}
/*
ul.project-share-list > li img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 95%; max-height: 95%; transition: all 0.2s linear;}
ul.project-share-list > li img:hover {transform: translate(-50%, -50%) scale(1.2);}
*/

@media only screen and (max-width: 1024px) {
  section.project-list.with-brdtop .container {padding-top: 6rem;}

  section.project-list .project-title-row .title-col {grid-column: 1 / span 4; padding-right: 4rem;}
  section.project-list .project-title-row .more-col {grid-column: 5 / span 2;}

  ul.project-list > li {width: 48%; margin-right: 4% !important;}
  ul.project-list > li:nth-child(2n), ul.project-list > li:last-child {margin-right: 0 !important;}
  ul.project-list.three-latest > li:nth-child(n + 4) {display: block;}
  p.project-date, .project-item > .description-wrap p {font-size: 1.5rem; line-height: 2.3rem;}
  .project-item > .description-wrap h3, .project-item > .description-wrap h3 a {font-size: 2.0rem; line-height: 2.8rem;}
  .project-item > .description-wrap p.project-date + h3 {margin-top: 1.5rem;}
  .project-item > .description-wrap h3 {margin-bottom: 1rem;}

  section.project-detail .grid.col-12 {grid-template-columns: repeat(12, 1fr); column-gap: 1.5rem;}
  section.project-detail .project-detail-col {grid-column: 1 / span 9; padding-right: 4rem;}
}

@media only screen and (max-width: 768px) {
  section.project-detail .project-detail-col {padding-right: 3rem;}
  ul.project-share-list > li {margin-right: 1.8rem;}
}

@media only screen and (max-width: 600px) {
  section.project-list .project-title-row .title-col {grid-column: 1 / -1;}
  section.project-list .project-title-row .more-col {display: none;}

  section.project-list .project-title-row + .project-detail-row {margin-top: 4rem;}

  section.project-list .project-more-row-resp {display: block; margin-top: 4rem;}
  section.project-list .project-more-row-resp .more-col {grid-column: 1 / - 1; text-align: center;}

  section.project-detail .project-detail-col {grid-column: 1 / -1; padding-right: 0;}
  section.project-detail .project-share-col {grid-column: 1 / -1; margin-top: 4rem;}
  section.project-detail .project-share-col p.small {font-size: 1.4rem; line-height: 2.2rem;}
  ul.project-share-list {margin-top: 1.5rem;}
  ul.project-share-list > li {margin-right: 2.5rem; width: 2.4rem; height: 2.4rem;}
}

@media only screen and (max-width: 500px) {
  ul.project-list {margin-bottom: -4rem;}
  ul.project-list > li {width: 100%; margin-right: 0 !important; margin-bottom: 6rem;}
  ul.project-list.three-latest > li:nth-child(n + 4) {display: none;}
  p.project-date, .project-item > .description-wrap p {font-size: 1.4rem; line-height: 2.4rem;}
  .project-item > .description-wrap h3, .project-item > .description-wrap h3 a {font-size: 2.0rem; line-height: 2.8rem;}
}
/* /project */


/* FAQ */
section.faq {}
section.faq .faq-title-row + .faq-detail-row {margin-top: 6rem;}
section.faq .faq-title-row .inner, section.faq .faq-detail-row .inner {grid-column: 3 / span 8;}

ul.faq-list {}
ul.faq-list > li {padding: 2rem 0; border-bottom: 0.1rem solid #1A1A1A;}
ul.faq-list > li .question {}
ul.faq-list > li .question h3 {font-family: 'SemiBoldFont', Arial, Verdana; font-size: 2.0rem; line-height: 2.8rem; cursor: pointer; padding-right: 4rem; position: relative; transition: all 0.2s linear;}
ul.faq-list > li .question h3:hover {color: #FCD600;}
ul.faq-list > li .question h3::after {content: ""; position: absolute; top: 0.7rem; right: 0; display: inline-block; width: 1.4rem; height: 1.4rem; background: url(../images/icon/plus.svg) no-repeat center; background-size: 1.2rem auto; transition: all 0.2s linear;}
ul.faq-list > li .question h3.opened::after {background: url(../images/icon/minus.svg) no-repeat center; background-size: 1.2rem auto;}
ul.faq-list > li .answer {margin-top: 2.5rem; padding-right: 8rem; display: none;}

@media only screen and (max-width: 1200px) {
  section.faq .faq-title-row .inner {grid-column: 2 / span 10;}
  section.faq .faq-detail-row .inner {grid-column: 2 / span 10; padding-left: 4rem; padding-right: 4rem;}
}

@media only screen and (max-width: 1024px) {
  section.faq .faq-title-row .inner, section.faq .faq-detail-row .inner {grid-column: 1 / -1; padding-left: 6rem; padding-right: 6rem;}

  ul.faq-list > li .question h3 {font-size: 1.8rem; line-height: 2.6rem;}
  ul.faq-list > li .question h3::after, ul.faq-list > li .question h3.opened::after {top: 0.5rem;}
  ul.faq-list > li .answer {padding-right: 6rem;}
}

@media only screen and (max-width: 768px) {
  section.faq .faq-title-row .inner, section.faq .faq-detail-row .inner {padding-left: 3rem; padding-right: 3rem;}
}

@media only screen and (max-width: 600px) {
  section.faq .faq-title-row .inner, section.faq .faq-detail-row .inner {padding-left: 0; padding-right: 0;}
}
/* /FAQ */


/* CAREER */
section.additional-space {}
section.additional-space.with-bg {background: #1A1A1A; padding: 4rem 0;}

.popup-notification {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); }
.popup-notification .inner {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60rem; background: #FFF09A; padding: 4rem 5rem; border-radius: 0.8rem; text-align: center;}
.popup-notification .inner h3 {margin-bottom: 0; font-size: 2.4rem; line-height: 3.2rem; font-family: 'SemiBoldFont', Arial Verdana; position: relative; padding-bottom: 0.8rem;}
.popup-notification .inner h3::after {content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 50%; height: 0.3rem; background: #1A1A1A;}
.popup-notification .inner h3 + p {margin-top: 1.5rem;}
.popup-notification .inner a.close {position: absolute; top: 2rem; right: 2rem; display: inline-block; width: 2rem; height: 2rem; background: url(../images/icon/cross.svg) no-repeat center; background-size: 1.6rem auto; cursor: pointer;}
.popup-notification .inner a.close:hover {transform: scale(1.2);}

.file-upload {border-radius: 0.4rem !important; border: 0.1rem dashed #fff; background: none !important;}
.file-upload > div {border: none !important; background: none !important; margin: 0 !important; padding: 4rem !important;}
.file-upload > div p {color: #fff !important; font-size: 1.5rem !important; line-height: 2.3rem !important;;}
.file-upload > div a, .file-upload > div p a {color: #fff !important; font-size: 1.5rem !important; line-height: 2.0rem !important; display: inline-block; border-bottom: 0.1rem solid #fff;}
.file-upload > div a:hover, .file-upload > div p a:hover {text-decoration: none; color: #FCD600 !important; border-bottom: 0.1rem solid #FCD600;}
.file-container table thead tr th{font-size: 1.4rem !important; line-height: 2.0rem !important; color: #fff !important; font-family: 'BoldFont', Arial, Verdana; vertical-align: middle;}
.file-container table tbody tr td {font-size: 1.3rem !important; line-height: 1.9rem !important; color: #fff !important; font-family: 'GeneralFont', Arial, Verdana; vertical-align: middle;}
.file-container table button.deleteBtn {width: 2.4rem !important; height: 2.4rem !important; background: url(../images/icon/delete.svg) no-repeat center; background-size: 2.2rem auto;}
.label-error {color: red;}

@media only screen and (max-width: 768px) {
  section.additional-space.with-bg {padding: 2rem 0;}
}

@media only screen and (max-width: 600px) {
  .popup-notification .inner {width: 85%; padding: 5rem 2.5rem 4rem 2.5rem;}
  .popup-notification .inner h3 {font-size: 2.0rem; line-height: 2.8rem;}
  .popup-notification .inner p {font-size: 1.4rem; line-height: 2.2rem;}

  .file-container table thead tr th {font-size: 1.3rem !important; line-height: 1.9rem !important;}
  .file-container table thead tr td {font-size: 1.2rem !important; line-height: 1.8rem !important;}
}

@media only screen and (max-width: 500px) {
  .popup-notification .inner h3 {font-size: 1.85rem; line-height: 2.65rem;}
  .popup-notification .inner p {font-size: 1.35rem; line-height: 2.05rem;}
  .popup-notification .inner a.close {top: 1.5rem; right: 1.5rem;}
  .file-container table thead tr th.resp-none, .file-container table tbody tr td.resp-none {display: none !important;}
}
/* /CAREER */


/* CONTACT */
section.contact {}
section.contact .inner {grid-column: 3 / span 7;}
.contact-detail-item {margin-top: 5rem; padding-bottom: 2rem; position: relative;}
.contact-detail-item::after {content: ""; position: absolute; bottom: 0; left: 0; width: 50%; height: 0.05rem; background: #1A1A1A;}
.contact-detail-item.no-und::after {display: none;}
.contact-detail-item:only-child {margin-top: 0;}
.contact-detail-item h4 {margin-bottom: 0;}
.contact-detail-item h5 a {margin-bottom: 0; color: #1A1A1A; font-size: 1.8rem; line-height: 2.6rem;}
.contact-detail-item h5 a:hover {color: #FCD600;}
.contact-detail-item h4 + h5 {margin-top: 1rem;}

ul.contact-location-list {margin-top: 3rem;}
ul.contact-location-list:only-child {margin-top: 0;}
ul.contact-location-list > li {padding-bottom: 5rem; margin-bottom: 5rem; border-bottom: 0.1rem solid #1A1A1A;}
ul.contact-location-list > li:last-child {padding-bottom: 0; margin-bottom: 0; border-bottom: 0;}
ul.contact-location-list > li .gmap-wrap {}
ul.contact-location-list > li .gmap-wrap iframe {width: 100% !important; height: 36rem !important; border-radius: 1.6rem;}
ul.contact-location-list > li .detail-wrap {}
ul.contact-location-list > li .detail-wrap h4 {margin-bottom: 0;}
ul.contact-location-list > li .detail-wrap a {font-family: 'BoldFont', Arial, Verdana; margin-top: 2rem; font-size: 1.8rem; line-height: 2.4rem; display: inline-block; border-bottom: 0.1rem solid #1A1A1A; color: #1A1A1A;}
ul.contact-location-list > li .detail-wrap a:hover {text-decoration: none; color: #FCD600; border-bottom: 0.1rem solid #FCD600;}
ul.contact-location-list > li .gmap-wrap + .detail-wrap {margin-top: 2rem;}

@media only screen and (max-width: 1200px) {
  section.contact .inner {grid-column: 3 / span 8;}
}

@media only screen and (max-width: 1024px) {
  section.contact .inner {grid-column: 2 / span 4;}

  ul.contact-location-list > li .gmap-wrap iframe {height: 34rem !important;}
}

@media only screen and (max-width: 768px) {
  section.contact .inner {grid-column: 1 / -1; padding-left: 6rem; padding-right: 6rem;}
  ul.contact-location-list > li .gmap-wrap iframe {height: 32rem !important;}
}

@media only screen and (max-width: 600px) {
  section.contact .inner {padding-left: 3rem; padding-right: 3rem;}

  .contact-detail-item h4 {font-size: 2.2rem; line-height: 3.0rem;}
  .contact-detail-item h5, .contact-detail-item h5 a {font-size: 1.6rem; line-height: 2.4rem;}

  ul.contact-location-list > li .gmap-wrap iframe {height: 30rem !important;}
  ul.contact-location-list > li .detail-wrap h4 {font-size: 2.0rem; line-height: 2.8rem;}
}

@media only screen and (max-width: 500px) {
  section.contact .inner {padding-left: 0; padding-right: 0;}
  ul.contact-location-list > li .gmap-wrap iframe {height: 28rem !important;}
}
/* /CONTACT */


/* PAGINATION */
section.pagination {}
section + section.pagination {}

ul.pagination-list {}
ul.pagination-list > li {margin-right: 3rem;}
ul.pagination-list > li:last-child {margin-right: 0;}
ul.pagination-list > li > a {font-family: 'SemiBoldFont', Arial, Verdana; font-size: 1.5rem; line-height: 1.5rem; color: #1A1A1A; display: inline-block; padding: 0.9rem 1.25rem; border-radius: 50%;}
ul.pagination-list.white > li > a {color: #fff;}
ul.pagination-list > li > a:hover {background: #FFF09A; text-decoration: none;}
ul.pagination-list > li > a.active, ul.pagination-list > li > a.active:hover {font-family: 'BoldFont', Arial, Verdana; color: #fff; background: #FCD600;}

@media only screen and (max-width: 768px) {
  ul.pagination-list > li {margin-right: 2.5rem;}
  ul.pagination-list > li > a {font-size: 1.6rem; line-height: 1.6rem;}
}

@media only screen and (max-width: 500px) {
  ul.pagination-list > li {margin-right: 2rem;}
  ul.pagination-list > li > a {font-size: 1.5rem; line-height: 1.5rem;}
}
/* /PAGINATION */


/* FOOTER */
footer {}
footer p, footer a, footer p a {font-size: 1.3rem; line-height: 1.8rem;}
footer p.title {margin-bottom: 1rem;}
footer p.item {margin-bottom: 1rem;}
footer p.item:last-child {margin-bottom: 0;}

#footer-top-section {padding-top: 4rem; padding-bottom: 4rem; background: #1A1A1A;}
#footer-logo-col {grid-column: 1 / span 3;}
img#footer-logo {max-height: 6rem; margin-bottom: 4rem;}

#footer-nav-col {grid-column: 5 / span 3;}
ul.footer-nav-list {}
ul.footer-nav-list > li {margin-bottom: 1rem;}
ul.footer-nav-list > li:last-child {margin-bottom: 0;}
ul.footer-nav-list > li > a {font-size: 1.6rem; line-height: 2.4rem; font-family: 'BoldFont', Arial, Verdana; color: #FCD600;}

#footer-office-col {grid-column: 9 / span 4;}
ul.footer-office-list {}
ul.footer-office-list > li {margin-bottom: 1.2rem; padding-bottom: 1.2rem; position: relative;}
ul.footer-office-list > li::after {content: ""; position: absolute; bottom: 0; left: 0; width: 70%; height: 0.05rem; background: #afafaf;}
ul.footer-office-list > li:last-child {margin-bottom: 0; padding-bottom: 0;}
ul.footer-office-list > li:last-child::after {display: none;}
ul.footer-office-list > li h3 {font-size: 1.3rem; line-height: 1.8rem; display: inline-block; border-bottom: 0.1rem solid #fff; text-transform: uppercase; color: #fff; margin-bottom: 0;}
ul.footer-office-list > li p {color: #fff; font-size: 1.2rem; line-height: 1.7rem;}
ul.footer-office-list > li h3 + p {margin-top: 0.2rem;}

#footer-bottom-section {padding-top: 2rem; padding-bottom: 2rem; background: #1A1A1A;}
#footer-top-section + #footer-bottom-section {padding-top: 0;}
ul.footer-socmed-list {}
ul.footer-socmed-list > li {margin-right: 1.5rem;}
ul.footer-socmed-list > li:last-child {margin-right: 0;}
ul.footer-socmed-list > li img {height: 2.4rem; transition: all 0.2s ease-in; cursor: pointer;}
ul.footer-socmed-list > li img:hover {transform: scale(1.1);}
p.copyright {font-size: 1.0rem; line-height: 1.4rem; color: #fff;}
ul.footer-socmed-list + p.copyright {margin-top: 1rem;}

@media only screen and (max-width: 1024px) {
  #footer-logo-col {grid-column: 1 / span 2;}
  #footer-nav-col {grid-column: 3 / span 2;}
  #footer-office-col {grid-column: 5 / span 2;}
}

@media only screen and (max-width: 768px) {
  #footer-nav-col {display: none;}
  #footer-office-col {grid-column: 4 / span 3;}
}

@media only screen and (max-width: 600px) {
  #footer-logo-col {grid-column: 1 / span 2;}
  #footer-nav-col {display: block; grid-column: 3 / span 2; padding-left: 3rem;}
  #footer-office-col {grid-column: 1 / -1; padding-top: 3rem; margin-top: 3rem; border-top: 0.1rem dotted #9f9f9f;}
}

@media only screen and (max-width: 500px) {
  footer p, footer a, footer p a {font-size: 1.4rem; line-height: 2.0rem;}

  #footer-logo-col, #footer-nav-col, #footer-office-col {grid-column: 1 / -1; padding: 0; margin: 0; border: 0; padding-bottom: 2rem; margin-bottom: 2rem; border-bottom: 0.1rem dotted #9f9f9f;}
  #footer-top-section + #footer-bottom-section {margin-top: -2rem;}

  img#footer-logo {max-height: 5.5rem;}
}
/* /FOOTER */


/* additional css */
.numbers-wrapper {
  margin: 5rem 0;
  text-align: center;
}

.cards-container {
  padding-top: 2rem;
}

.number-card {
  border: 3px solid #FCD600;
  padding: 3rem;
  text-align: center;
  height: calc(450 / 16 * 1rem);
  font-size: 1.6rem;

  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.number-card .number {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: .5rem;
}

.title-wrapper {
  position: relative;
  padding: 0rem;
  display: inline-block;
  margin-bottom: 5rem;
}

.title-wrapper h2 {
  display: inline-block;
  font-size: 3rem;
  padding-bottom: 0.5rem;
}

.title-wrapper .custom-underline {
  background-color: #FCD600;
  width: 80%;
  position: absolute;
  bottom: 0%;
  left: 10%;
  height: 3px;
}

.project-item.new {
  background-color: #000;
  color: #fff;
}

.project-item.new .title {
  margin-bottom: 1rem;
}

.project-item.new .title,
.project-item.new .title h3 a {
  color: #fff;
  font-size: 2.5rem;
}

.project-item.new > .img-wrap.new {
  border-radius: 0rem;
  border: 3px solid #FCD600;
  border-bottom: none;
  margin-bottom: 0rem;
  position: relative;
}

.project-item.new > .img-wrap.new > .image-label {
  position: absolute;
  left: 5%;
  bottom: 5%;

  padding: 1rem;
  background-color: #FCD600;
  color: #fff;
  text-transform: uppercase;
}

.project-item.new > .description-wrap {
  padding: 2rem;
}

.news .project-item.new > .description-wrap h3 {
  height: 9rem;
  margin: 0rem;
}

.description-wrap .title {
  justify-content: space-between;
}

.description-wrap .title,
.description-wrap .number-container {
  display: flex;
}

.description-wrap .number-wrapper {
  flex: 1;
}

.description-wrap .number-wrapper .number {
  color: #FCD600;
  font-size: 1.8rem;
}

.flag-wrapper {
  display: flex;
  justify-content: center;
  width: 3rem;
}

.projects-banner-text {
  color: #fff !important;
}

.projects-banner-text.sub {
  font-size: 2.5rem;
}

section.project-detail .project-detail-col {
  grid-column: 1 / span 12;
}

.project-detail .banner-image {
  position: relative;
}

.project-detail .banner-image .title {
  position: absolute;
  top: 0%;
  left: 0%;

  height: 100%;
  width: 100%;
  color: #FFFFFF;
  font-size: 3rem;

  align-items: center;
  display: flex;
  justify-content: center;
}

.project-share-list {
  display: flex;
  gap: 1rem;
  justify-content: center;
}

ul.project-share-list > li a {
  align-items: center;
  color: #000;
  display: flex;
  justify-content: center;
  gap: 1rem;

  padding: 1rem;
  width: 15rem;
  border: 1px solid #000;
}

section.top-image .inner.no-bg.project-details {
  aspect-ratio: 20;
}

.wysiwyg-content {
  padding: 2rem 0;
}

.wysiwyg-content p {
  font-size: 1.6rem;
  text-align: justify;
  padding: 1rem 0;
}

.wysiwyg-content iframe {
  aspect-ratio: 560 / 315;
  height: 100%;
  width: 100%;

  padding: 2rem 0;
}

.card-icon-wrapper {
  margin-bottom: 2rem;
  width: calc(200 / 16 * 1rem);
}

@media only screen and (max-width: 576px) {
  section.project-detail .cards-container .grid.col-12 {grid-template-columns: unset; row-gap: 1.5rem;}
  section.project-detail .cards-container .project-detail-col {grid-column: unset; padding-right: 0rem;}

  /* .number-card {
    height: calc(900 / 16 * 1rem);
  } */

  ul.project-share-list {
    flex-direction: column;
  }

  ul.project-share-list li {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
  }
}


/* ADDITIONAL CSS 2 */
ul.project-card-list {margin-bottom: -3rem;}
ul.project-card-list > li {width: 22%; margin-right: 4%; margin-bottom: 3rem; background: none; padding-left: 0;}
ul.project-card-list > li:nth-child(4n), ul.project-card-list > li:last-child {margin-right: 0;}

@media only screen and (max-width: 900px) {
  .row.project-card-row {margin: 0 auto; width: 90%;}
  ul.project-card-list > li {width: 48%;}
  ul.project-card-list > li:nth-child(4n) {margin-right: 4%;}
  ul.project-card-list > li:nth-child(2n) {margin-right: 0;}
}

@media only screen and (max-width: 576px) {
  .row.project-card-row {width: 320px;}
  ul.project-card-list > li {width: 100%; margin-right: 0 !important;}
}

@media only screen and (max-width: 420px) {
  .row.project-card-row {width: 90%;}
}
/* /ADDITIONAL CSS 2 */

/* News */
.project-item > .description-wrap p:not(.project-date),
.news-summary p {
  height: 6rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.news-head-wrapper {
  align-items: center;
  display: flex;
  gap: 3rem;
  flex-direction: column;
  justify-content: center;
  margin-top: 5rem;
}

.news-head-wrapper .title {
  font-size: 3rem;
}