/* strategies */
#strategies img.cover {z-index:9;position:relative;width:100%;height:auto;border-radius:17px;}
#strategies .video {width:100%;position:relative;z-index:9;padding-top:60px;}
#strategies .video a {display:block;position:relative;width:100%;aspect-ratio:371 / 208; background-color: #eee;overflow:hidden;border-radius:15px}
#strategies .video img.img-border {width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0;}
#strategies .video .img-border {border-radius:15px;}
#strategies .video .overlay-img {position:absolute;top:0;left:0;width:100%;height:100%;border-radius:15px;background: linear-gradient(to right, rgba(0, 0, 0, 0.6), transparent);-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#strategies .video .position-watch {width:100%;height:100%;position:absolute;top:0;left:0;padding:0 0 60px 60px;z-index:10;z-index: 10;display:-webkit-box;display:-ms-flexbox;display:flex;flex-direction: column;-webkit-box-pack:flex-end;-ms-flex-pack:flex-end;justify-content:flex-end;box-sizing: border-box;}
#strategies .video h2 {font-size:25px;color:#fff;margin-bottom:15px;font-family:'promptmedium'}
#strategies .video p {color:#fff;}
#strategies .video .watch {width:115px;height:48px;border:1px solid #fff;border-radius:7px;margin-top:35px;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-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#strategies .video .watch img {max-width:100%;width:22px;height:30px;}
#strategies .video .watch span {color:#fff;margin-left:7px;}
#strategies .video a:hover .overlay-img {box-shadow:inset 0 0 0 5px #B39630;border-radius:15px;}
#strategies .video a:hover .watch {border:3px solid #B39630;border-radius:7px;}
#strategies .position-watch video {width:100%;height:auto;display:block;}

/* report */
#reports .navigation-wrapper {display:flex;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:60px;max-width:1400px;width:90%;margin-left:auto;margin-right:auto;z-index:9;position:relative;}
#reports button.prev-year, #reports button.next-year {width:31px;height:31px;border-radius:100%;border:1px solid #B9B9B9;background:none;outline:none;padding:0;-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#reports button.prev-year:hover, #reports button.next-year:hover {border:1px solid #B29530;background:#B29530;-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#reports button.prev-year:hover img, #reports button.next-year:hover img {filter: brightness(0)invert(1);}
#reports-carousel.owl-carousel img {width:auto!important;max-width:100%;}
#reports-carousel.owl-carousel img.cover {max-width:100%;height:auto;margin-left:auto;margin-right:auto;border-radius:8px;-webkit-box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.20);box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.20);background-clip: padding-box;}
#reports-carousel {margin-top:35px;z-index:9;position:relative;}
#reports-carousel .flex {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
#reports-carousel .reports-download {width:28%;border:3px solid transparent;background:#fff;border-radius:5px;margin:30px 0 9px 0;position:relative;z-index:9;-webkit-box-shadow:0px 3px 6px rgba(0, 0, 0, 0.16);box-shadow:0px 3px 6px rgba(0, 0, 0, 0.16);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#reports-carousel .reports-download + .reports-download {margin-left:30px;}
#reports-carousel .reports-download a {width:100%;color:#555;padding:15px 20px;z-index:9;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;}
#reports-carousel .icon {width:45px;height:45px;border:1px solid #B29530;border-radius:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#reports-carousel .click {margin-left:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align: center;-ms-flex-align:center;align-items:center;}
#reports-carousel .reports-download a:hover {color: #B29530;}
#reports-carousel .reports-download a:hover .icon {background: #B29530;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#reports-carousel .reports-download a:hover .icon img {filter:brightness(0) invert(1);}
#reports-carousel .reports-download:hover {border-radius:5px;border:3px solid #B29530;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#year-carousel .item {text-align:center;padding:10px 0;color:#999;cursor:pointer;font-size:18px;-webkit-transition: color 0.4s ease;-moz-transition: color 0.4s ease;-o-transition: color 0.4s ease;-ms-transition: color 0.4s ease;transition: color 0.4s ease;}
#year-carousel .owl-item.current .item {color:#b59d5f!important;border-bottom:3px solid #b59d5f;}


