html{font-size:14px;}
h2{font-size:21px;}
h3{font-size:16px;}
h4{font-size:14px;}
.mobileMenuWrapper{display:none;}
.circleDate{
	display:block;
	background:#eeeeee;
	color:#46780c;
	border-radius: 50%;
	width:60px;
	height:60px;
	padding-top:5px;
}
.circleDate span{
	display:block;
	text-align:center;
	line-height:22px;
}
.circleDate .month{font-size:11px;}
.circleDate .day{
	font-size:22px;
	font-weight:bold;
}
.accordion li .title{
	font-size:19px;
	padding:10px 10px 10px 0px;
}
.accordion .section .sectionTitle{font-size:16px;}
.mobileMenu{display:none;}

.headerWrapper{position:absolute;}

.headerWrapper.fixed{
	position:fixed;
	top:-85px;
	box-shadow:0px 2px 3px rgba(0,0,0,0.1);
}

.header{
	height:135px;
	padding:0px 20px;
}
.header .logo{
	margin:20px 0px 24px 0px;
	width:auto;
}
.header .logo img{height:auto;}
.headerMargin{height:135px;}
.menuWrapper{
	width:100%;
	bottom:0px;
	margin-top:4px;
}
.menu{
	display:table;
	width:100%;
	color:#666666;
}
.menu > li{
	display:table-cell;
	text-align:center;
	padding:15px 0px;
}
.menu > li#about{width:20%;}  /* .menu > li#about{width:15.8163%;} */
.menu > li#business{width:20%;}	/* .menu > li#business{width:16.4286%;} */
.menu > li#ir{width:20%}	/* .menu > li#ir{width:19.6939%} */
.menu > li#csr{width:20%;} /* .menu > li#csr{width:29.38776%;} */
.menu > li#news{width:20%;}	/* .menu > li#news{width:18.67347%;} */

