/* Banner */
.banner { position: relative; width: 100%; margin: auto; padding-top: 7%;padding-bottom:7%;}
.banner .wrapper { position: relative; height: 550px; z-index: 1; }
.banner .overlay-text { width: 45vw; overflow: hidden; display: flex; align-items: center; position: absolute; top: 0; bottom: 0; left: 0; margin: auto; z-index: 3; }
.banner .overlay-text h1{ font-size:50px !important }
.banner .overlay-img { position: absolute; top: 0; bottom: 0; right: 0; width: 55vw; background-repeat: no-repeat; background-size: cover; background-position: right;}
.banner .sub-pages-spur{width: 15%;height:960px; width:260px; position: absolute; top: -5%; bottom: 0; left: -7.0%;background-image: url(../image/sub-page-full-spur.png);  background-repeat: no-repeat; background-size: cover;  z-index: 10; }
.banner .overlay-text .text-wrapper { padding: 5rem 5rem 5rem 12vw; width: 47vw; }
.banner .overlay-text .sub-heading { font-size: 22px; }

.mid article h3 {font-size: 30px; font-weight: 700;}
.mid .red-divider{height:1px;border-top:1px solid #da2128;width:100%;margin-top: 1.5vh; margin-bottom: 1.5vh;}

/*Sub Pages Box */
.sub-page-wrap{width: 85vw;max-width: 1440px; margin: auto;}
.mid .sub-pages-box-wrapper{display: flex; flex-direction: row; justify-content: space-between;}
.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 270px;width:660px;position:relative;background-color:#FFF5E9;opacity:0.9;clip-path: polygon(100% 0, 100% 90%, 95% 100%, 0 100%, 0 0); padding:3%;}
.mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 270px;width:660px;position:relative;background-color:#FFF5E9;opacity:0.9;clip-path: polygon(100% 0, 100% 90%, 95% 100%, 0 100%, 0 0); padding:3%;}

/* Sub Page Image */

.image-wrapper {display: block;}
.image-wrapper-mobile {display: none;}
.image-wrapper img { width: 55%; }
.image-wrapper img.w-auto { width: auto; max-width: 55%; }


/* Current image sizing and placement */
.banner .overlay-img { position: absolute; top: 0; bottom: 0; right: 0; width: 55vw; background-repeat: no-repeat; background-size: cover; background-position: right;}
.banner .image-positioning{position:absolute;top:50%;right:0;transform:translateY(-50%);background-repeat:no-repeat;background-size:contain;}
.banner .image-positioning-chairman {display: block;}
.banner .chairman-sub-mob-banner{display: none;}
.banner .image-positioning-chairman{position:absolute;top:54%;right:calc(100% - 85%);transform:translateY(-50%);background-repeat:no-repeat;background-size:contain;}
/* .banner .image-positioning-chairman{position:absolute;top:55%;right:calc(100% - 85%);transform:translateY(-50%);background-repeat:no-repeat;background-size:contain;} */

/* Sub Page Spur */
.mobile-text-spur{display: none ;}
.vision-footnote-mob-hide{ display: none;}



.mid .sub-pages-box-wrapper .left-box-wadt{margin-right:1.5rem;}
.mid .sub-pages-box-wrapper .left-box-ctd{margin-right:1.5rem;}
.mid .sub-pages-box-wrapper .left-box-wadt .red-header,.mid .sub-pages-box-wrapper .right-box-wadt .red-header{margin-bottom: 0;}
.mid .sub-pages-box-wrapper .left-box-ctd .red-header,.mid .sub-pages-box-wrapper .right-box-ctd .red-header{margin-bottom: 0;}
.mid .sub-pages-box-wrapper .right-box-wadt{margin-left: 1.5rem;}
.mid .sub-pages-box-wrapper .right-box-ctd{margin-left: 1.5rem;}
.mid .sub-pages-black-list{list-style: none;}
.mid .sub-pages-black-list ul li{padding-bottom: 0;}

.mid .sub-pages-red-list{list-style: none;}
/* .mid .sub-pages-red-list ul li{padding-bottom: 0;} */

.mid sup:hover {color: #da2128; text-decoration: underline;cursor: pointer;}
.mid img{width: 100%;}

/* Sub Pages Sticky Tab */
/* .tab-section{position:sticky;top:78px;margin:0 auto;z-index:7} */
.tab-section{position:sticky;top:83.8px;max-width:1440px;margin:0 auto;z-index:6;box-sizing: border-box;background-color: white;}

.tab-buttons{display:flex;align-items:start;margin-bottom:20px; padding: 16px 88px 16px 0px; justify-content: space-evenly;}
.tab-button{border:none;cursor:pointer;font-size:17px;text-align:center;transition:all 0.3s ease; color: #cfcfcf;}
/* .tab-button:not(:first-child){padding-left:5vw;} */
.tab-button:hover{color:#000000;}
.tab-button.active{color: #000000;font-weight:bold;}
.tab-content .tab-item{display:none;}
.tab-content .tab-item.active{display:block;}
.tab-content h2{font-size:24px;margin-bottom:10px;}
.tab-section .arrow-container{display:none;}
.tab-buttons.tabs-hidden .tab-button.hidden{display:none;}
.tab-buttons.tabs-hidden .tab-item.hidden{display:none;}



/* .mid{counter-reset:footnotes;}
.mid .black-footnote{ font-size:14px !important; line-height: 140%;}
.mid .black-footnote:before{content:counter(footnotes);counter-increment:footnotes;color:#000000;margin-right:10px; display: inline-block; width: 1.5em;} */
.mid .black-footnote{ font-size:14px !important; line-height: 140%;}


/* ----- */

/* Heading */
.no-bnr-heading .ttl { font-size: 56px; font-weight: 900; padding: 100px 0; line-height: 120%; }
/* ----- */

/* Sub Page Additional Contents */

/* Vision 2030 in Action */

.sub-page-vision-2030-in-action{display: block;}
.sub-page-visio-2030-in-action-mobile{display: none;}
.sub-page-vision-2030-in-action{height: 200vh;}
.sub-page-vision-2030-in-action .two-column-wrapper{position: relative; margin: auto;display:flex;flex-direction:column;height:150vh;}
.sub-page-vision-2030-in-action .upper-column-wrapper{width:100%;height:50%;background-image: url(../image/public-data/vision-2030-in-action/windmill.jpg);background-repeat: no-repeat; background-size: cover;background-position: top;}
.sub-page-vision-2030-in-action .bottom-column-wrapper{width:100%;height:50%;background: #FFFFFF;}
.sub-page-vision-2030-in-action .focus-area-white-box{position: absolute; top: 75%; left: 50%; transform: translate(-50%, -50%); width: 90%;height:100%;background-color: white;}
/* .sub-page-vision-2030-in-action .focus-area-white-box{position: absolute; top: 75%; left: 50%; transform: translate(-50%, -50%); width: 90%;max-width: 1680px; min-height:75%;background: rgb(110, 66, 66);} */


/* Sustainability Framework */
.vertical-box-polygon{clip-path: polygon(100% 0, 100% 95%, 90% 100%, 0 100%, 0 0);}
.horizontal-box-polygon{clip-path: polygon(100% 0, 100% 90%, 95% 100%, 0 100%, 0 0);}
.maxh-136{max-height: 136px;}

/* Financial report page */
.download-financial-report-button-wrapper{display: flex;flex-direction: row;}
.download-financial-report-button-wrapper .circle-download-btn{background-image:url(../image/icon-download-pdf-hover.svg);width:41px;height:41px;margin-left: 10px;}
.download-financial-report-button-wrapper .circle-download-btn:hover{cursor:pointer;background-image:url(../image/icon-download-pdf.svg);width:41px;height:41px;}
.pdf-link-wrapper{display: flex;flex-direction: column;align-items: center;}
.pdf-link-wrapper a{display:block; margin-bottom: 10px; width: 100%;}

/* .banner  .pdf-text-wrapper { padding: 5rem 5rem 5rem 5rem; width: 47vw; }
.banner .overlay-text-sub { width: 45vw; overflow: hidden; display: flex; align-items: center; position: absolute; top: 0; bottom: 0; left: 0; margin: auto; z-index: 3; } */


/* Download pages */
.dl-h { border-bottom: 2px solid #565657; padding: 10px 0; font-weight: 900; }
p.dl-pg { border-bottom: 2px solid #565657; margin: 0; }
p.dl-pg a { color: #565657; text-decoration: none; display: block; padding: 10px 50px 10px 0; background-image: url('../image/icon-pdf-download.png'); transition: all 0.25s; background-position: right center; background-repeat: no-repeat; background-size: 28px auto; }
p.dl-pg a:hover { color: #da2128; }
/* ----- */

.sticky-wrapper { position: relative;transition: all 0.3s; }
.sticky-share { height: 300px; position: fixed; top: 15px; right: 5vw; opacity: 0; visibility: hidden; transition: all 0.3s; z-index: 2; }
.sticky-share.active { opacity: 1; visibility: visible; }
.sticky-share ul { list-style: none; padding: 0; width: 40px; }
.sticky-share ul li { width: 40px; height: 40px; transition: all 0.3s; }
.sticky-share ul li:hover { opacity: 0.5; }
.sticky-share ul li a { display: block; width: 40px; height: 40px; }
.sticky-share ul .icon-tw { background: url(../image/social-share-icons_black.png) no-repeat; background-position: 0 0px; background-size: 240px; }
.sticky-share ul .icon-fb { background: url(../image/social-share-icons_black.png) no-repeat; background-position: -52px 0px; background-size: 240px; }
.sticky-share ul .icon-li { background: url(../image/social-share-icons_black.png) no-repeat; background-position: -100px 0px; background-size: 240px; }
.sticky-share ul .icon-wa { background: url(../image/social-share-icons_black.png) no-repeat; background-position: -195px 0px; background-size: 240px; }
.sticky-share ul .icon-wc { background: url(../image/social-share-icons_black.png) no-repeat; background-position: -145px 0px; background-size: 240px; }
.sticky-share .wechat-qr { text-align: center; }
.sticky-share img.qr-img { max-width: 240px !important; width: 100%; }
.sticky-share .wechat-heading { text-align: left; }
.sticky-share .wechat-qr-instructions { text-align: left; }


.page-wrap .arrows:before { content: ''; display: block; width: 34px; height: 25px; background-image: url(../image/icon-arrows.png); background-repeat: no-repeat; background-size: contain; margin-bottom: 0.9rem; }

.question { display: flex; color: #000000; font-weight: 700; padding: 1rem 0; }
.question:before { content: 'Q'; font-weight: 700; color:#000000; margin-right: 1.5rem; }
.answer { display: flex; padding: 1rem 1.5rem 0 0; }
.answer:before { content: 'A'; font-weight: 700; margin-right: 1.5rem; }
.answer-without-number { display: flex; padding: 1rem 1.5rem 0 1rem; }
.sub-page-image-padding{padding: 1rem 1.5rem 0 2.4rem; }
.answer-without-number:before { content: ' '; font-weight: 700; margin-right: 1.5rem; }
.sub-page-text-bg{background-color: #F3F4F4; padding: 1rem; line-height: 158%;}

.spur-message{position:relative;}
.left-small-spur{position:absolute;top:0;left:0;}
.right-small-spur{position:absolute;bottom:0;right: 0;}

  
.spur-message{display: flex; padding: 1rem 1.5rem 0 3rem;}
.ceo-spur-message{display: flex; padding: 1rem 0.5rem 0 1.5rem;}
.chairman-spur-message{display: flex;}
.spur-message:before{ content:'';margin-right: 1.5rem;}

.note { font-style: italic; }

/*operating and marketing review*/
.overlay-text.operating-and-market {background-color: #0088c7;}
.overlay-red-triangle.operating-and-market{background-color: #0088c7;}
.operating-and-market-read-more{ height:215px;}
@media screen and (max-width: 575px) {
.operating-and-market-read-more {height: 325px;}
}


.round-bullet-wrapper { display: flex; align-items: flex-start; }
.round-bullet-wrapper .bullet { width: 34px; min-width: 34px; height: 34px; margin-right: 1rem ; border-radius: 50%; border: 1px solid #f7941d; background-color: #f7941d; color:#fff; text-align: center; display: flex; justify-content: center; align-items: center; }
.round-bullet-wrapper .bullet span { font-size: 24px; font-weight: 900; }
.round-bullet-wrapper .bullet-cnt { font-size: 24px; color: #f7941d; font-weight: 900; padding-top: 3px; }

.highlights-bullet-cnt-wrapper { display: flex; align-items: center; }
.highlights-bullet-cnt-wrapper .highlights-bullet-wrapper .bullet { position: relative; width: 170px; height: 170px; border-radius: 50%; border: 3px solid #da2128; background-color: #d1d3d4; color:#da2128; text-align: center; margin-right: 1.5rem; }
.highlights-bullet-cnt-wrapper .bullet span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-weight: 900; font-size: 20px; }
.highlights-bullet-cnt-wrapper ul li:last-child { padding: 0; }

/*sustainability styles*/
.green-header { display: block; background-color: #00ab4e; color: #ffffff; font-weight: 700; padding: 1rem 1.5rem;}
.light-green-header {display: block; background-color: #60be7b; color: #ffffff; font-weight: 700; padding: 1rem 1.5rem;}
.modal-gray-bg{background-color:#fafafa;}
.blue-header{ display: block; background-color: #0089c8; color: #ffffff; font-weight: 700; padding: 1rem 1.5rem;}


/*Vision 2030 collaboration styles*/
.collab-onekep-teams-red { display: block; background-color: #da2128; color: #ffffff; font-weight: 700; padding: 1rem 1.5rem; text-align:center;}
.collab-onekep-teams-red h4{
	color: #ffffff;}
.collab-onekep-teams-gray { display: block; background-color: #bcbec0; color: #ffffff; font-weight: 700; padding: 1rem 1.5rem; text-align:center;}
.collab-onekep-teams-gray h4{ color: #da2128;}
.collab-onekep-teams-gray h4:before{ color: #da2128;content:url(../image/public-data/vision-2030/key-objectives-target-a.png);vertical-align:-135%;}
.collab-col {position: relative;min-height: 1px;padding-right: 10px;padding-left: 10px;}
.collab-col {width: 20%;float: left; flex: 0 0 18.6667%;}
.collab-onekep-teams-beige{display: block; background-color: #fff1e2; color: #000000; font-weight: 900; padding: 1rem 1.5rem; text-align:center; border-top-width: 1px; border: solid #f7941d 2px;border-right: 0px solid transparent;
border-left: 0px solid transparent;
}
.collab-red-divider{border-bottom: 1px solid #da2128;}

/*Vision 2030 information and innovation*/
.vision-tech-ul ul{list-style: none;position:relative;}
.vision-tech-ul ul li span {margin-right: 10px;border-radius: 50%;border: 1px #da2128;padding: 0px 10px;margin-right: 10px;background: #da2128;z-index: 2;position: relative;}
.vision-tech-ul ul span {margin-right: 10px;border-radius: 50%;border: 1px #da2128;padding: 0px 10px;margin-right: 10px;background: #da2128;z-index: 2;position: relative;	}
.verticalLine {position: absolute;height: 78%;width: 1px;border-left: 1px solid black;left: 9px;top: 3.5px;}
.vision-prev a{position:absolute;left:0;}
.vision-prev a h5:hover {color: #575756 !important;}
.vision-prev a::before {content: '';background: url('../image/icon-prev.png') no-repeat;background-size: contain;background-position: center right;width: 60px;height: 56px;display: block;position: absolute;left: -30px;top: 40%;transform: translateY(-50%);}
.vision-prev a:hover::before { content: ''; background: url('../image/icon-prev-gray.png') no-repeat; background-size: contain; background-position: center right; width: 60px; height: 56px; display: block; position: absolute; left: -30px; top: 40%; transform: translateY(-50%);}
.vision-next a{	position:absolute; right:0;}
.vision-next a h5:hover {color: #575756 !important;}
.vision-next a::after { content: ''; background: url('../image/icon-next.png') no-repeat; background-size: contain; background-position: center right; width: 60px; height: 56px; display: block; position: absolute; right: -30px; top: 40%; transform: translateY(-50%);}
.vision-next a:hover::after { content: ''; background: url('../image/icon-next-gray.png') no-repeat; background-size: contain; background-position: center right; width: 60px; height: 56px; display: block; position: absolute; right: -30px; top: 40%; transform: translateY(-50%);}

/* Content navi */
.page-nav { width: 100%; overflow: hidden; visibility: visible; opacity: 1; transition: all 0.3s; }
.page-nav.hidden { visibility: hidden; opacity: 0; }
.page-nav a.lft-nav { position: fixed; top: 50%; left: 4vw; transform: translateY(-50%); }
.page-nav a.rgt-nav { position: fixed; top: 50%; right: 4vw; transform: translateY(-50%); }
.page-nav a img { width: 40px; }
.page-nav a .text-wrap { position: absolute; width: 290px; min-height: 60px; top: 50%; transform: translateY(-50%); right: -100vw; color: #FFFFFF; font-size: 14px; line-height: 130%; padding: 10px; background: #dd0a2a; display: flex;	align-items: center; justify-content: center; transition: 0.5s; }
.page-nav a:hover .text-wrap { right: 0; }
.page-nav a.lft-nav .text-wrap { left: -100vw; right: unset; }
.page-nav a.lft-nav:hover .text-wrap { left: 0; right: unset; }
.page-nav a.lft-nav .text-wrap .nav-item { display: flex; }
.page-nav a.lft-nav .text-wrap .nav-item:before { content: 'Prev:'; padding-right: 5px; align-self: flex-start; }
.page-nav a.rgt-nav .text-wrap .nav-item:before { content: 'Next:'; padding-right: 5px; align-self: flex-start; }


/* Chart */
.chart-pink{background-color: rgb(229, 111, 85)}
.chart-grey{background-color: rgb(109, 110, 113)}
.chart-light-grey{background-color: rgb(147, 149, 152)}
.chart-orange{background-color: rgb(247, 148, 29)}
.chart-light-orange{background-color: rgb(253, 198, 137)}

#social-investment-spending {width: 65%; margin: auto; }
.legend .legend-color { width: 17px; height: 17px; border-radius: 50%; display: inline-block !important;  position: absolute; left: 0; top: calc(0.5rem + 2px); }
.legend .legend-lbl { position: relative; padding: 0 0 0 25px; }
.legend .ln { border-bottom: solid 1px #ccc; width: 100%; }
/* ----- */

/* Operating Market Review Box */
.img-cnt-box { display: flex; }
.img-cnt-box img { width: 360px; }
.img-cnt-box .cnt-wrapper-subpage { width: 100%; display: flex;flex-direction: column; }
.img-cnt-box .cnt { padding: 1rem 3rem; align-items: center;}
/* ----- */

@media screen and (max-width:2560px) and (min-height: 1480px){
	/* .sub-page-wrap{max-width: 1920px; margin: auto;} */
	.banner .overlay-text .text-wrapper { padding: 5rem 5rem 5rem 10.2vw;}
	/* .banner .sub-pages-spur{height:110vh; width: 20%; top: -17%; bottom: 0; left: -9%;} */

	.mid .sub-pages-box-wrapper{justify-content: unset;}

	.sub-page-vision-2030-in-action{height: 100vh;}

}

@media screen and (max-width:2400px){
	/* Sub Page Vision 2030 */
	.sub-page-vision-2030-in-action{height: 130vh;}
	.sub-page-vision-2030-in-action .two-column-wrapper{height:100vh;}
	.sub-page-vision-2030-in-action .focus-area-white-box{ top: 70%; min-height:40%;}
}

@media screen and (max-width:2048px) and (min-height: 1400px){
	.sub-page-vision-2030-in-action{height: 110vh;}

	/* .banner .sub-pages-spur{height:110vh; width: 21%; top: -15%; bottom: 0; left: -10%;} */
}

@media screen and (max-width:1920px) and (min-height: 1081px){
	
	.sub-page-vision-2030-in-action{height: 115vh;}
	/* .banner .sub-pages-spur{height:117vh; width: 18%; top: -11%; bottom: 0; left: -9%;} */

	.tab-buttons{padding: 16px 88px 16px 0px;}



}



@media screen and (max-width:1920px) and (max-height: 1080px){
	/* .banner .sub-pages-spur{height:133vh; width: 18%; top: -11%; bottom: 0; left: -9%;} */
	.banner .overlay-text .text-wrapper { padding: 5rem 0rem 5rem 12vw;}

	.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 270px;}
	.mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 240px;}

	.horizontal-box-polygon{clip-path: polygon(100% 0, 100% 87%, 97% 100%, 0 100%, 0 0);}
	.vertical-box-polygon{clip-path: polygon(100% 0, 100% 94%, 92% 100%, 0 100%, 0 0);}


	.tab-buttons{padding: 16px 88px 16px 0px;}



}

@media screen and (max-width: 1680px) {
	.sub-page-wrap{width: 81vw;}
	/* .banner .sub-pages-spur{left: -9.5%;} */
	.banner .overlay-text .text-wrapper { padding: 5rem 5rem 5rem 8.5vw;}

	.mid .sub-pages-box-wrapper{justify-content: space-between;}

	.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 255px;}
	.mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 225px;}

	.tab-buttons{padding: 16px 88px 16px 34px;}

}

@media screen and (max-width: 1680px) and (max-height: 1050px){
	.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 250px;}
	/* .mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 225px;width:660px; padding:3%;} */
}



@media screen and (max-width: 1600px) and (max-height: 1200px){
	/* .banner .sub-pages-spur{height:110vh; width: 20%;top: -11%; bottom: 0; left: -10.5%;} */
	.banner .sub-pages-spur{left: -7.5%;}
	.banner .overlay-text .text-wrapper { padding: 5rem 5rem 5rem  9vw;}

	.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 275px;}
	/* .mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 225px;width:660px; padding:3%;} */

		/* Sub Page Vision 2030 */
	.sub-page-vision-2030-in-action{height: 120vh;}

	.horizontal-box-polygon{clip-path: polygon(100% 0, 100% 86%, 96% 100%, 0 100%, 0 0);}
	.vertical-box-polygon{clip-path: polygon(100% 0, 100% 94%, 90% 100%, 0 100%, 0 0);}

	.tab-buttons{padding: 16px 88px 16px 30px;}

}

@media screen and (max-width: 1600px) {
	.sub-page-vision-2030-in-action{height: 160vh;}
}

@media screen and (max-width: 1440px){
	/* .banner .sub-pages-spur{height:105vh; width: 16%; top: -2%; bottom: 0; left: -8%;} */
	.banner .sub-pages-spur{left: -9.5%;}

	.banner .vision-2030-sub-banner{background-position: left;}

	/* .mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 275px;} */
	.mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 215px}

	/* Sub Page Vision 2030 */
	.sub-page-vision-2030-in-action{height: 150vh;}

	.vertical-box-polygon{clip-path: polygon(100% 0, 100% 96%, 90% 100%, 0 100%, 0 0);}
	.tab-buttons{padding: 16px 88px 16px 0px;}

}

@media screen and (max-width: 1366px) {
	/* .banner .sub-pages-spur{height:146vh;} */
	/* .banner .sub-pages-spur{width: 19%; top: -8%; bottom: 0; left: -9.5%;} */
	
	.banner .overlay-text .text-wrapper { padding: 5rem 5rem 5rem  8.8vw;}
	.banner .sub-pages-spur{ left: -10%;}

	.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 265px;}
	/* .mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 215px} */

	.sub-page-vision-2030-in-action{height: 180vh;}

}

@media screen and (max-width: 1300px) {
	/* .banner .sub-pages-spur{height:130vh;width: 17%; top:-4%;left:-8%;} */
}

@media screen and (max-width:1280px) and (max-height: 1024px){
	/* .banner .sub-pages-spur{height:110vh;width: 21%; top:-6%;left:-11%;} */

	/* .mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 265px;} */

	
	.sub-page-vision-2030-in-action{height: 140vh;}
}

@media screen and (max-width:1280px) and (max-height: 690px){
	/* Crucial for laptop */
	.sub-page-vision-2030-in-action{height: 180vh;}
}



@media screen and (max-width: 1200px) {
	.img-cnt-box { display: block; }
	.img-cnt-box img { width: 100%; }
	.img-cnt-box .cnt { padding: 1.5rem; }
}

@media screen and (max-width:1024px){
	.banner .overlay-text h1{ font-size:46px !important }
	.banner .overlay-text .text-wrapper { padding: 5rem 5rem 5rem 9vw; width: 47vw; }

	/* .banner .sub-pages-spur{height:110vh;top:-6%;left:-11%;width: 21%;} */
		.banner .sub-pages-spur{top:-13%;left:-14%;}
		.banner .overlay-text .text-wrapper { padding: 5rem 5rem 5rem  8.6vw;}

		.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: 275px;}
		.mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: 225px}

		.sub-page-vision-2030-in-action{height: 200vh;}

	.vertical-box-polygon{clip-path: polygon(100% 0, 100% 97%, 90% 100%, 0 100%, 0 0);}

		
}

/* Ipad pro 12 inch landscape */
@media only screen
    and (min-device-width: 768px)
    and (max-device-width: 2732px)
    and (orientation:landscape)
    and (-webkit-min-device-pixel-ratio: 2){
		.sub-page-vision-2030-in-action{height: 120vh;}

	}

/* iPad Pro 12 inch portrait mode */
@media screen and (device-width: 1024px) and (max-width: 1366px) and (orientation: portrait){
	.sub-page-vision-2030-in-action{height: 100vh;}
}

  /* Ipad Pro 11 inch Portrait */
@media only screen 
and (max-height: 1180px) 
and (orientation: portrait) 
and (-webkit-min-device-pixel-ratio: 1.5){
	.sub-page-vision-2030-in-action{height: 150vh;}

}

/*Ipad Pro 11 inch Landscape */
@media only screen 
and (max-width: 1300px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 2){
	.sub-page-vision-2030-in-action{height: 160vh;}

}


/*Ipad Mini Portrait */
@media only screen 
and (max-width: 768px) 
and (orientation: portrait) 
and (-webkit-min-device-pixel-ratio: 2){
	.sub-page-vision-2030-in-action{height: 150vh;}

}



/* Tablet */
@media screen and (max-width: 768px) {
	.vision-prev{display:none;	}
	.vision-next{display:none;	}



	
}
	/*end of Vision 2030 information and innovation styles*/

@media screen and (max-width: 900px) {
	
	.banner .wrapper { height: unset; }
	
	.banner .overlay-red-triangle-wrapper { position: absolute; top: 0; height: 440px; }
	.banner .overlay-red-triangle { left: 0; width: 30px; max-width: unset; height: 79px }
	.banner .overlay-img { position: relative; width: 100%; background-position: center; height: 440px; }
	.banner .overlay-transparent { width: 100%; left: unset; right: -80vw; height: 440px; clip-path: polygon(100% 0, 100% 50%, 100% 100%, 0% 100%, 20% 50%, 0% 0%); }
	.banner .overlay-text { width: 100%; position: relative; clip-path: unset; min-height: 330px; }
	.banner .overlay-text .text-wrapper { padding: 3rem 0; width: 85vw; margin: auto; }

	.sustainability-ttl { font-size: 16px; }


	/* Sub Pages First Fold */

	.banner { position: relative; width: 100%; margin: auto; padding-top: 115px;padding-bottom:0}
	.banner .wrapper { position: relative; height: unset; z-index: 1; }
	.banner .sub-pages-spur{display: none; }
	.image-wrapper {display: none;}
	.image-wrapper-mobile {display: block; width: 100%;}
	.banner .overlay-img { background-position: unset; width: 100%; position: relative;margin: unset;}
	.banner .image-positioning-chairman {display: none;}
	.banner .chairman-sub-mob-banner{display: block; width: 100%;}
	.banner .image-positioning-chairman{position:absolute;top:54%;right:calc(100% - 85%);transform:translateY(-50%);background-repeat:no-repeat;background-size:contain;}


	.banner .overlay-text { width: 90vw;position: relative; min-height: unset;}
	.banner .overlay-text .text-wrapper { padding:1.5rem 0rem 0rem 2.4rem; width: 90vw; margin: auto;}
	.banner .overlay-text .text-wrapper h1{font-size: 26px !important;}	
	.banner .overlay-text .text-wrapper p{font-size: 22px !important;}
	.banner .overlay-text .name-pad{padding-top: 1.5rem;}

	article h3 { font-size: 26px !important; }
	article .left-small-spur img,article .right-small-spur img { width: auto; }
	article .left-small-spur img{padding-left: 20px;}
	article .right-small-spur img{padding-right: 20px;}
	article .mob-spur-wrapper {padding-bottom:1rem !important;}
	article .mob-spur-secondary{padding-top: 0 !important;}

	/* Vision 2030 */
	.tab-section{top:113.8px}

		/* Working */
	/* Tab buttons */

	.tab-section{position:sticky;top:80px;width:100%;margin:30px auto;background-color:white; overflow: hidden;}
	.tab-buttons{display:flex;margin:0;padding:0;list-style:none; background-color: white; overflow: hidden;}
	.tab-button{cursor:pointer;padding:10px 15px;margin-right:300px;border:none;border-radius:4px 4px 0 0;color:#555;font-size:16px;font-weight:bold;transition:all 0.3s ease;}
	.tab-button.active{background-color:#ffffff;color:#000;}
	/* Tab content */
	/* .tab-content{display:none;padding:20px;background-color:#fff;border:2px solid #000;border-top:none;border-radius:0 4px 4px 4px;} */
	.tab-item.active{display:block;}



	/* Custom Arrows */
	.tab-buttons-container{position:relative;}
	.custom-arrow-prev{content:url(../image/mob-left-icon.svg) !important;display:block;padding:0;position:absolute;top:5%; z-index: 2;}
	.custom-arrow-next{content:url(../image/mob-right-icon.svg) !important;display:block;padding:0;position:absolute;top:5%;right:0; z-index: 2;}

	.slick-prev{left:10px !important; z-index: 2;}
	.slick-next{right:10px !important; z-index: 2;} 
	.slick-prev::before{content: '' !important;}
	.slick-next::before{content: '' !important;}	

	.col-md-6{flex: 0 0 100%; max-width: 100%;}
	.order-1 {
		order: 1 !important;
	  }
	.order-2 {
		order: 2 !important;
	  }



}

@media screen and (max-width: 900px) and  (orientation: portrait){
	/* Vision 2030 */
	.tab-section{top:83.8px}
}

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

	.sticky-share { display: none; }

	.no-bnr-heading .ttl { padding: 30px 0; }

	.img-cnt-box { display: flex; }
	.img-cnt-box img { width: 250px; }
	.img-cnt-box .cnt { padding: 1rem 1.5rem; }

	.sustainability-ttl { font-size: 20px; }
	/* ------- */


	/* Mobile */
	.sub-page-wrap{width: 90vw;}


	.mob-hide { display: none; }
	.vision-footnote-mob-hide { display: block; }
	.mob-section-margin{margin-top: 0rem !important;}
	.mob-section-no-margin{margin: 0!important;}
	.mob-section-no-padding{padding: 0!important;}

	.mob-section-padding-top{padding-top: 2rem !important;}
	.mob-section-padding-bottom{padding-bottom: 3rem !important;}

	.mob-section-padding{padding: 1rem 0rem !important;}
	.mob-section-padding-x2{padding: 2rem 0rem !important;}
	.mob-section-padding-x3{padding: 3rem 0rem !important;}
	.mobile-text-spur{display: block;}

	.mob-section-no-pad-top-but-btm{padding: 0 0 3rem 0!important;}
	.mob-section-left-padding-x{padding: 0 1.5rem!important;}
	.mob-section-left-padding{padding: 0 1.3rem!important;}
	.mob-section-remove-padding-bottom{padding-bottom: 0!important;}
	
	.mob-section-text-align-left{ text-align: left !important; }




	.banner { position: relative; width: 100%; margin: auto; padding-top: 100px;padding-bottom:0}
	.banner .wrapper { position: relative; height: unset; z-index: 1; }
	.banner .sub-pages-spur{display: none; }
	.image-wrapper {display: none;}
	.image-wrapper-mobile {display: block; width: 100%;}
	.banner .overlay-img { background-position: unset; width: 100%; position: relative;margin: unset;}

	.banner .overlay-text { width: 90vw;position: relative; min-height: unset;}
	.banner .overlay-text .text-wrapper { padding:1.5rem 0rem 0rem 0rem; width: 90vw; margin: auto;}
	.banner .overlay-text .text-wrapper h1{font-size: 26px !important;}
	.banner .overlay-text .text-wrapper p{font-size: 22px !important;}
	.banner .overlay-text .name-pad{padding-top: 1.5rem;}

	article h3 { font-size: 26px !important; }
	article .left-small-spur img,article .right-small-spur img { width: auto; }
	article .left-small-spur img{padding-left: 20px;}
	article .right-small-spur img{padding-right: 20px;}
	article .mob-spur-wrapper {padding-bottom:1rem !important;}
	article .mob-spur-secondary{padding-top: 0 !important;}

	article .sidebar-stick h1{ font-size: 50px !important;}

	/* CEO */
	.sub-page-image-padding{padding: 0;}


	/* Chairman Image */
	.banner .image-positioning-chairman {display: none;}
	.banner .chairman-sub-mob-banner{display: block; width: 100%;}
	.banner .image-positioning-chairman{position:absolute;top:54%;right:calc(100% - 85%);transform:translateY(-50%);background-repeat:no-repeat;background-size:contain;}


	.banner .overlay-text h1{ font-size:50px !important }
	/* .banner .overlay-img { position: absolute; top: 0; bottom: 0; right: 0; width: 55vw; background-repeat: no-repeat; background-size: cover; background-position: right;} */
	.banner .overlay-text .sub-heading { font-size: 22px; }


	/* Sub Page Box */
	.mid .sub-page-wrap h3{margin-bottom: 0 !important;}
	.mid .sub-pages-box-wrapper{display: flex; flex-direction: column; justify-content: unset;}
	.mid .sub-pages-box-wrapper .left-box-wadt{margin-right:0;}
	.mid .sub-pages-box-wrapper .left-box-ctd{margin-right:0;}
	.mid .sub-pages-box-wrapper .left-box-wadt .red-header,.mid .sub-pages-box-wrapper .right-box-wadt .red-header{margin-bottom: 0;}
	.mid .sub-pages-box-wrapper .left-box-ctd .red-header,.mid .sub-pages-box-wrapper .right-box-ctd .red-header{margin-bottom: 0;}
	.mid .sub-pages-box-wrapper .right-box-wadt{margin-left: 0; margin-top: 2rem;}
	.mid .sub-pages-box-wrapper .right-box-ctd{margin-left: 0; margin-top: 2rem;}

	.mid .sub-pages-box-wrapper .left-box-wadt, .mid .sub-pages-box-wrapper .right-box-wadt{height: auto;width:100%;position:relative;background-color:#FFF5E9;opacity:0.9;clip-path: polygon(100% 0, 100% 90%, 95% 100%, 0 100%, 0 0); padding:1.5rem;}
	.mid .sub-pages-box-wrapper .left-box-ctd, .mid .sub-pages-box-wrapper .right-box-ctd{height: auto;width:100%;position:relative;background-color:#FFF5E9;opacity:0.9;clip-path: polygon(100% 0, 100% 90%, 95% 100%, 0 100%, 0 0); padding:1.5rem;}


	.mid .sub-pages-box-wrapper .left-box-wadt h2,  .mid .sub-pages-box-wrapper .right-box-wadt h2{font-size: 40px !important;}
	.mid .sub-pages-box-wrapper .left-box-ctd h2, .mid .sub-pages-box-wrapper .right-box-ctd h2{font-size: 40px !important;}

	/* Sustainability Framework */

	article .for-mobile{padding:0.5rem 2rem;}
	/* .vertical-box-polygon{clip-path: polygon(100% 0, 100% 95%, 90% 100%, 0 100%, 0 0);} */
	.horizontal-box-polygon{clip-path: polygon(100% 0, 100% 95%, 85% 100%, 0 100%, 0 0);}	


	/* Operating and Market Review */
	.img-cnt-box .cnt-header{padding: 1rem 1.5rem 0.5rem 1.5rem !important;}
	.img-cnt-box .cnt { padding: 1.5rem !important;}
	.img-cnt-box .horizontal-box-polygon{clip-path: polygon(100% 0, 100% 87%, 90% 100%, 0 100%, 0 0);}

	/* Vision Tab */

	/* Working */
	/* Tab buttons */

	.tab-section{position:sticky;top:84px;width:100%;margin:30px auto;background-color:white; overflow: hidden;}
	.tab-buttons{display:flex;margin:0;padding:0;list-style:none; background-color: white; overflow: hidden;}
	.tab-button{cursor:pointer;padding:10px 15px;margin-right:100px;border:none;border-radius:4px 4px 0 0;color:#555;font-size:16px;font-weight:bold;transition:all 0.3s ease;}
	.tab-button.active{background-color:#ffffff;color:#000;}
	/* Tab content */
	/* .tab-content{display:none;padding:20px;background-color:#fff;border:2px solid #000;border-top:none;border-radius:0 4px 4px 4px;} */
	.tab-item.active{display:block;}



	/* Custom Arrows */
	.tab-buttons-container{position:relative;}
	.custom-arrow-prev{content:url(../image/mob-left-icon.svg) !important;display:block;padding:0;position:absolute;top:5%; z-index: 2;}
	.custom-arrow-next{content:url(../image/mob-right-icon.svg) !important;display:block;padding:0;position:absolute;top:5%;right:0; z-index: 2;}

	.slick-prev{left:10px !important; z-index: 2;}
	.slick-next{right:10px !important; z-index: 2;} 
	.slick-prev::before{content: '' !important;}
	.slick-next::before{content: '' !important;}

	  
	
	/* .custom-arrow-prev{content:url(../image/mob-left-icon.svg) !important;display:block;padding:0;position:absolute;top:5%;}
	.custom-arrow-next{content:url(../image/mob-right-icon.svg) !important;display:block;padding:0;position:absolute;top:5%;} */

	/* .slick-arrow::before{font-family:Impact, Charcoal, sans-serif;font-size:20px !important;}
	.slick-prev::before{content: '<' !important; color: red;}
	.slick-next::before{content: '>' !important; color: red;} */
	/* .tab-section .slider .slick-prev{left:0;}
	.tab-section .slider .slick-next{right:0;} */

  



	/* Vision First tab */
	.sub-page-vision-2030-in-action{display: none;}
	.sub-page-visio-2030-in-action-mobile{display: block;}
	.bg-light-orange ol{padding-left:1.5rem;}








}

@media screen and (max-width: 420px){
	.tab-section{top:83.8px;}
}

@media screen and (max-width: 380px){
	.tab-section{top:81px;}
}



@media screen and (max-width: 670px) {
	.img-cnt-box { display: block; }
	.img-cnt-box img { width: 100%; }
	.img-cnt-box .cnt { padding: 1.5rem; }
}