/* corporate governance */
#corporate-governance {position:relative;}
#corporate-governance.bg {background: url('../images/sustainability/bg-corporate-governance.webp'),linear-gradient(140deg, rgba(245, 251, 243, 1) 0%, rgba(245, 251, 243, 1) 61%, rgba(254, 242, 224, 1) 100%);background-size: 100%;background-position: center 100px;background-repeat: no-repeat;}
#corporate-governance .chairman {width:55%;margin-top:85px;z-index:9;}
#corporate-governance p.text-chairman {font-size:20px;line-height:40px;}
#corporate-governance .quote-top {margin-left:-50px;top:-9px;position:absolute;}
#corporate-governance .quote-bottom {margin-left:20px;bottom:-5px;position:absolute;}
#corporate-governance .signature {margin-top:50px;}
#corporate-governance .name {font-size:20px;color:#055D0F;font-family:'promptmedium';margin-bottom:8px;}
#corporate-governance .chairman-position {font-size:20px;font-family:'promptmedium';}
#corporate-governance .mobile-img {display:none;}
#corporate-governance .position-row {position:relative;}
#corporate-governance .video {width:100%;position:relative;z-index:9;padding-top:280px;}
#corporate-governance .video h2 {font-size:25px;color:#fff;margin-bottom:15px;}
#corporate-governance .video p {color:#fff;}
#corporate-governance .video .overlay-img {position:absolute;top:0;left:0;width:100%;height:100%;border-radius:15px;background: linear-gradient(to right, rgba(0, 0, 0, 0.6), transparent);-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#corporate-governance .video a {display:block;position:relative;width:100%;aspect-ratio:371 / 208; background-color: #eee;overflow:hidden;border-radius:15px}
#corporate-governance .video .position-watch {position:absolute;bottom:0;padding: 0 0 60px 60px}
#corporate-governance .video .watch {width:115px;height:48px;border:1px solid #fff;border-radius:7px;margin-top:35px;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-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#corporate-governance .video .watch img {max-width:100%;width:22px;height:30px;}
#corporate-governance .video .watch span {color:#fff;margin-left:7px;}
#corporate-governance .video .img-border {border-radius:15px;}
#corporate-governance .video img.img-border {width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0;}
#corporate-governance .video a:hover .watch {border:3px solid #B39630;border-radius:7px;}
#corporate-governance .video a:hover .overlay-img {box-shadow: inset 0 0 0 5px #B39630;border-radius:15px;}

/* structure-charter */
#structure-charter .structure-charter-download {border: 3px solid transparent;background:#fff;border-radius:5px;margin-top: 60px;position:relative;z-index:9;display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#structure-charter .icon {width:64px;height:64px;border:1px solid #B29530;border-radius:100%;display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-pack: center; -ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#structure-charter .icon img {width:auto;height:auto}
#structure-charter .click {margin-left:20px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
#structure-charter .structure-charter-download a {width:100%;color:#555;padding:15px 20px;z-index:9;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
#structure-charter .structure-charter-download a:hover {color:#B29530}
#structure-charter .structure-charter-download:hover {border-radius:5px;border:3px solid #B29530;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#structure-charter .download {margin-left:auto;}
#structure-charter .download img {width:auto;height:auto}
#structure-charter a:hover .icon {background:#B29530;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#structure-charter a:hover .icon img {filter: brightness(0) invert(1);}
#structure-charter img.director {width:100%;height:auto;}

/* code of conduct */
#conduct .box {border-radius:5px;position:relative;z-index:9;min-height:217px;margin:38px 0 45px 0;background-color: rgba(255, 255, 255, 0.5);border: 3px solid transparent;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#conduct a {color:#555}
#conduct .circle {width:74px;height:74px;background:#ffffffb0;border-radius:100%;border:1px solid #B29530;top: 50%;left: 50%;transform: translate(-50%, -50%);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-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);}
#conduct .circle img {width:35px;height:26px;}
#conduct .position {position:relative;}
#conduct .col-download {width:100%;top: 50%;left: 50%;transform: translate(-50%, -50%);position:absolute;text-align: center;margin-top: 30px;padding: 0 15px 15px 15px;}
#conduct .text {min-height: 50px;margin-bottom: 25px;}
#conduct .icon img {width:26px;height:27px;}
#conduct a:hover .box {border: 3px solid #B29530;}
#conduct a:hover .circle {background:#B29530;-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#conduct a:hover .circle img {filter: brightness(0) invert(1);}