.menu > li .sectionName{
	font-size:15px;
	display:block;
	border-left:1px solid #addcf8;
	color:#666666;
}
.menu > li:last-child .sectionName{border-right:1px solid #addcf8;}
.menu > li:hover{background:url(../images/global/menu_pointer.png) center bottom no-repeat;}
.menu > li:hover .submenuWrapper{visibility:visible;}
.menu > li.act .sectionName{color:#906548;}

.submenuWrapper{
	position:absolute;
	width:100%;
	background:rgba(255,255,255,0.7);
	left:0px;
	top:135px;
	border-top:8px solid rgba(144,101,72,1);
	font-size:15px;
	min-height:200px;
	visibility:hidden;
	z-index:10;
/*	box-shadow:2px 2px 2px rgba(0,0,0,0.5);*/
}
.submenu{
	width:100%;
	padding:0px 20px;
	margin:30px auto;
}
.submenu a{color:#333333;}
.submenu .col{
	float:left;
	width:25%;
	padding-right:10px;
}
.submenu .col dd{
	text-align:left;
	margin-bottom:20px;
}
.menuBtn{display:none;}
.langWrapper{display:none;}

.bannerWrapper{height:274px;}
.bannerWrapper.global{background:url(../images/global/global_banner.png) center top no-repeat;}
.bannerWrapper.links{background:url(../images/global/links_banner.png) center top no-repeat;}
.bannerWrapper.contactus{background:url(../images/global/contactus_banner.png) center top no-repeat;}
.bannerWrapper.disclaimer{background:url(../images/global/disclaimer_banner.png) center top no-repeat;}
.bannerWrapper.emailalerts{background:url(../images/global/emailalerts_banner.png) center top no-repeat;}
.bannerWrapper.sitemap{background:url(../images/global/sitemap_banner.png) center top no-repeat;}
.bannerWrapper.search{background:url(../images/global/search_banner.png) center top no-repeat;}
.bannerWrapper.about{background:url(../images/about/about_banner.png) center top no-repeat;}
.bannerWrapper.beer{background:url(../images/business/beer_banner.png) center top no-repeat;}
.bannerWrapper.gas{background:url(../images/business/gas_banner.png) center top no-repeat;}
.bannerWrapper.water{background:url(../images/business/water_banner.png) center top no-repeat;}
.bannerWrapper.waste{background:url(../images/business/waste_banner.png) center top no-repeat;}
.bannerWrapper.others{background:url(../images/business/others_banner.png) center top no-repeat;}
.bannerWrapper.ir{background:url(../images/ir/ir_banner.png) center top no-repeat;}
.bannerWrapper.csr{background:url(../images/csr/csr_banner.png) center top no-repeat;}
.bannerWrapper.news{background:url(../images/news/news_banner.png) center top no-repeat;}

.banner{padding:0px 20px;}
.banner .mobileBanner{display:none;}
.banner .textBlock.brownBg{background:rgba(113,61,13, 0.55);}
.banner .textBlock.greenBg{background:rgba(19,112,0, 0.55);}
.banner .textBlock.blueBg{background:rgba(50,93,158, 0.55);}
.banner .textBlock.navyBg{background:rgba(53,147,216, 0.55);}
.banner .textBlock.transparentBg{background:none;}

.banner .textBlock{
	position:position:absolute;
	height:100%;
	width:275px;
	background:#906548;
}
.banner .textBlock .text{
	position:absolute;
	padding:25px 30px;
	bottom:0px;
	font-size:34px;
	line-height:36px;
	text-shadow: 0 0 5px rgba(0,0,0,0.8);
}

.mainContent{
	width:100%;
	padding:0px 20px;
	min-height:577px;
}
.mainContent .pageTitle{font-size:30px;}
.content{
	position:relative;
	margin-left:275px;
	padding:20px 0px 20px 30px;
}
.details{
	width:100%;
}
.footer .link{float:right;}
.footer .copyright{float:left;}

/* announceTemplate */
.announceTemplate .row .date{width:70px;}

/* home */
#home .slideshowWrapper{height:515px;}
#home .slideshowWrapper .titleImgWrapper{
	position:relative;
	width:100%;
	margin:0 auto;
	height:200px;
}
#home .slideshowWrapper .titleImg{
	position:absolute;
	right:20px;
	bottom:0px;
	width:270px;
	text-align:center;
}
#home .slideshow > div img.mobile{display:none;}
#home .slideshow .obj{
	position:absolute;
	width:100%;
	height:100%;
}
/* slide01 */
@keyframes animatedBg{
	from{background-position: 0 0;}
	to{background-position: -50px 0;}
}
@-webkit-keyframes animatedBg{
	from{background-position: 0 0;}
	to{background-position: -50px 0;}
}
@keyframes animatedOpacity{
	0% {opacity:0;}
	50% {opacity:1;}
	100%{opacity:0;}
}
@-webkit-keyframes animatedOpacity{
	0% {opacity:0;}
	50% {opacity:1;}
	100%{opacity:0;}
}
@keyframes animatedFrame{
	0% {opacity:0;}
	50% {opacity:1;}
	100% {opacity:0;}
}
@-webkit-keyframes animatedFrame{
	0% {opacity:0;}
	50% {opacity:1;}
	100% {opacity:0;}
}

#home .slideshow #slide01{background:url(../images/global/home_banner1_cloud.jpg) 0 0 no-repeat;}
#home .slideshow .play .obj.cloud{
	background:url(../images/global/home_banner1_cloud.jpg) no-repeat;
	-webkit-animation: animatedBg 5s linear;
	-moz-animation: animatedBg 5s linear;
	-ms-animation: animatedBg 5s linear;
	animation: animatedBg 5s linear;
	background-position: -50px 0;
}
#home .slideshow .obj.cloud{background-position: 0 0;}
#home .slideshow .obj.reservoir{background:url(../images/global/home_banner1_reservoir.png) center top no-repeat;}

