@charset "utf-8";

/* **************************************************

Name: gbc.css

***************************************************** */


/* ==================================================

[-] Content Area
[cc] Column
[c2] Heading
[c3] Text
[c5] Image
[c12] Button
[-] Case Study
[-] Branding Image
[-] Fat Menu

===================================================== */
.col-1 { width: 8.33333%; }
.offset-left-1 { margin-left: 8.33333%; }
.offset-right-1 { margin-right: 8.33333%; }

.col-2 { width: 16.66667%; }
.offset-left-2 { margin-left: 16.66667%; }
.offset-right-2 { margin-right: 16.66667%; }

.col-3 { width: 25%; }
.offset-left-3 { margin-left: 25%; }
.offset-right-3 { margin-right: 25%; }

.col-4 { width: 33.33333%; }
.offset-left-4 { margin-left: 33.33333%; }
.offset-right-4 { margin-right: 33.33333%; }

.col-5 { width: 41.66667%; }
.offset-left-5 { margin-left: 41.66667%; }
.offset-right-5 { margin-right: 41.66667%; }

.col-6 { width: 50%; }
.offset-left-6 { margin-left: 50%; }
.offset-right-6 { margin-right: 50%; }

.col-7 { width: 58.33333%; }
.offset-left-7 { margin-left: 58.33333%; }
.offset-right-7 { margin-right: 58.33333%; }

.col-8 { width: 66.66667%; }
.offset-left-8 { margin-left: 66.66667%; }
.offset-right-8 { margin-right: 66.66667%; }

.col-9 { width: 75%; }
.offset-left-9 { margin-left: 75%; }
.offset-right-9 { margin-right: 75%; }

.col-10 { width: 83.33333%; }
.offset-left-10 { margin-left: 83.33333%; }
.offset-right-10 { margin-right: 83.33333%; }

.col-11 { width: 91.66667%; }
.offset-left-11 { margin-left: 91.66667%; }
.offset-right-11 { margin-right: 91.66667%; }

.col-12 { width: 100%; }
.offset-left-12 { margin-left: 100%; }
.offset-right-12 { margin-right: 100%; }


/* [-] Content Area
=========================================================================================== */
#Contents * {
	box-sizing: border-box;
}
#Contents {
	color: #403a3a;
}

.ShowU995 { display: none; }
.HideU995 { display: block; }

/* [cc] Column
=========================================================================================== */

.Column2 {
}

/* [c2] Heading
=========================================================================================== */
h1.GbcStyle {
	display: none;
}
h2.GbcStyle {
	position: relative;
	margin: -.4em 0 .5em 0;
	padding: 0;
	background-image: none;
	font-size: 5.5em;
	font-weight: 500;
	line-height: 1em;
	letter-spacing: -.02em;
}
h2.GbcStyle:before {
	content: '';
	position: absolute;
	top: -.2em;
	left: -15px;
	right: -15px;
	bottom: 0;
	background: rgba(255, 255, 255, 0.7);
	z-index: 0;
	
}
h2.GbcStyle span {
	display: block;
	position: relative;
	z-index: 1;
	padding: 0 0 0 .3em;
	border-left: 0.15em solid #e60027;
	background-color: transparent;
	color: #403a3a;
	font-size: 100%;
	font-weight: inherit;
	line-height: 100%;
}
h2.GbcStyle.GbcSmall {
	margin: 0 0 .5em 0;
	font-size: 2.5em;
}
h2.GbcStyle.GbcSmall:before {
	top: 0;
}
h3.GbcStyle {
	margin: 0;
	padding: 0;
	background-image: none;
	color: #403a3a;
	font-weight: 500;
	font-size: 2.4em;
}
h3.GbcStyle span {
	display: inline;
	padding: 0;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
	line-height: inherit;
	background-color: transparent;
}
h3.GbcStyle2 {
    color: #333;
	font-size: 1.3em;
    font-weight: bold;
    line-height: 130%;
    margin: 0 0 10px;
}
h4.GbcStyle {
	font-size: 1.3em;
}


/* [c3] Text
=========================================================================================== */

.GbcTop .TextStyle1 {
	margin: 1.5em 16.66667% 5em 0;
}


/* [c5] Image
=========================================================================================== */

.si-logo {
	display: inline-block;
	width: 16em;
}

.FatMenuLink .si-logo {
	width: 100%;
}


/* [c12] Button
=========================================================================================== */
.GbcTop .Button {
	margin-bottom: 4em;
}


/* [-] Case Study
=========================================================================================== */
.hr {
	height: .2em;
	margin-bottom: 4em;
	background: #f2f2f2;
}

h2.CSStyle {
	margin: 0 0 30px;
	padding: 0 0 60px 0;
	background: url(/-/media/project/hitachi/sib/image/en/add/gbc/vertical_line.gif) no-repeat center bottom;
	color: #e60027;
	text-align: center;
	font-weight: bold;
}

.CSCategory {
	width: 100%;
	margin-bottom: 60px;
}
.CSCategory > dt {
	float: left;
	width: 14.2857%;
    font-size: 83%;
    line-height: 1;
}
.CSCategory > dt span {
	display: inline-block;
	width: 100%;
	border-color: #e5e5e5;
	border-style: solid;
	border-width: 1px 1px 1px 0;
}
.CSCategory > dt:first-child span {
	border-left-width: 1px;
}
.CSCategory > dt:after {
	content: "";
	display: block;
	width: 100%;
	height: 8px;
	top: 7px;
	left: 0;
	background-color: #fff;
}
.CSCategory > dt.active:after {
	background-color: #e60027;
}
.CSCategory > dt a {
	display: inline-block;
	position: relative;
	margin: 0;
	padding: 50px 0 10px;
	width: 100%;
	color: #333;
	text-align: center;
	text-decoration: none;

	background-repeat: no-repeat;
	background-position: 50% 15px;
	background-size: 1.5em auto;
	-moz-background-size: 1.5em auto;
	-webkit-background-size: 1.5em auto;
	-o-background-size: 1.5em auto;
	-ms-background-size: 1.5em auto;
	opacity: .5;
}
.CSCategory > dt.active a,
.CSCategory > dt a:hover {
	opacity: 1;
}