/* whistle blowing channel */
.banner-whistle {border-radius:11px;margin-bottom:25px}
img.banner-whistle {width:100%;height:auto}
#whistle-blowing .flex {margin-top:60px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
#whistle-blowing .col-icon {width:12.66%;z-index: 9;flex-wrap: wrap;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
#whistle-blowing .shape-icon {width: 120px;height: 120px;background: #fff;border-radius: 100%;margin: 0 auto 15px;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-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.04);box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.04);border: 5px solid transparent;-webkit-transition: border-color 0.4s ease-in-out;-moz-transition: border-color 0.4s ease-in-out;transition: border-color 0.4s ease-in-out;}
#whistle-blowing .col-icon a {color:#555;}
#whistle-blowing .col-icon a h3, #whistle-blowing .col-icon .pointer h3 {font-size:18px;font-family:'promptmedium';-webkit-transition: all .4s ease-in-out;-moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-ms-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
#whistle-blowing .col-icon .pointer {cursor:pointer}
#whistle-blowing .shape-icon img {max-width:100%;height:auto}
#whistle-blowing a:hover .shape-icon, #whistle-blowing .pointer:hover .shape-icon {border:5px solid #B29530;}
#whistle-blowing a:hover h3, #whistle-blowing .pointer:hover h3  {color:#B29530;}
#whistle-blowing p.height-text {font-size:16px;}
#whistle-blowing br.complaint {display:none}
#whistle-blowing br.head-office {display:none}

@media only screen and (max-width:1600px) {
#corporate-governance .video {padding-top:120px;}
#corporate-governance .chairman {margin-top:60px;}
#whistle-blowing br.head-office {display:block}
}

@media only screen and (max-width:1536px) {
#corporate-governance .video {padding-top:100px;}
#corporate-governance p.text-chairman, #corporate-governance .name, #corporate-governance .chairman-position {font-size:18px}
}

@media only screen and (max-width:1440px) {

#corporate-governance p.text-chairman {line-height:35px;}
}

@media only screen and (max-width:1366px) {
#strategies .video .watch img {width:16px;height:24px;}
#reports-carousel .reports-download a {padding:10px 20px;}
#reports-carousel .icon {width:40px;height:40px;} 
#reports-carousel .icon img.download {width:17px!important;height:auto;}
#reports-carousel .icon img.book {width:19px!important;height:auto;}
#corporate-governance .video {padding-top:85px;}
#corporate-governance .chairman {margin-left:50px}
#corporate-governance .video .watch img {width:16px;height:24px;}
#structure-charter .icon {width:45px;height:45px}
#structure-charter .icon img {width:25px;}
#structure-charter .structure-charter-download a {padding:10px 20px;}
#structure-charter .download img {width:20px;}
#conduct .circle {width:65px;height:65px;}
#conduct .circle img {width:30px;height:auto}
#conduct .icon img {width:22px;}
#whistle-blowing .shape-icon {width:110px;height:110px}
#whistle-blowing .shape-icon img {width:50px;}
#whistle-blowing .shape-icon img.icon {width:40px}
}

@media only screen and (max-width:1280px) {
#corporate-governance p.text-chairman, #corporate-governance .name, #corporate-governance .chairman-position {font-size:16px;}
#corporate-governance p.text-chairman {line-height:30px}
#about-message .box {min-height:430px}
}

@media only screen and (max-width:1080px) {
#reports-carousel .reports-download {width:40%;}
#corporate-governance .chairman {margin-top:15px;margin-left:30px;}
#conduct .text {min-height: 65px;}
#whistle-blowing .col-icon {width: 20.66%;margin-top:40px;}
#whistle-blowing .flex {margin-top:40px;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: center; -ms-flex-pack: center;justify-content: center;}
#whistle-blowing .col-icon {width: 24.66%;}
}