#home .slideshow #slide02{background:url(../images/global/home_banner2_ripple3.jpg) center top no-repeat;}
#home .slideshow .play .obj.ripple1{
	background:url(../images/global/home_banner2_ripple1.jpg) center top no-repeat;
	-webkit-animation: animatedFrame 0.3s linear infinite;
	-moz-animation: animatedFrame 0.3s linear infinite;
	-ms-animation: animatedFrame 0.3s linear infinite;
	animation: animatedFrame 0.3s linear infinite;
	opacity:0;
}
#home .slideshow .obj.ripple1{opacity:0;}
#home .slideshow .play .obj.ripple2{
	background:url(../images/global/home_banner2_ripple2.jpg) center top no-repeat;
	-webkit-animation: animatedFrame 0.3s linear infinite;
	-moz-animation: animatedFrame 0.3s linear infinite;
	-ms-animation: animatedFrame 0.3s linear infinite;
	animation: animatedFrame 0.3s linear infinite;
	-webkit-animation-delay: 0.1s;
	-moz-animation-delay: 0.1s;
	-ms-animation-delay: 0.1s;
	animation-delay: 0.1s;
	opacity:0;
}
#home .slideshow .obj.ripple2{opacity:0;}
#home .slideshow .play .obj.ripple3{
	background:url(../images/global/home_banner2_ripple3.jpg) center top no-repeat;
	-webkit-animation: animatedFrame 0.3s linear infinite;
	-moz-animation: animatedFrame 0.3s linear infinite;
	-ms-animation: animatedFrame 0.3s linear infinite;
	animation: animatedFrame 0.3s linear infinite;
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	-ms-animation-delay: 0.2s;
	animation-delay: 0.2s;
	opacity:0;
}
#home .slideshow .obj.ripple3{opacity:0;}

#home .slideshow #slide03{background:url(../images/global/home_banner3_bg.jpg) center top no-repeat;}
#home .slideshow .play .obj.banner3Glow{
	background:url(../images/global/home_banner3_glow.jpg) center top no-repeat;
	-webkit-animation: animatedOpacity 2s linear;
	-moz-animation: animatedOpacity 2s linear;
	-ms-animation: animatedOpacity 2s linear;
	animation: animatedOpacity 2s linear;
	opacity:0;
}
#home .slideshow .obj.banner3Glow{opacity:0;}

#home .slideshow #slide04{background:url(../images/global/home_banner4_bg.jpg) center top no-repeat;}
#home .slideshow .play .obj.banner4Glow{
	background:url(../images/global/home_banner4_glow.jpg) center top no-repeat;
	-webkit-animation: animatedOpacity 2s linear;
	-moz-animation: animatedOpacity 2s linear;
	-ms-animation: animatedOpacity 2s linear;
	animation: animatedOpacity 2s linear;
	opacity:0;
}
#home .slideshow .obj.banner4Glow{opacity:0;}

#home #pager{
	width:auto;
	position:absolute;
	right:20px;
	bottom:auto;
	top:228px;
}
#home #pager span{
	width:60px;
	height:60px;
}

#home .sectionBox{padding:20px 0px;}
#home .sectionBox .row{
	width:50%;
	margin-bottom:0px;
}
#home .sectionBox .row.left{
	float:left;
	padding-right:10px;
}
#home .sectionBox .row.right{
	float:right;
	padding-left:10px;
}
#home .sectionBox .box.left{padding-right:10px;}
#home .sectionBox .box.right{padding-left:10px;}

#home .latestWrapper{padding:0px;}

#home .latest{
	padding:25px 17%;
	background:url(../images/global/home/1/home_latest_bg_desktop.png) top center no-repeat;
}

#home .relatedWrapper .caringCompany img{
	height:35px;
}
@media only screen and (min-width: 1024px) {
	/* #home .related{
		width:75%;
		float:left;
	} */
	#home .relatedWrapper .caringCompany{
		/* width:20%;
		float:left;
		text-align:center;
		margin: 10px 0;
		display:line; */
		/* width: 25%;
		padding-left: 20px;
		gap: 10px;
		flex-wrap: wrap;
		margin: 0; */
	}
	/* #home .relatedWrapper .caringCompany > div {
		width: 45%;
	} */
}


@media only screen and (min-width: 768px) and (max-width: 980px){
	#home .latest{
		background:url(../images/global/home/1/home_latest_bg_tablet.png) top center no-repeat;
	}	
}
@media only screen and (min-width: 981px) and (max-width: 1024px){
	#home .latest{background:url(../images/global/home/1/home_latest_bg_desktop.png) top center no-repeat;}
}

#home .latest .heading{font-size:24px;}

#home .latest .latestDetails .row{
	display:table;
	padding:10px 0px;
	width:95%;
}
#home .latest .latestDetails .row .title{
	line-height:19px;
	font-size:15px;
}
#home #stockquote .info{padding-left:10px;}
#home #stockquote .info td{padding:1.8% 0px;}
@media only screen and (max-width: 970px){
#home #stockquote .info td{padding:2% 0px;}
	#home #stockquote .info #sectionName{font-size:12px;}
	#home #stockquote .info #stockCode{font-size:11px;}
	#home #stockquote .info .label{font-size:12px;}
	#home #stockquote .info #change{font-size:12px;}
	#home #stockquote .info #price{font-size:16px;}
	#home #stockquote .info .lower{font-size:8px;}
}