.disnon {
	display: none !important;
}
.CaseStudy {
	position: relative;
}
.CSItem {
}

.CSContent {
	background: #efefef;
	width: 85%;
	padding: 3em;
	position: relative;
	top: -3em;
	height: 16em;
}
.CSContent h3 {
	color: #333;
}
.CSContent h3.iconSet {
	padding-left: 3.5em;
	min-height: 3em;
}
.CSContent .icon {
	display: block;
	border: 1.5px solid rgba(149, 149, 149, 0.8);
	color: #403a3a;
	opacity: .8;
	font-size: 1.5em;
	border-radius: 100%;
	width: 2em;
	height: 2em;
	text-align: center;
	line-height: 1.8em;
	position: absolute;
	top: 2.2em;
	left: 2em;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: .8em auto;
	-moz-background-size: .8em auto;
	-webkit-background-size: .8em auto;
	-o-background-size: .8em auto;
	-ms-background-size: .8em auto;
}
.iconWater {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-water.svg);
}
.iconEnergy {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-energy.svg);
}
.iconManufacturing {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-manufacturing.svg);
}
.iconHealthcare,
.iconLifeEconomy {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-healthcare.svg);
}
.iconIT,
.iconRD {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-it.svg);
}
.iconTransportation {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-transportation.svg);
}
.iconUrbanDevelopment {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-urban-development.svg);
}
.iconBook {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-book.svg);
}

/*--- Slider ---*/
.bx-wrapper {
	position: relative;
	padding: 0;
	*zoom: 1;
}

.bx-wrapper img {
	max-width: 100%;
	display: block;
}
.CaseStudy .bx-wrapper .bx-pager,
.CaseStudy .bx-wrapper .bx-controls-auto {
	position: relative;
	top: 1em;
	width: 100%;
	padding-bottom: 1em;
}

/* PAGER */
.CaseStudy .bx-wrapper .bx-pager {
	text-align: center;
	font-size: .85em;
	font-family: Arial;
	font-weight: bold;
	color: #666;
	padding-top: 20px;
}

.CaseStudy .bx-wrapper .bx-pager .bx-pager-item,
.CaseStudy .bx-wrapper .bx-controls-auto .bx-controls-auto-item {
	display: inline-block;
	*zoom: 1;
	*display: inline;
}

.CaseStudy .bx-wrapper .bx-pager.bx-default-pager a {
	background: #dbdada;
	text-indent: -9999px;
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	outline: 0;
/*	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
*/
}
.CaseStudy .bx-wrapper .bx-pager.bx-default-pager a:hover,
.CaseStudy .bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #4d4848;
}


/* [-] Branding Image
=========================================================================================== */

.BrandingArea {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 35%;
	background-color: #fff;
	background-position: 100% 100%;
	background-repeat: no-repeat;
	background-size: cover;
}


/* Topics */
.section-img-wrapper {
	position: relative;
}
.section-img-wrapper:after {
	content: "";
	display: table;
	clear: both;
}
.section-img-wrapper .section-img-main {
    position: relative;
} 
.section-img-wrapper .section-img-main img {
	width: 100%;
}
.section-img-wrapper .section-img-label {
	width: 33.33333%;
	background-color: #f2f2f2;
	padding: 2.5em 2em;
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -7em;
	text-align: center;
}
.section-img-wrapper .section-img-label h3 {
	margin-bottom: 0;
	margin-top: .4em;
}
.topicSecurity .section-img-main {
	float: left;
}
.topicAnalytics .section-img-main {
	float: right;
}
.topicAnalytics .section-img-wrapper .section-img-label {
	right: auto;
	left: 0;
}
.topicAnalytics .TextStyle1 {
	margin-left: 16.66667%;
	margin-right: 0;
}

.playButton {
	background: none;
	border: none;
	color: #403a3a !important;
	font-weight: bold;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
	cursor: pointer;
	white-space: nowrap;
}
.playButton span {
	font-size: .95em;
	top: -2.5em;
	display: inline-block;
	position: relative;
	letter-spacing: .2em;
}
.playButton .icon-play {
	margin: 0 2em;
	
	width: 6.5em;
	height: 6em;
	position: relative;
	display: inline-block;
}
.playButton .icon-play img {
	width: 7em !important;
	height: 7em !important;
	position: absolute;
	display: block;
	top: 40%;
	left: 51%;
	-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
}
.playButton .movieTitle,
.watchNowButton .movieTitle {
	display: none;
}

a.watchNowButton {
	display: block;
	width: 12em;
	line-height: 2.5em;
	padding: 0 8px 0 0;
	color: #fff;
	font-size: .8em;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	border: .3em solid #e60027;
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_link_right_l_white.gif);
	background-position: right 4px center;
	background-repeat: no-repeat;
	box-sizing: border-box;
}
a.watchNowButton:hover {
	background-color: rgba(0,0,0,0.2);
	background-position: right 2px center;
}
a.watchNowButton.GbcRedWhite {
	border-color: #e60027;
	color: #fff;
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_link_right_l_white.gif);
}
a.watchNowButton.GbcRedBlack {
	border-color: #e60027;
	color: #333;
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_link_right_l_black.gif);
}
a.watchNowButton.GbcGrayGray {
	border-color: #7b7b7b;
	color: #7b7b7b;
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_link_right_l_gray.gif);
}


/* --- Play You Tube --- */

#ModalAboutYouTubeCover {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	z-index: 100;
}

#ModalAboutYouTube {
	display: none;
	position: absolute;
	padding: 50px;
	z-index: 102;
}

#ModalAboutYouTube .Inner {
	position: relative;
	background-color: #000;
	box-shadow: 0 0 35px rgba(0, 0, 0, .4);
	-moz-box-shadow: 0 0 35px rgba(0, 0, 0, .4);
	-webkit-box-shadow: 0 0 35px rgba(0, 0, 0, .4);
	-o-box-shadow: 0 0 35px rgba(0, 0, 0, .4);
	-ms-box-shadow: 0 0 35px rgba(0, 0, 0, .4);
}
*:first-child+html #ModalAboutYouTube .Inner {background-color: #f2f2f2;}