@media only screen and (max-width:1024px) {
#strategies .video .position-watch {padding:40px 40px;}
#strategies .video h2 {font-size:22px;}
#corporate-governance .chairman {width:50%;margin-left:15px;}
#corporate-governance img.quote-top, #corporate-governance img.quote-bottom {width:20px;height:17px;}
#corporate-governance .quote-top {margin-left:-35px;}
#corporate-governance .quote-bottom {margin-left:15px;}
#corporate-governance .video .position-watch {padding:40px 40px;}
#corporate-governance .video h2 {font-size:22px;}
}

@media only screen and (max-width:980px) {
#reports .navigation-wrapper {gap:unset;}
}

@media only screen and (max-width:820px) {
#strategies .video .position-watch {padding: 30px 30px;}
#strategies .video .watch {width:109px;height:42px}
#strategies .video .watch img {width:13px;height:21px;}
#corporate-governance.bg {background: #F5FBF3;background: linear-gradient(140deg, rgba(245, 251, 243, 1) 0%, rgba(245, 251, 243, 1) 61%, rgba(254, 242, 224, 1) 100%);}
#corporate-governance .chairman {width:100%;}
#corporate-governance .mobile-img {display:block;}
#corporate-governance img.mobile-img {height:auto;-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);}
#corporate-governance .position-row {width:100%;margin-left:auto;margin-right:auto;}
#corporate-governance .signature {margin:40px 0 0 0}
#corporate-governance .video {padding-top:60px;}
#corporate-governance p.text-chairman {line-height:30px;}
#corporate-governance .breadcrumb-menu {right:0;top:85px;position: absolute;}
#corporate-governance .video .position-watch {padding: 30px 30px;}
#corporate-governance .video .watch {width:109px;height:42px}
#corporate-governance .video .watch img {width:13px;height:21px;}
#corporate-governance .head-box {margin-top:35px}
#structure-charter .click {margin: 25px 0;text-align: center;}
#structure-charter .icon {margin-left:auto;margin-right:auto}
#structure-charter .structure-charter-download a {display:block;padding:20px}
#structure-charter .download img {width:auto;margin-left:auto;margin-right:auto;display:block}
#whistle-blowing br.content-whistle {display:none}
}

@media only screen and (max-width:768px) {
#reports-carousel .reports-download {width:48%;}
#reports-carousel .reports-download + .reports-download {margin-left:15px;}
#reports-carousel .reports-download a {padding:10px 15px;}
#reports-carousel .click {margin-left:10px;}
}

@media only screen and (max-width:736px) {
#corporate-governance .chairman {width:95%;margin-left:auto;margin-right:auto;}
}

@media only screen and (max-width:640px) {
#strategies .video h2 {font-size:18px;}
#strategies .video p, #strategies .video .watch span {font-size:14px}
#corporate-governance .video h2 {font-size:18px;}
#corporate-governance .video p, #corporate-governance .video .watch span {font-size:14px}
#whistle-blowing .col-icon {width:32.66%;}
#whistle-blowing .flex {margin-top: 20px;}
}

@media only screen and (max-width:568px) {
#corporate-governance .chairman {width:90%;}
}

@media only screen and (max-width:480px) {
#strategies .video .position-watch {padding:20px 20px;}
#strategies .video .watch {margin-top:20px;width:105px;height:38px;}
#strategies .position-watch .text p {display:none;}
#strategies .video h2 {font-size:16px;}
#reports-carousel .reports-download {width:100%;}
#reports-carousel .flex {display:block;}
#reports-carousel .reports-download + .reports-download {margin-left:0;margin-top:8px;}
#year-carousel .owl-item.current .item {width:80%;margin:0 auto;}
#corporate-governance .video .position-watch {padding:20px 20px;}
#corporate-governance .video .watch {margin-top:20px;width:105px;height:38px;}
#corporate-governance .position-watch .text p {display:none;}
#strategies .video h2 {font-size:16px;}
#whistle-blowing .col-icon {width: 49.66%;}
}

@media only screen and (max-width:430px) {
#strategies .video .watch img {width:10px;height:18px;}
#corporate-governance .quote-top {margin-left:-28px;}
#corporate-governance .quote-bottom {margin-left:10px;}
#corporate-governance .video .watch img {width:10px;height:18px;}
}