#home .relatedWrapper{
	padding:0px;
	margin:20px 0px;
}
#home .related .relatedControl{
	top:5px;
	width:10px;
}
#home .related{
	position:relative;
	margin:10px 0px;
}
.marqueeSlide img{
	height:32px;
	margin:0px 10px;

}

/* csr practice */
#csr_practice .imgBlock{
	width:50%;
	padding-bottom:1.66666%;
}
#csr_practice .imgBlock.fleft{padding-right:0.83333%;}
#csr_practice .imgBlock.fright{padding-left:0.83333%;}
#csr_practice .caption{padding:15px 20px;}

/* csr_management */
#csr_management .section{
	margin-bottom:10px;
	padding:10px 0px;
}
#csr_management .accordion .section{padding:10px;}
#csr_management .accordion .title{
	font-size:16px;
	padding:10px;
}

/* csr_climate */
#csr_climate .section{
	margin-bottom:10px;
	padding:10px 0px;
}

/* csr_awards */
#csr_awards .section{
	margin-bottom:10px;
	padding:10px 0px;
}
@media only screen and (min-width: 1024px) {	
	#csr_awards .award-wrapper {
		display: flex;
		flex-wrap: wrap;
		gap: 30px;
	}
	#csr_awards .award {
		margin-bottom: 0;
	}
}

/* reports */
.reportsTemplate .reportsRow{padding:30px 0px;}
.reportsTemplate .reportsCol img.preCover{
    height: 144px;
    width: 204px;
}

/* highlights */
#highlights .highlightsTable{margin-bottom:50px;}
#highlights td{
	padding:15px 20px;
	font-size:14px;
}
#highlights .highlightsCol{
	float:left;
	width:50%;
}
@media only screen and (max-width: 780px){
	#highlights .highlightsCol .heading{font-size:13px;}
}
#highlights .highlightsCol.left{padding-right:10px;}
#highlights .highlightsCol.right{padding-left:10px;}
#highlights .highlightsCol .chart{margin:20px 0px;}

/* dividend */
#dividend .dividendTable{max-width:760px;}
#dividend .dividendTable td{
	padding:10px 15px;
	font-size:14px;
}

/* video, anniversary_20th */
#video .videoBlock, #anniversary_20th .videoBlock{
	margin-top:50px;
	max-width:400px;
	display:inline-block;
}
#video .videoImg, #anniversary_20th .videoImg{margin:20px;}

/* sitemap */
.sitemapWrapper{
	width:100%;
/*	background:url(../images/global/sitemap_bg.png) center top no-repeat;*/
	background:#3b4935;
	color:#fff;
}
.sitemapWrapper a{color:#fff;}
.sitemapWrapper .sitemap{
	width:100%;
	margin:0 auto;
	padding-left:20px;
}
.sitemapWrapper .sitemap .tabletCol{float:left;}
.sitemapWrapper .sitemap .tabletCol.two{width:40%;}
.sitemapWrapper .sitemap .tabletCol.one{
	width:20%;
	float:left;
}
.sitemapWrapper .sitemap .col{
	width:100%;
	float:left;
	margin:25px 0px;
}
.sitemapWrapper .sitemap .tabletCol.two .col{width:50%;}
.sitemapWrapper .sitemap .tabletCol.one .col{width:100%;}
.sitemapWrapper .sitemap dt{
	font-size:18px;
	padding-bottom:5px;
	border-bottom:1px solid #fff;
	margin:0px 20px 6px 0px;
}
.sitemapWrapper .sitemap dd{
	margin:0;
	font-size:13px;
	font-weight:300;
	line-height:16px;
	margin:0px 20px 8px 0px;
}
@media only screen and (max-width: 980px){
	.sitemapWrapper .sitemap .tabletCol.two{
		width:66.66666%;
		float:left;
	}
	.sitemapWrapper .sitemap .tabletCol.one{
		width:33.33333%;
		float:right;	
	}	
	.sitemapWrapper .sitemap .sitemapCol{width:100%;}
}