#ModalAboutYouTube iframe {
	display: block;
	width: 100%;
}

#ModalAboutYouTube .Title {
	height: 50px;
	background-color: #f2f2f2;
	overflow: hidden;
}

#ModalAboutYouTube .Title p {
	display: table-cell;
	height: 50px;
	padding: 0 80px 0 20px;
	vertical-align: middle;
	font-size: 90%;
	font-weight: bold;
	line-height: 130%;
	color: #575757;
}
*:first-child+html #ModalAboutYouTube .Title p {
	display: block;
	height: 35px;
	padding-top: 15px;
}

#ModalAboutYouTube .BtnClose {
	position: absolute;
	right: 0;
	bottom: 0;
	line-height: 130%;
}

#ModalAboutYouTube .BtnClose a {
	display: table-cell;
	min-width: 50px;
	height: 30px;
	padding: 20px 5px 0;
	font-size: 76%;
	text-align: center;
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_close_hd.gif);
	background-image/*\**/: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_close.gif)\9;
	background-position: center 7px;
	background-repeat: no-repeat;
	background-size: 16px 16px;
	-moz-background-size: 16px 16px;
	-webkit-background-size: 16px 16px;
	-o-background-size: 16px 16px;
	-ms-background-size: 16px 16px;
	vertical-align: middle;
}
*:first-child+html #ModalAboutYouTube .BtnClose a {
	display: block;
	height: 25px;
	padding: 25px 5px 0;
}

#ModalAboutYouTube .BtnClose a:link,
#ModalAboutYouTube .BtnClose a:visited {
	color: #fff;
	background-color: #e60027;
	text-decoration: none;
}
#ModalAboutYouTube .BtnClose a:hover,
#ModalAboutYouTube .BtnClose a:active {
	color: #fff;
	background-color: #b1000e;
	text-decoration: none;
}

#ModalAboutYouTube .l {
	position: absolute;
	width: 35px;
	height: 100%;
	top: 0;
	left: -35px;
	background: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_l.png) repeat-y;
}
#ModalAboutYouTube .r {
	position: absolute;
	width: 35px;
	height: 100%;
	top: 0;
	right: -35px;
	background: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_r.png) repeat-y;
}
#ModalAboutYouTube .t {
	position: absolute;
	width: 100%;
	height: 35px;
	top: -35px;
	left: 0;
	background: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_t.png) repeat-x;
}
#ModalAboutYouTube .b {
	position: absolute;
	width: 100%;
	height: 35px;
	bottom: -35px;
	left: 0;
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_b.png);
	background-repeat: repeat-x;
}
#ModalAboutYouTube .lt {
	position: absolute;
	width: 35px;
	height: 35px;
	top: -35px;
	left: -35px;
	background: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_corner.png) no-repeat left top;
}
#ModalAboutYouTube .lb {
	position: absolute;
	width: 35px;
	height: 35px;
	bottom: -35px;
	left: -35px;
	background: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_corner.png) no-repeat left bottom;
}
#ModalAboutYouTube .rt {
	position: absolute;
	width: 35px;
	height: 35px;
	top: -35px;
	right: -35px;
	background: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_corner.png) no-repeat right top;
}
#ModalAboutYouTube .rb {
	position: absolute;
	width: 35px;
	height: 35px;
	bottom: -35px;
	right: -35px;
	background: url(/-/media/project/hitachi/sib/image/en/r1/bg_modal_corner.png) no-repeat right bottom;
}

/* [-] Site Top
=========================================================================================== */
.SectionBgImg {
	clear: both;
	width: 100%;
	height: 0;
	background-color: #fff;
	background-position: 40% 100%;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: 25%;
	position: relative;
}
.SectionBgImgContent {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
.SectionBgImgContent h2 {
	padding: 0 0 0;
	font-size: 1.5em;
	font-weight: 500;
	background-image: none;
}
.SectionBgImgContent p {
	width: 45%;
	margin: 0 0 2em;
	font-size: 0.8em;
}
.ExploreOurStories {
	margin: 0 0 7em;
}

/* [-] About Social Innovation
=========================================================================================== */
.AboutDiagramContainer {
	margin: 4em auto;
	position: relative;
	width: 720px;
	max-width: 100%;
	height: 0;
	background: url(/-/media/project/hitachi/sib/image/en/add/gbc/about/venn.svg) no-repeat;
	background-size: contain;
	padding-bottom: 83.33333%;
}
.AboutDiagramContainer .society,
.AboutDiagramContainer .govt,
.AboutDiagramContainer .corporations,
.AboutDiagramContainer .communities {
	position: absolute;
	width: 31.25%;
	text-align: center;
}
.AboutDiagramContainer .society {
	top: 20.33333%;
	left: 86.25%;
	text-align: left;
	width: 182px;
}
.AboutDiagramContainer .society h4 {
	color: #e60027;
}
.AboutDiagramContainer .govt {
	top: 19.66667%;
	left: 34.72222%;
}
.AboutDiagramContainer .corporations {
	top: 69.16667%;
	left: 8.61111%;
}
.AboutDiagramContainer .communities {
	top: 69.16667%;
	left: 59.58333%;
}
.AboutTopic {
	background: #f2f2f2;
	padding: 4em 0 2em;
}
.AboutTopic .h3 {
    font-size: 5em;
    font-weight: 500;
    margin-bottom: .5em;
    display: table;
}
.AboutTopic .cell {
	display: table-cell;
	position: relative;
	vertical-align: middle;
	line-height: 3em;
}
.AboutTopic .it,
.AboutTopic .x {
	text-align: center;
}
.AboutTopic .it,
.AboutTopic .social {
	height: 100%;
}
.AboutTopic .x {
	-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
			transform: rotate(45deg);
	color: #e60027;
	line-height: 1em;
}
.AboutTopic .social {
	word-spacing: 100em;
	line-height: 1em;
}


.AboutCarousel {
	margin-top: 4em;
	margin-bottom: 4em;
	position: relative;
	margin-left: 16.6667%;
}

.AboutCarousel .carousel-items {
	position: relative;
	height:  45em; }
.AboutCarousel .carousel-item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #FFF;
	opacity: 0;
}
.AboutCarousel .carousel-item.active {
	z-index: 1;
	opacity: 1; }

