@charset "utf-8";
/* CSS Document */

#hero_slide {
	opacity: 0;
	transition: opacity 0.6s;
}
#hero_slide.is-appear {
	opacity: 1;
}
/*heroArea__loading*/
.p-heroArea__loading {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 660px;
	height: 230px;
	background: url(/tech/green_infra/images/loading-icon.svg) no-repeat 50% 50%;
	opacity: 0.7;
	transition: opacity 0.5s;
	z-index: 0;
}
.p-heroArea__loading.is-hidden {
	opacity: 0;
}
/*  index_page_slide
---------------------------------------------------------- */
#index_slide {
	position: relative;
	display: flex;
	justify-content: flex-start;
	background: url("/tech/green_infra/images/index/bg_index_sl_btm.png") no-repeat 0px 100%;
	height: 252px;
}
#index_slide .slide_ctrl {
	position: absolute;
	top: 36px;
	left: 165px;
	z-index: 3;
}
.slide_btns {
	display: flex;
	justify-content: flex-start;
}
.slide_btns li {
	flex: 0 0 auto;
	width: 10px;
	margin-right: 9px;
}
.slide_btns li a {
	display: block;
	background-color: #32A05A;
	box-sizing: border-box;
	border: #C1E2CD 1px solid;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	transition: opacity 0.3s;
	overflow: hidden;
	text-indent: 1rem;
}
.slide_btns li.is-now a {
	background-color: #FFEC3F;
	border-color: #fff;
}
.slide_btns li a:hover {
	opacity: 0.7;
}
#index_slide .slide_box {
	flex: 0 0 auto;
	width: 660px;
	height: 230px;
	background-color: #1A8746;
}
#index_slide .slide_box li {
	cursor: pointer;
	/*display:none;*/
	position: absolute;
	z-index: 1;
	top: 0px;
	left: 0px;
	opacity: 0;
	transition: opacity 1.6s;
}
#index_slide .slide_box li.is-now {
	opacity: 1;
	z-index: 2;
}
#index_slide .slide_box li a{
	display: block;
	position: relative;
}
#index_slide .slide_box li a::before{
	content: "";
	display: block;
	position: absolute;
	top:0px; left: 0px;
	box-sizing: border-box;
	border: rgba(255,255,255,0.4) 1px solid;
	background-color: rgba(255,255,255,0.2);
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: all 0.3s;
}
#index_slide .slide_box:hover li a::before{
	opacity: 1;
	border-width: 6px;
}
.p-index_feature_area {
	flex: 0 0 auto;
	width: 300px;
	height: 230px;
	background: url(/tech/green_infra/images/index/bg_feature.png) no-repeat left top;
	text-align: center;
}
.p-index_feature_btns {
	margin: 76px auto 0;
	width: 286px;
}
.p-index_feature_btns li {
	border-radius: 6px;
	box-shadow: 1px 2px 12px -1px rgba(0,0,0,0.4);
	margin-bottom: 6px;
}
.p-index_feature_btns li a {
	display: block;
	position: relative;
	border-radius: 6px;
}
.p-index_feature_btns li a::before{
	content: "";
	display: block;
	position: absolute;
	top:0px; left: 0px;
	box-sizing: border-box;
	border: rgba(255,255,255,0.4) 1px solid;
	background-color: rgba(255,255,255,0.2);
	width: 100%;
	height: 100%;
	opacity: 0;
	border-radius: 4px;
	transition: all 0.3s;
}
.p-index_feature_btns li a:hover::before{
	opacity: 1;
	border-width: 6px;
}
/*  index_page_lead
---------------------------------------------------------- */

.main_lead {
	display: flex;
	justify-content: space-between;
}
.main_lead .lead_txt {
	width: 630px;
	font-weight: normal;
	float: none;
}
.main_lead .feature_btn {
	width: 300px;
	float: none;
}
.main_lead .feature_btn li a{
	position: relative;
	display: block;
}
.main_lead .feature_btn li a::before{
	content: "";
	display: block;
	position: absolute;
	top:0px; left: 0px;
	box-sizing: border-box;
	border: rgba(50,160,90,0.4) 1px solid;
	border-radius: 6px;
	background-color: rgba(195,228,183,0.2);
	width: 100%;
	height: 60px;
	opacity: 0;
	transition: all 0.3s;
}
.main_lead .feature_btn li.gi_tech a::before{
	height: 120px;
}
.main_lead .feature_btn li a:hover::before{
	opacity: 1;
	border-width: 6px;
}

div#main.tech_body.index .main_lead h2 {
	font-size: 1.5rem;
	margin-bottom: 1.5rem;
	color: #199B2B;
}
/*  index_page_tech_menu
---------------------------------------------------------- */
.p-tech_menu {
	margin: 1rem 0;
}
.p-tech_menu a {
	color: #212121;
	text-decoration: none;
}
.p-tech_menu * {
	box-sizing: border-box;
}
.p-tech_menu .col {
	flex: 0 0 auto;
	width: 300px;
	background: url("/tech/green_infra/images/index/bg_bn_btm.png") no-repeat 50% 100%;
	padding-bottom: 10px;
}
.p-tech_menu .p-content {
	height: 100%;
	border: #CAD2DD 1px solid;
	background-color: #fff;
	border-radius: 6px;
	position: relative;
	padding-bottom: 2.5rem;
	transition: all 0.3s;
}
.p-tech_menu .p-content.hover {
	background-color: #E3F2DD;
	border-color: #32A05A;
}
.p-tech_menu .p-content .p-more {
	display: inline-block;
	width: auto;
	padding: 0.25rem 0.25rem 0.25rem 1.75rem;
	position: absolute;
	right: 1rem;
	bottom: 0.75rem;
	border-radius: 4px;
	background: url("/tech/green_infra/images/index/arrow_green_large.svg") no-repeat 0.375rem 0.75rem;
}
#main .p-tech_menu .p-content h3 {
	margin: 0 0 0.25rem;
	padding: 5px;
}
.p-tech_menu .p-content .p-summary {
	padding: 0 1rem 1rem;
}
/*p-projects_list*/
.p-projects_list {
	padding: 0 0.75rem 1rem;
}
.p-projects_list li {
	padding: 1px 0;
	border-bottom: #ccc 1px solid;
	line-height: 1.7;
}
/*c-link*/

.c-link {
	padding: 0.5rem 0.25rem 0.5rem 1.75rem;
	display: block;
	border-radius: 4px;
	transition: all 0.3s;
	background: url("/tech/green_infra/images/index/arrow_green_large.svg") no-repeat 0.375rem 0.75rem;
}
.c-link:hover {
	background-color: #D5E9CC;
}