.AboutCarousel .top {
	position: relative;
	width: 100%;
	height: 27em; }
.AboutCarousel .bottom {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 22%; }
.AboutCarousel .h3 {
	color: #333;
	border-left: 0.15em solid #e60027;
	padding-left: 0.5em;
	font-size: 2.8em;
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
	margin: 0;
	line-height: 1em;
	font-weight: 500; }
.AboutCarousel .h3 em {
	font-style: normal;
	color: #e60027; }
.AboutCarousel .gray-block {
	background: #efefef;
	height: 100%;
	display: inline-block; }
.AboutCarousel .carousel-item-img-container {
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	display: inline-block;
	background-position: 100% 50%;
	background-size: cover; }
.AboutCarousel .carousel-item-img {
	width: 100%;
	height: 100%; }
.AboutCarousel .carousel-item-animation {
	display: block;
	height: 100%;
	position: absolute; }
.AboutCarousel .carousel-item-number {
	display: block;
	background: #e60027;
	color: #fff;
	font-size: 5em;
	font-weight: 500;
	position: absolute;
	top: 0;
	height: 100%;
	width: 22%;
	text-align: center;
	line-height: 100%; }
.AboutCarousel .carousel-item-number .number {
	margin-top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%); }
.AboutCarousel .carousel-item-number .number sup {
	font-size: .7em;
	position: relative;
	top: .1em;
	margin-left: -.2em; }
.AboutCarousel .carousel-item-number .number span {
	display: block;
	font-size: .4em;
	margin-top: -.2em;
	line-height: 1em; }
.AboutCarousel p {
	margin: 3em 0; }

.AboutCarousel .carousel-item-nav {
	background-color: #403a3a;
	color: #fff;
	position: absolute;
	padding: 1.75em 0;
	left: 58.3333%;
	top: 27em;
	z-index: 100;
	-webkit-transform: translateY(-99%);
		-ms-transform: translateY(-99%);
		transform: translateY(-99%);
	width: 22%;
	text-align: center;
}
.AboutCarousel .carousel-item-nav span {
	font-size: 0.8em;
	line-height: 100%;
}
.AboutCarousel .carousel-item-nav .controls-direction {
	position: relative;
	bottom: 1em;
}
.AboutCarousel .carousel-item-nav .prev {
	position: absolute;
	left: 2em;
	outline: 0;
	background: url(/-/media/project/hitachi/sib/image/en/add/gbc/carousel-arrow-left.svg) no-repeat 0 50%;
	background-size: contain;
	width: .6em;
	height: .8em;
	border: none;
	cursor: pointer;
}
.AboutCarousel .carousel-item-nav .next {
	position: absolute;
	right: 2em;
	outline: 0;
	background: url(/-/media/project/hitachi/sib/image/en/add/gbc/carousel-arrow-right.svg) no-repeat 100% 50%;
	background-size: contain;
	width: .6em;
	height: .8em;
	border: none;
	cursor: pointer;
}


/* [-] Our Stories
=========================================================================================== */
.OurStoriesCatchArea {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
.OurStoriesCatch {
	margin: 0 0 1.5em;
}

.OurStoriesContentsBG {
	background-color: #f2f2f2;
}

.OurStoriesSI {
	padding: 4em 0 1.5em;
	overflow: hidden;
}
.OurStoriesSI .GbcStyle {
	float: left;
}
.OurStoriesSI .GbcStyle::before {
	background: none;
}
.OurStoriesSI .OurStoriesSIText {
	margin: 0 0 0 22em;
}
.OurStoriesSI .OurStoriesSIText .TextStyle1 b {
	font-size: 1.1em;
}

.OurStoriesMovies {
	overflow: hidden;
}
.OurStoriesMovies h3 {
	margin-bottom: 1.5em;
	color: #333;
	font-size: 1.3em;
	font-weight: normal;
}
.OurStoriesMovies .MovieItems {
	margin-left: -10px;
	margin-top: 1em;
	margin-bottom: 5em;
}
.OurStoriesMovies .MovieItems .MovieItem {
	clear: none;
	display: table-cell;
	float: none;
	width: 25%;
	margin: 0 0 3em;
	padding: 0 0 3em;
	border-left: #f2f2f2 solid 10px;
	background: #fff;
	position: relative;
}
.OurStoriesMovies .MovieItems .MovieItem .MovieItemText {
	padding: 1.2em;;
}
.OurStoriesMovies .MovieItems .MovieItem .MovieItemText h4 {
	margin: 0 0 0.5em;
}
.OurStoriesMovies .MovieItems .MovieItem .MovieItemText p {
	margin: 0 0 2em;;
	font-size: .8em;
}
.OurStoriesMovies .MovieItems .MovieItem .MovieItemButton {
	width: 100%;
	padding: 0 1.2em;
	box-sizing: border-box;
	position: absolute;
	bottom: 1.2em;
}
.OurStoriesMovies .MovieItems .MovieItem .MovieItemButton a.watchNowButton {
	width: 100%;
}
.OurStoriesBS {
	margin: 0 0 2em;
	color: #fff;
}


/* [-] Solutions
=========================================================================================== */

.CSCategoryContainer {
	background-color: #4d4848;
}

.CSCategoryContainer .CSCategory {
	margin-bottom: 0;
}
.CSCategoryContainer .CSCategory > dt span {
	border-color: #5f5b5b;;
	border-style: solid;
	border-width: 0 1px 0;
}
.CSCategoryContainer .CSCategory > dt:after {
	display: none;
}
.CSCategoryContainer .CSCategory > dt a {
	background-color: #4d4848;
	display: inline-block;
	position: relative;
	margin: 0;
	padding: 50px 0 15px;
	width: 100%;
	color: #fff;
	text-align: center;
	text-decoration: none;
	
	background-size: 1.5em auto;
	-moz-background-size: 1.5em auto;
	-webkit-background-size: 1.5em auto;
	-o-background-size: 1.5em auto;
	-ms-background-size: 1.5em auto;
	opacity: .8;
}
.CSCategoryContainer .CSCategory > dt.active a,
.CSCategoryContainer .CSCategory > dt a:hover {
	background-color: #b3aeae;
	opacity: 1;
}
.GbcSolutions .iconWater {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-water_w.svg);
}
.GbcSolutions .iconEnergy {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-energy_w.svg);
}
.GbcSolutions .iconManufacturing {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-manufacturing_w.svg);
}
.GbcSolutions .iconLifeEconomy {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-healthcare_w.svg);
}
.GbcSolutions .iconRD {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-it_w.svg);
}
.GbcSolutions .iconTransportation {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-transportation_w.svg);
}
.GbcSolutions .iconUrbanDevelopment {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon-urban-development_w.svg);
}
.SolutionItem {
	min-height: 45em;
	padding: 8em 0 1em 0;
}
.SolutionItem#water {
  background: url(/-/media/project/hitachi/sib/image/en/add/gbc/solutions/water-bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  background-position: 100% 50%; }

.SolutionItem#energy {
  background: url(/-/media/project/hitachi/sib/image/en/add/gbc/solutions/energy-bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  background-position: 100% 50%; }

.SolutionItem#manufacturing {
  background: url(/-/media/project/hitachi/sib/image/en/add/gbc/solutions/manufacturing-bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  background-position: 100% 50%; }

.SolutionItem#life_economy {
  background: url(/-/media/project/hitachi/sib/image/en/add/gbc/solutions/life-economy-bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  background-position: 100% 50%; }

.SolutionItem#r_d {
  background: url(/-/media/project/hitachi/sib/image/en/add/gbc/solutions/r-d-bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  background-position: 100% 50%; }

.SolutionItem#transportation {
  background: url(/-/media/project/hitachi/sib/image/en/add/gbc/solutions/transportation-bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  background-position: 100% 50%; }

.SolutionItem#urban_development {
  background: url(/-/media/project/hitachi/sib/image/en/add/gbc/solutions/urban-development-bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  background-position: 100% 50%; }

.SolutionItem .SectionHeader {
	border-left: 0.75em solid #e60027;
	padding-left: 16.66667%;
	color: #fff;
	position: relative;
}
.SectionHeader .icon {
    border-radius: 100%;
    border: 3px solid rgba(255, 255, 255, 0.2);
    width: 2.5em;
    height: 2.5em;
    display: block;
    text-align: center;
    font-size: 2.75em;
    padding-top: .7em;
    position: absolute;
    top: 0;
    left: .75em;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 1em auto;
	-moz-background-size: 1em auto;
	-webkit-background-size: 1em auto;
	-o-background-size: 1em auto;
	-ms-background-size: 1em auto;
}
.SectionHeader .h2 {
	margin: 0;
	padding: 0;
	font-weight: 500;
	font-size: 7em;
	line-height: 1;
	background: none;
}
.SectionHeader p {
	margin: 2em 0;
}
.SolutionItem .PageTop {
	margin-top: 8em;
}

.SolutionItem .toggleButton {
	display: none;
}

.max-width,
.max-width-with-margin {
	margin: 0 auto;
	max-width: 965px;
}

.carousel {
	height: auto;
/*	height: 22em; */
	margin: 8em 0 4em;
	position: relative;
}
.carousel.right .carousel-item-text {
	float: right;
}
.carousel.right .carousel-item-img-container {
	right: auto;
	left: 0;}
.carousel.right .bg.half-2 {
	left: 0;
}
.carousel .carousel-items {
	position: relative;
/*	height: 100%; */
	margin-top: 3em;
	height: 22em;
}
.carousel .carousel-item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.carousel .carousel-item.active {
	z-index: 1;
}
.carousel .bg {
	background: #fff;
	height: 100%;
	width: 100%;
	position: absolute;
}
.carousel .bg.half-1 {
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}
.carousel .bg.half-2 {
	left: 50%;
	width: 50%;
}
.carousel .carousel-item-content {
	position: relative;
	height: 100%;
}
.carousel .carousel-item-text {
	padding: 2em 4em;
}

.carousel .h3 {
	font-size: 1.2em;
	font-weight: 500;
}
.carousel .carousel-item-img-container {
	width: 50%;
	position: absolute;
	left: 50%;
	top: -4.7em;
/*	bottom: 4.7em; */
/*	background-size: cover; */
	height: 90%;
}
.carousel .carousel-item-img {
	width: 100%;
	height: 100%;
}

.carousel .carousel-item-nav {
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 50%;
	-webkit-transform: translateX(-482px);
		-ms-transform: translateX(-482px);
			transform: translateX(-482px);
	z-index: 100;
	background-color: #efefef;
	color: #4d4848;
	padding: 1.25em 0;
	text-align: center;
	width: 15%;
}
.carousel.right .carousel-item-nav {
	right: 50%;
	left: auto;
	-webkit-transform: translateX(482px);
		-ms-transform: translateX(482px);
			transform: translateX(482px);
}
.carousel .carousel-item-nav span {
	font-size: 0.8em;
	line-height: 100%;
}
.carousel .carousel-item-nav .controls-direction {
	position: relative;
	bottom: 1em;
}
.carousel .carousel-item-nav .prev {
	position: absolute;
	left: 1.5em;
	outline: 0;
	background: url(/-/media/project/hitachi/sib/image/en/add/gbc/carousel-arrow-left-gray.svg) no-repeat 0 50%;
	background-size: contain;
	width: .6em;
	height: .8em;
	border: none;
	cursor: pointer;
}
.carousel .carousel-item-nav .next {
	position: absolute;
	right: 1.5em;
	outline: 0;
	background: url(/-/media/project/hitachi/sib/image/en/add/gbc/carousel-arrow-right-gray.svg) no-repeat 100% 50%;
	background-size: contain;
	width: .6em;
	height: .8em;
	border: none;
	cursor: pointer;
}


/* [-] Fat Menu
=========================================================================================== */

/*.FatMenu, .FatMenuWide {
	background-color: #e5e5e5;
	border-bottom: solid 1px #fff;
}
.FatMenuSet {
	padding-top: 1.5em;
	padding-bottom: 1.5em;
}
.FMLinkListStyle li {
	padding-bottom: 1.5em;
}
.FMLinkListStyle li a:link,
.FMLinkListStyle li a:visited {
	color: #403a3a;
}
.FMLinkListStyle li a:hover,
.FMLinkListStyle li a:active {
	color: #b1000e;
}

.FMLinkListStyle li a {
	background: url(/-/media/project/hitachi/sib/image/en/add/gbc/footer-arrow-right.svg) no-repeat 100% 40%  !important;
	background-size: 1em 1em !important;
}
.FMLinkListStyle li a:hover,
.FMLinkListStyle li a:active,
.FMLinkListStyle li a:focus {
	padding-right: 1.7em !important;
}*/



/* for print
=========================================================================================== */

@media print {

	#ModalAboutYouTubeCover {
		position/*\**/: fixed\9;
		width: 100% !important;
		height: 100% !important;
		top: 0 !important;
	}
	@-moz-document url-prefix() {
		#ModalAboutYouTubeCover {position: fixed;}
	}

	#ModalAboutYouTube {
		width: 100% !important;
		height: 100% !important;
		top: 0 !important;
		left: 0 !important;
		padding: 0 !important;
	}

	#ModalAboutYouTube .Inner {
		width: 853px !important;
		height: 530px !important;
		margin: 300px auto 0 !important;
	}

	#ModalAboutYouTube .Movie,
	#ModalAboutYouTube .Movie iframe {
		width: 853px !important;
		height: 480px !important;
	}

}

/* Link Icon
=========================================================================================== */

@media screen and (min-width: 1px) {
	.PageTop a {background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/icon_link_top_hd.png);}
}

/* for 995px -
=========================================================================================== */

@media screen and (min-width: 995px) {

	/* --- About Social Innovation --- */
	.JS .AboutDiagramContainer {
		height: 600px;
		padding-bottom: 0;
	}


}

/* for - 994px
=========================================================================================== */

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

	.JS .playButton .icon-play img {
        width: 5em !important;
        height: 5em !important;
    }
	
	.JS .ShowU995 { display: block;}
	.JS .HideU995 { display: none;}

	/* ------ Contents Area ------ */

	.JS #Contents {
		padding-right: 0;
		padding-left: 0;
	}
	.JS .GridSet {
		margin: 0;
		padding-right: 15px;
	}

	/* --- [-] Case Study --- */
	.JS .CSContent {
		padding: 1.5em;
	}
	.JS .CSContent .icon {
		top: 1.2em;
		left: 1em;
	}

	/* --- Topics --- */
	.JS .GbcTop .TextStyle1 {
        margin-right: 0;
	}
	.JS .section-img-wrapper {
		margin-top: 9em;
	}
	.JS .section-img-wrapper .section-img-main {
		width: 100%;
	}
	.JS .section-img-wrapper .section-img-label {
		width: 50%;
		top: -4em;
		left: 50%;
		right: auto;
		margin-left: -25%;
	}
	.JS .topicAnalytics p {
        margin-left: 0;
	}

	.JS .CSCategory > dt {
	    font-size: 68%;
	}
	.JS .CSCategory > dt a {
		padding: 45px 0 5px;
	}

	/* --- Site Top --- */
	.ExploreOurStories {
		margin: 0 0 15em;
	}

	/* --- About Social Innovation --- */

	.JS .AboutDiagramContainer {
	}
	.JS .AboutDiagramContainer h4 {
		margin-bottom: 0;
	}
	.JS .AboutDiagramContainer p {
		display: none;
		font-size: 1px;
	}
	.JS .AboutDiagramContainer .society {
		top: 19.57040%;
		width: auto;
	}
	.JS .AboutDiagramContainer .govt {
		top: 21.53110%;
	}
	.JS .AboutDiagramContainer .corporations {
		top: 69.37799%;
	}
	.JS .AboutDiagramContainer .communities {
		top: 69.37799%;
	}

	.JS .AboutCarousel {
		margin: 0 !important;
		overflow: hidden;
	}
	.JS .AboutCarousel .carousel-items {
		overflow: hidden;
		height: auto;
	}
	.JS .AboutCarousel .carousel-item {
		float: left;
		position: relative;
		padding-right: 0;
		opacity: 1;
	}
	.JS .AboutCarousel .carousel-item-animation {
		position: static;
		height: auto;
		width: 100%;
	}
	.JS .AboutCarousel .top {
/*
		width: 100%;
		margin: 0 -15px;
*/
		height: auto;
	}
	.JS .AboutCarousel .bottom {
		position: relative;
		width: auto;
		padding: 0;
		height: 10em;
		margin-left: 10%;
		margin-right: 10%;
	}
	.JS .AboutCarousel .h3 {
		width: 62.5%;
		font-size: 1.5em;
		padding-right: 1em;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		height: auto;
		position: absolute;
		top: 50%;
		right: 0;
	}
	.JS .HideU995.AboutCarousel .h3 {
		height:0;
		width:0;
	}
	.JS .AboutCarousel .gray-block,
	.JS .AboutCarousel .carousel-item-img-container {
		width: 1px;
		height: 1px;
		display: none;
	}
	.JS .AboutCarousel .carousel-item-number {
		font-size: 2em;
		width: 37.5%;
		right: 0;
		left: auto;
		bottom: 0;
		width: 3em;
		height: 3em;
		top: auto;
		margin-left: 0 !important;
	}
	.JS .AboutCarousel p {
		margin: 5em 10% 0;
		height: 10em;
		width: auto;
	}
	.JS .AboutCarousel .carousel-item-nav {
		position: absolute;
		top: auto;
		bottom: 10.2em;
		-webkit-transform: none;
			-ms-transform: none;
				transform: none;
		left: 10%;
		right: 10%;
		width: auto;
		padding: 1em 0;
	}

	/* --- Solutions --- */

	.JS .CSCategoryContainer {
		display: none;
	}

.JS .SolutionItem {
	min-height: 0;
	padding: 3em 0;
}
.JS .SolutionItem .PageTop {
	margin-bottom: 0;
}
.JS .SolutionItem .SectionHeader {
	border-width: 0.3em;
	padding-left: 10%;
	padding-right: 10%;
	margin: 0 -15px;
}
.JS .SectionHeader .icon {
	font-size: 1.75em;
	position: static;
}
.JS .SectionHeader .h2 {
	margin: 0.5em 0 0.25em;
	font-size: 3em;
}
.JS .SectionHeader p {
	margin: 1em 0;
}
.JS .carousel {
	overflow: hidden;
	position: relative;
	margin: 2em 10%;
	height: auto;
	transition: max-height .3s ease;
}

.JS .carousel .carousel-items {
	overflow: hidden;
	margin-top: 0;
	width: 100%;
	height: auto;
}
.JS .carousel .carousel-item {
	float: left;
	position: relative;
	width: 100%;
	height: auto;
	margin-top: 0;
	overflow: hidden;
}
.JS .carousel .carousel-item-content {
	position: relative;
	width: 100%;
	height: 100%;
}
.JS .carousel .carousel-item .h3,
.JS .carousel .carousel-item .carousel-item-img-container,
.JS .carousel .carousel-item .number,
.JS .carousel .carousel-item p,
.JS .carousel .carousel-item ul {
	opacity: 1;
}
.JS .carousel .bg.half-1,
.JS .carousel .bg.half-2 {
	display: none;
}

.JS .carousel.left .carousel-item-img-container,
.JS .carousel.right .carousel-item-img-container {
	float: none !important;
    position: relative;
	top: 0;
	right: auto;
	bottom: auto;
	left: 0;
	width: 90%;
	height: 100%;
	z-index: 10;
}
.JS .carousel.left .carousel-item-img-container {
}
.JS .carousel.right .carousel-item-img-container {
}

.JS .carousel.left .carousel-item-text,
.JS .carousel.right .carousel-item-text {
	float: none !important;
    position: relative;
	top: 0;
	right: auto;
	bottom: auto;
	left: 0;
    width: 100%;
	height: 22em;
/*
	height: auto;
*/
	background-color: #FFF;
    z-index: 0;
	margin-top: -28%;
	padding: 30% 10% 2em;
}


.JS .carousel.right .carousel-item-text  {
}
.JS .carousel.left .carousel-item-text  {
}

.JS .carousel.show {
	max-height: 2em; }
.JS .carousel.show .btn.show {
	display: block; }
.JS .carousel.show .btn.hide {
	display: none; }
.JS .carousel.hide {
	max-height: 45em; }
.JS .carousel.hide .btn.show {
	display: none; }
.JS .carousel.hide .btn.hide {
	display: block; }

.JS .carousel .toggleButton {
	display: block;
	margin-bottom: 2em;
}
.JS .carousel .toggleButton a {
	padding: 0.5em 0 0.5em 2em;
	font-size: 1em;
	color: #fff;
	cursor: pointer;
	background: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_down_l_white_hd.gif) no-repeat 0 50%;
	background-size: 1.5em auto;
	-moz-background-size: 1.5em auto;
	-webkit-background-size: 1.5em auto;
	-o-background-size: 1.5em auto;
	-ms-background-size: 1.5em auto;
}
.JS .carousel .toggleButton a:link,
.JS .carousel .toggleButton a:visited {
	text-decoration: none;
}
.JS .carousel .toggleButton a:hover,
.JS .carousel .toggleButton a:active {
	text-decoration: underline;
}
.JS .carousel .toggleButton a.show {
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_down_l_white_hd.gif);
}
.JS .carousel .toggleButton a.hide {
	background-image: url(/-/media/project/hitachi/sib/image/en/r1/icon/icon_up_l_white_hd.gif);
}

.JS .carousel .carousel-item-nav,
.JS .carousel.right .carousel-item-nav {
	position: static;
	left: 50%;
	right: auto;
	-webkit-transform: translateX(105%);
		-ms-transform: translateX(105%);
			transform: translateX(105%);
	background-color: transparent;
	color: #fff;
	width: 30%;
}
.JS .carousel .carousel-item-nav .controls-direction .prev {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/carousel-arrow-left.svg);
}
.JS .carousel .carousel-item-nav .controls-direction .next {
	background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/carousel-arrow-right.svg);
}

}

/* for - 767px
=========================================================================================== */

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

	/* --- [c2] Heading --- */
	.JS h2.GbcStyle {
		font-size: 4em;
	}
	.JS h3.GbcStyle {
		font-size: 1.5em;
	}

	/* --- [-] Case Study --- */
	.JS .CSCategory > dt {
		float: none;
		width: 100%;
		font-size: 90%;
	}
	.JS .CSCategory > dt span {
		position: relative;
		display: block;
		border-width: 1px 1px 0 1px;
	}
	.JS .CSCategory > dt:last-of-type span {
		border-bottom-width: 1px;
	}
	.JS .CSCategory > dt:after {
		display: none;
	}
	.JS .CSCategory > dt span a {
		padding: 14px 42px 14px 60px;
		text-align: left;

		background-position: 15px 50%;
	}
	.JS .CSCategory > dt span a:after {
		content: "";
		position: absolute;
		display: block;
		width: 16px;
		height: 16px;
		top: 50%;
		right: 20px;
		margin: -8px 0 0;
		background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/arrow-down-gray.svg);
		background-repeat: no-repeat;
		background-size: 16px auto;
		-moz-background-size: 16px auto;
		-webkit-background-size: 16px auto;
		-o-background-size: 16px auto;
		-ms-background-size: 16px auto;
		opacity: 1;
	}
	.JS .CSCategory > dt.active span a:after {
		background-image: url(/-/media/project/hitachi/sib/image/en/add/gbc/arrow-up-gray.svg);
	}

	.JS .CaseStudy .img img {
		width: 100%;
	}
	.JS .CSContent {
		top: 0;
/*
		height: auto;
*/
		width: 100%;
	}


	/* --- Play You Tube --- */
	.JS #ModalAboutYouTube {padding: 50px 0;}
	.JS #ModalAboutYouTube .Title p {font-size: 83%;}


	/* --- Topics --- */
	.JS .GbcTop .TextStyle1 {
        margin-bottom: 2em;
	}
	.JS .section-img-wrapper {
		margin-top: 7em;
	}
	.JS .section-img-wrapper .section-img-label h3.GbcStyle {
		margin-bottom: 0;
		margin-top: 0.4em;
	}
	.JS .section-img-wrapper .section-img-main {
		position: relative;
	}
	.JS .section-img-wrapper .section-img-main .icon-play {
		width: 3.5em;
		height: 3.5em;
	}
	.JS .section-img-wrapper .section-img-main .icon-play img {
		width: 1em;
		height: 1em;
	}
	.JS .section-img-wrapper .section-img-label {
		width: 75%;
		left: 37.5%;
		right: auto;
		margin-left: -25%;
		top: 0em;
		padding: 1.5em 2em;
	}
	.JS .section-img-wrapper .section-img-label img {
		width: auto;
		height: 2.84em !important;
	}

	/* --- About Social Innovation --- */
	/* ------ Column ------ */
	.JS .GbcAbout .CaseStudy .ColumnSet {
		margin: 0;
	}
	.JS .GbcAbout .Grid4 .CaseStudy .Column2 {
		padding: 0;
	}

	.JS .AboutTopic .h3 {
		font-size: 4em;
	}
	.JS .AboutCarousel .h3 {
		font-size: 1em;
	}

	/* --- Site Top --- */
	.SectionBgImgContent {
		color: #333;
		top: 45%;
	}
	.SectionBgImgContent h2 {
		margin-left: 0;
		margin-right: 0;
	}
	.SectionBgImgContent p {
		width: 70%;
	}
	.ExploreOurStories {
		margin: 0 0 10em;
	}
	.ExploreOurStories .SectionBgImgContent p {
		width: 60%;
		font-size: 90%;
	}

	/* --- Our Stories --- */
	.OurStoriesCatchArea {
		left: 8%;
		bottom: 10%;
		top: inherit;
		-webkit-transform: translateY(0%);
		-ms-transform: translateY(0%);
		transform: translateY(0%);
	}
	.OurStoriesCatchArea a.watchNowButton {
		background-color: rgba(0,0,0,0.6);
	}
	.OurStoriesCatchArea a.watchNowButton:hover {
		background-color: rgba(0,0,0,0.8);
	}
	.JS h2.GbcStyle.GbcSmall {
		font-size: 2em;
	}
	.OurStoriesSI .OurStoriesSIText {
		margin-left: 16em;
	}
	.OurStoriesMovies h3 {
		margin-bottom: 0;
	}
	.OurStoriesMovies .MovieItems .MovieItem {
		padding-bottom: 2em;
	}
	.OurStoriesMovies .MovieItems .MovieItem img {
		width: 100%;
	}
	.OurStoriesMovies .MovieItems .MovieItem .MovieItemText p {
		margin-bottom: 0;
	}
	.OurStoriesMovies .MovieItems .MovieItem .MovieItemButton {
		position: static;
	}
	.OurStoriesMovies .bx-controls {
		margin-bottom: 2em;
	}
}

/* for - 579px
=========================================================================================== */

@media screen and (max-width: 579px) {
	/* --- [c2] Heading --- */
	.JS h2.GbcStyle {
		font-size: 2.5em;
	} 

	/* --- Topics --- */
	.JS .GbcTop .TextStyle1 {
        margin-bottom: 1em;
	}

	/* Branding Image */
	.JS .BrandingArea {
		padding-bottom: 76%;
	}
	.JS .playButton .icon-play {
		margin: 0 1em;
		width: 4em;
		height: 4em;
	}
	.JS .playButton .icon-play img {
		width: 4em !important;
		height: 4em !important;
	}

	/* --- Site Top --- */
	.ExploreOurStories .SectionBgImgContent {
		top: 50%;
	}
	.ExploreOurStories .SectionBgImgContent p {
		width: 55%;
		margin-bottom: 1em;
	}

	/* --- About Social Innovation --- */
	.JS .AboutTopic .h3 {
		font-size: 2.65em;
	}

	/* --- Our Stories --- */
	.OurStoriesCatchArea .OurStoriesCatch img {
		height: auto;
		width: 80%;
	}
	.OurStoriesSI .OurStoriesSIText {
		clear: both;
		margin-left: 0;
	}
}


/* for - 399px
=========================================================================================== */

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

	.JS .Grid4 ul.ColumnSet {
		margin: 0;
	}
	.JS .Grid4 li.Column2 {
		padding: 0;
	}

	/* --- About Social Innovation --- */
	.JS .AboutDiagramContainer .society {
        top: 12%;
        left: 75%;
	}
	.JS .AboutTopic .h3 {
		font-size: 2em;
	}
	.JS .AboutCarousel .bottom {
		margin-left: 5%;
		margin-right: 5%;
	}
	.JS .AboutCarousel p {
		margin-left: 5%;
		margin-right: 5%;
	}
	.JS .AboutCarousel .carousel-item-nav {
		left: 5%;
		right: 5%;
	}

	/* --- Solutions --- */

	.JS .SolutionItem .SectionHeader {
		padding-left: 5%;
		padding-right: 5%;
	}
	.JS .SectionHeader .h2 {
		font-size: 2.5em;
	}
	.JS .carousel {
		margin: 2em 5%;
	}
	.JS .carousel .toggleButton {
		margin-bottom: 1em;
	}
	.JS .carousel .toggleButton a {
		font-size: 0.75em;
	}
	.JS .carousel .carousel-item-nav,
	.JS .carousel.right .carousel-item-nav {
		width: 100% !important;
		-webkit-transform: translateX(0%);
			-ms-transform: translateX(0%);
				transform: translateX(0%);
	}

}


/* [-] Addition
=========================================================================================== */
p.Subheading {
	font-size: 129%;
	margin: 0 2em 1em;
}
.topBanner {
	width: 100%;
	margin: 0 16.66667% 5em 0;
}